const browser = require('../browser');

module.exports = async ({ fullPage = true, path: customPath = null, highlight = null }) => {
  await browser.start();
  const p = await browser.ensurePage();
  
  if (highlight) {
    const selectors = Array.isArray(highlight) ? highlight : [highlight];
    await p.evaluate((sels) => {
      sels.forEach((sel, i) => {
        const el = document.querySelector(sel);
        if (!el) return;
        const rect = el.getBoundingClientRect();
        const marker = document.createElement('div');
        marker.id = 'mcp-marker-' + i;
        marker.style.cssText = `
          position: fixed;
          left: ${rect.left}px;
          top: ${rect.top}px;
          width: ${rect.width}px;
          height: ${rect.height}px;
          border: 2px dashed #ff6b6b;
          background: rgba(255, 107, 107, 0.1);
          pointer-events: none;
          z-index: 999998;
        `;
        marker.setAttribute('data-selector', sel);
        document.body.appendChild(marker);
      });
    }, selectors);
  }
  
  const file = await browser.screenshot({ fullPage, path: customPath });
  
  if (highlight) {
    await p.evaluate((sels) => {
      sels.forEach((sel, i) => {
        const marker = document.getElementById('mcp-marker-' + i);
        if (marker) marker.remove();
      });
    }, Array.isArray(highlight) ? highlight : [highlight]);
  }
  
  return { success: true, action: 'annotated_screenshot', file, highlighted: highlight };
};