Brandon LiandClaude Opus 5
54221bbc0c
Builds the pipeline the autobuyer needs: see the page, find an element, click it. extension/ — MV3 Chromium extension. Polls /api/autobuyer/status and, while on, scrapes the target tab's HTML and posts it back. Also serves locate requests: focuses the window, scrolls the element into view, and reports its position. host_permissions is scoped to tradeify plus localhost so it cannot read other sites — an empty target pattern would otherwise capture whatever tab happened to be active, including banking or mail. app/api/autobuyer/ — status toggle, capture store, and the locate request queue. CORS is open because the extension's origin changes every time an unpacked extension is reloaded. app/autobuyer/page.tsx — ON switch, source view (default) and a rendered view. The render uses sandbox="allow-scripts" without allow-same-origin: the page's own JS is needed because sites ship content at opacity:0 and fade it in, but the frame must not reach the dashboard's same-origin API routes, which serve firm credentials. clicker/ — Python CLI. Asks the extension where a selector is, adds the element rect to the window's screen position and the browser chrome height to get desktop coordinates, then clicks with a human motion model (curved path, eased velocity, occasional overshoot, dwell before press). Raises the browser application first, since macOS consumes a click on an unfocused window rather than delivering it. Refuses to click when the element is covered by an overlay, when the coordinates fall off-screen, or when the browser cannot be confirmed frontmost. Verified: API round-trips, capture pruning, locate claim-once semantics, motion geometry and timing, and focus activation — the last two against stubs, since pyautogui and pyobjc are not installed here. NOT verified end to end: Chrome is still running a stale build of the extension, so a locate request has never completed against a real page and no real click has been sent. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
53 lines
2.0 KiB
JavaScript
53 lines
2.0 KiB
JavaScript
const FIELDS = ['apiBase', 'pollSeconds', 'targetUrlPattern', 'elementSelector'];
|
|
const DEFAULTS = {
|
|
apiBase: 'http://localhost:3000',
|
|
pollSeconds: 3,
|
|
targetUrlPattern: 'https://*.tradeify.co/*',
|
|
elementSelector: '',
|
|
};
|
|
|
|
async function load() {
|
|
const cfg = { ...DEFAULTS, ...(await chrome.storage.local.get(FIELDS)) };
|
|
for (const f of FIELDS) document.getElementById(f).value = cfg[f];
|
|
render();
|
|
}
|
|
|
|
async function render() {
|
|
const { state = {} } = await chrome.storage.local.get('state');
|
|
const color = !state.connected ? '#ef4444' : state.enabled ? '#22c55e' : '#94a3b8';
|
|
const label = !state.connected ? 'Disconnected' : state.enabled ? 'ON — capturing' : 'Connected — off';
|
|
|
|
const cap = state.lastCapture;
|
|
const detail = state.waiting
|
|
? `<div class="muted">${esc(state.waiting)}</div>`
|
|
: cap
|
|
? `<div class="muted">${esc(cap.title || cap.url)}<br>${(cap.bytes / 1024).toFixed(1)} KB · ${new Date(cap.at).toLocaleTimeString()}</div>`
|
|
: '';
|
|
|
|
document.getElementById('status').innerHTML =
|
|
`<span class="dot" style="background:${color}"></span><strong>${label}</strong>` +
|
|
detail +
|
|
(state.error ? `<div class="err">${esc(state.error)}</div>` : '');
|
|
}
|
|
|
|
document.getElementById('save').addEventListener('click', async () => {
|
|
const patch = {};
|
|
for (const f of FIELDS) patch[f] = document.getElementById(f).value.trim();
|
|
patch.pollSeconds = Number(patch.pollSeconds) || DEFAULTS.pollSeconds;
|
|
patch.apiBase = patch.apiBase || DEFAULTS.apiBase;
|
|
await chrome.storage.local.set(patch);
|
|
setTimeout(render, 400);
|
|
});
|
|
|
|
document.getElementById('now').addEventListener('click', () => {
|
|
chrome.runtime.sendMessage({ type: 'capture-now' }, () => setTimeout(render, 200));
|
|
});
|
|
|
|
chrome.storage.onChanged.addListener((c, area) => { if (area === 'local' && 'state' in c) render(); });
|
|
|
|
function esc(s) {
|
|
return String(s).replace(/[&<>"]/g, (ch) => ({ '&': '&', '<': '<', '>': '>', '"': '"' }[ch]));
|
|
}
|
|
|
|
load();
|