# Browser Inner-Scroll Debugging

## The Problem

The `browser_scroll` tool scrolls the document viewport. But many React SPAs (like SPQ-v2) have a fixed layout where the scrollable content lives inside an inner element (e.g., `<main>` with `overflow-y-auto`). When `browser_scroll` fires, the document moves but the inner content stays put — buttons below the fold remain invisible and unclickable.

## Diagnosis

Use `browser_console` expression to check if a target button is below the viewport:

```javascript
(function(){
  var allBtns = document.querySelectorAll('button');
  for(var i=0; i<allBtns.length; i++) {
    var b = allBtns[i];
    if(b.textContent.includes('Save')) {
      return 'disabled=' + b.disabled +
        ' top=' + b.getBoundingClientRect().top +
        ' bottom=' + b.getBoundingClientRect().bottom +
        ' windowH=' + window.innerHeight;
    }
  }
  return 'not found';
})()
```

If `bottom > windowH`, the button is off-screen and can't be clicked by the browser tool.

## Fix

Scroll the inner scrollable container to reveal the button:

```javascript
(function(){
  var main = document.querySelector('main');
  if(main) {
    main.scrollTop = main.scrollHeight;
    return 'scrolled main to ' + main.scrollTop;
  }
  // Try other scrollable containers
  var candidates = document.querySelectorAll('[class*="overflow"]');
  for(var c of candidates) {
    if(c.scrollHeight > c.clientHeight) {
      c.scrollTop = c.scrollHeight;
      return 'scrolled ' + c.tagName + '.' + c.className.split(' ')[0] + ' to ' + c.scrollTop;
    }
  }
  return 'no scrollable container found';
})()
```

After scrolling, verify the button is now visible by re-running the diagnosis expression. A button is clickable when its `top` is between 0 and `windowH`.

## Pitfall

- The `browser_console` tool blocks access to `localStorage` but allows DOM queries like `querySelector` and `getBoundingClientRect` — use these for UI debugging.
- Some SPAs have MULTIPLE scrollable containers (sidebar, main content, modal overlays). Find the right one by checking `scrollHeight > clientHeight`.