scroll

Instructions

Implementation Reference

• src/tools/input.ts:107-183 (handler)

  Handler function that executes the scroll tool logic: calculates scroll deltas based on direction and amount, scrolls either a specific element or the page using scrollBy API with smooth option.

  async ({ direction, amount, selector, smooth, tabId }) => {
    const pageResult = await getPageForOperation(tabId);
    if (!pageResult.success) {
      return handleResult(pageResult);
    }
  
    const page = pageResult.data;
    const scrollDirection = (direction ?? 'down') as ScrollDirection;
    const scrollAmount = amount ?? 100;
    const useSmooth = smooth ?? true;
  
    try {
      // Calculate scroll deltas
      let deltaX = 0;
      let deltaY = 0;
  
      switch (scrollDirection) {
        case 'up':
          deltaY = -scrollAmount;
          break;
        case 'down':
          deltaY = scrollAmount;
          break;
        case 'left':
          deltaX = -scrollAmount;
          break;
        case 'right':
          deltaX = scrollAmount;
          break;
      }
  
      if (selector) {
        // Scroll specific element
        const element = await page.$(selector);
  
        if (!element) {
          return handleResult(err(selectorNotFound(selector)));
        }
  
        await element.evaluate(
          (el, dx, dy, smoothScroll) => {
            el.scrollBy({
              left: dx,
              top: dy,
              behavior: smoothScroll ? 'smooth' : 'auto',
            });
          },
          deltaX,
          deltaY,
          useSmooth
        );
      } else {
        // Scroll page
        await page.evaluate(
          (dx, dy, smoothScroll) => {
            window.scrollBy({
              left: dx,
              top: dy,
              behavior: smoothScroll ? 'smooth' : 'auto',
            });
          },
          deltaX,
          deltaY,
          useSmooth
        );
      }
  
      return handleResult(ok({
        scrolled: true,
        direction: scrollDirection,
        amount: scrollAmount,
        selector,
      }));
    } catch (error) {
      return handleResult(err(normalizeError(error)));
    }
  }

• src/schemas.ts:102-108 (schema)

  Zod schema defining the input parameters for the scroll tool, including direction, amount, optional selector and smooth flag.

  export const scrollSchema = z.object({
    direction: z.enum(['up', 'down', 'left', 'right']).optional().default('down'),
    amount: z.number().int().min(1).optional().default(100).describe('Scroll amount in pixels'),
    selector: z.string().optional().describe('Element to scroll (scrolls page if not specified)'),
    smooth: z.boolean().optional().default(true).describe('Use smooth scrolling'),
    tabId: tabIdSchema,
  });

• src/tools/input.ts:102-184 (registration)

  Registration of the scroll tool via server.tool call within registerInputTools function, specifying name, description, schema, and inline handler.

  // Scroll
  server.tool(
    'scroll',
    'Scroll the page or a specific element',
    scrollSchema.shape,
    async ({ direction, amount, selector, smooth, tabId }) => {
      const pageResult = await getPageForOperation(tabId);
      if (!pageResult.success) {
        return handleResult(pageResult);
      }
  
      const page = pageResult.data;
      const scrollDirection = (direction ?? 'down') as ScrollDirection;
      const scrollAmount = amount ?? 100;
      const useSmooth = smooth ?? true;
  
      try {
        // Calculate scroll deltas
        let deltaX = 0;
        let deltaY = 0;
  
        switch (scrollDirection) {
          case 'up':
            deltaY = -scrollAmount;
            break;
          case 'down':
            deltaY = scrollAmount;
            break;
          case 'left':
            deltaX = -scrollAmount;
            break;
          case 'right':
            deltaX = scrollAmount;
            break;
        }
  
        if (selector) {
          // Scroll specific element
          const element = await page.$(selector);
  
          if (!element) {
            return handleResult(err(selectorNotFound(selector)));
          }
  
          await element.evaluate(
            (el, dx, dy, smoothScroll) => {
              el.scrollBy({
                left: dx,
                top: dy,
                behavior: smoothScroll ? 'smooth' : 'auto',
              });
            },
            deltaX,
            deltaY,
            useSmooth
          );
        } else {
          // Scroll page
          await page.evaluate(
            (dx, dy, smoothScroll) => {
              window.scrollBy({
                left: dx,
                top: dy,
                behavior: smoothScroll ? 'smooth' : 'auto',
              });
            },
            deltaX,
            deltaY,
            useSmooth
          );
        }
  
        return handleResult(ok({
          scrolled: true,
          direction: scrollDirection,
          amount: scrollAmount,
          selector,
        }));
      } catch (error) {
        return handleResult(err(normalizeError(error)));
      }
    }
  );

• src/schemas.ts:212-212 (schema)

  TypeScript type definition for scroll tool input inferred from the schema.

  export type ScrollInput = z.infer<typeof scrollSchema>;

• src/types.ts:152-152 (helper)

  Type definition for scroll direction enum used in the tool.

  export type ScrollDirection = 'up' | 'down' | 'left' | 'right';