{
  "doc": {
    "id": "api/commands/scrollintoview",
    "title": "cy.scrollIntoView()",
    "description": "Scroll an element into view in Cypress.",
    "section": "api",
    "source_path": "/llm/markdown/api/commands/scrollintoview.md",
    "version": "3b85801b725bd02bf0cb58cedaf42944712cdc72",
    "updated_at": "2026-07-12T03:11:07.806Z",
    "headings": [
      {
        "id": "api/commands/scrollintoview#scrollintoview",
        "text": "scrollIntoView",
        "level": 1
      },
      {
        "id": "api/commands/scrollintoview#syntax",
        "text": "Syntax",
        "level": 2
      },
      {
        "id": "api/commands/scrollintoview#usage",
        "text": "Usage",
        "level": 3
      },
      {
        "id": "api/commands/scrollintoview#arguments",
        "text": "Arguments",
        "level": 3
      },
      {
        "id": "api/commands/scrollintoview#yields",
        "text": "Yields",
        "level": 3
      },
      {
        "id": "api/commands/scrollintoview#examples",
        "text": "Examples",
        "level": 2
      },
      {
        "id": "api/commands/scrollintoview#scrolling",
        "text": "Scrolling",
        "level": 3
      },
      {
        "id": "api/commands/scrollintoview#options",
        "text": "Options",
        "level": 3
      },
      {
        "id": "api/commands/scrollintoview#use-linear-easing-animation-to-scroll",
        "text": "Use linear easing animation to scroll",
        "level": 4
      },
      {
        "id": "api/commands/scrollintoview#scroll-to-element-over-2000ms",
        "text": "Scroll to element over 2000ms",
        "level": 4
      },
      {
        "id": "api/commands/scrollintoview#scroll-150px-below-an-element",
        "text": "Scroll 150px below an element",
        "level": 4
      },
      {
        "id": "api/commands/scrollintoview#notes",
        "text": "Notes",
        "level": 2
      },
      {
        "id": "api/commands/scrollintoview#snapshots",
        "text": "Snapshots",
        "level": 3
      },
      {
        "id": "api/commands/scrollintoview#snapshots-do-not-reflect-scroll-behavior",
        "text": "Snapshots do not reflect scroll behavior",
        "level": 4
      },
      {
        "id": "api/commands/scrollintoview#rules",
        "text": "Rules",
        "level": 2
      },
      {
        "id": "api/commands/scrollintoview#requirements",
        "text": "Requirements",
        "level": 3
      },
      {
        "id": "api/commands/scrollintoview#assertions",
        "text": "Assertions",
        "level": 3
      },
      {
        "id": "api/commands/scrollintoview#timeouts",
        "text": "Timeouts",
        "level": 3
      },
      {
        "id": "api/commands/scrollintoview#command-log",
        "text": "Command Log",
        "level": 2
      },
      {
        "id": "api/commands/scrollintoview#see-also",
        "text": "See also",
        "level": 2
      }
    ]
  },
  "content": {
    "type": "root",
    "children": [
      {
        "type": "heading",
        "depth": 1,
        "children": [
          {
            "type": "text",
            "value": "scrollIntoView"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Scroll an element into view."
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "It is "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/app/core-concepts/retry-ability.md#Only-queries-are-retried",
            "children": [
              {
                "type": "text",
                "value": "unsafe"
              }
            ]
          },
          {
            "type": "text",
            "value": " to chain further commands that rely on the subject after `.scrollIntoView()`."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "Syntax"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": ".scrollIntoView().scrollIntoView(options)"
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Usage"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Correct Usage"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "cy.get('footer').scrollIntoView() // Scrolls 'footer' into view"
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Incorrect Usage"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "cy.scrollIntoView('footer') // Errors, cannot be chained off 'cy'cy.window().scrollIntoView() // Errors, 'window' does not yield DOM element"
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Arguments"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "options (Object)"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Pass in an options object to change the default behavior of `.scrollIntoView()`."
          }
        ]
      },
      {
        "type": "table",
        "align": [
          null,
          null,
          null
        ],
        "children": [
          {
            "type": "tableRow",
            "children": [
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "Option"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "Default"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "Description"
                  }
                ]
              }
            ]
          },
          {
            "type": "tableRow",
            "children": [
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "`duration`"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "`0`"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "Scrolls over the duration (in ms)"
                  }
                ]
              }
            ]
          },
          {
            "type": "tableRow",
            "children": [
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "`easing`"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "`swing`"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "Will scroll with the easing animation"
                  }
                ]
              }
            ]
          },
          {
            "type": "tableRow",
            "children": [
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "`log`"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "`true`"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "Displays the command in the "
                  },
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/app/core-concepts/open-mode.md#Command-Log",
                    "children": [
                      {
                        "type": "text",
                        "value": "Command log"
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            "type": "tableRow",
            "children": [
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "`offset`"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "`{top: 0, left: 0}`"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "Amount to scroll after the element has been scrolled into view"
                  }
                ]
              }
            ]
          },
          {
            "type": "tableRow",
            "children": [
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "`timeout`"
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/app/references/configuration.md#Timeouts",
                    "children": [
                      {
                        "type": "text",
                        "value": "`defaultCommandTimeout`"
                      }
                    ]
                  }
                ]
              },
              {
                "type": "tableCell",
                "children": [
                  {
                    "type": "text",
                    "value": "Time to wait for `.scrollIntoView()` to resolve before "
                  },
                  {
                    "type": "link",
                    "title": null,
                    "url": "#Timeouts",
                    "children": [
                      {
                        "type": "text",
                        "value": "timing out"
                      }
                    ]
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Yields"
          }
        ]
      },
      {
        "type": "list",
        "ordered": false,
        "start": null,
        "spread": false,
        "children": [
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "`.scrollIntoView()` yields the same subject it was given."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "It is "
                  },
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/app/core-concepts/retry-ability.md#Only-queries-are-retried",
                    "children": [
                      {
                        "type": "text",
                        "value": "unsafe"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": " to chain further commands that rely on the subject after `.scrollIntoView()`."
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "Examples"
          }
        ]
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Scrolling"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "cy.get('button#checkout').scrollIntoView()cy.get('button#checkout').should('be.visible')"
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Options"
          }
        ]
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Use linear easing animation to scroll"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "cy.get('.next-page').scrollIntoView({ easing: 'linear' })"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Scroll to element over 2000ms"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "cy.get('footer').scrollIntoView({ duration: 2000 })"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Scroll 150px below an element"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "cy.get('#nav').scrollIntoView({ offset: { top: 150, left: 0 } })"
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "Notes"
          }
        ]
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Snapshots"
          }
        ]
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Snapshots do not reflect scroll behavior"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Cypress does not reflect the accurate scroll positions of any elements within snapshots. If you want to see the actual scrolling behavior in action, we recommend using "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/api/commands/pause.md",
            "children": [
              {
                "type": "text",
                "value": "`.pause()`"
              }
            ]
          },
          {
            "type": "text",
            "value": " to walk through each command or "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/app/guides/screenshots-and-videos.md#Videos",
            "children": [
              {
                "type": "text",
                "value": "watching the video of the test run"
              }
            ]
          },
          {
            "type": "text",
            "value": "."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "Rules"
          }
        ]
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Requirements"
          }
        ]
      },
      {
        "type": "list",
        "ordered": false,
        "start": null,
        "spread": false,
        "children": [
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "`.scrollIntoView()` requires being chained off a command that yields DOM element(s)."
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Assertions"
          }
        ]
      },
      {
        "type": "list",
        "ordered": false,
        "start": null,
        "spread": false,
        "children": [
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "`.scrollIntoView()` itself will not be retried — it fires once. Assertions chained after `.scrollIntoView()` will be retried until they pass or time out. See "
                  },
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/app/core-concepts/retry-ability.md#Only-queries-are-retried",
                    "children": [
                      {
                        "type": "text",
                        "value": "Only queries are retried"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": "."
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Timeouts"
          }
        ]
      },
      {
        "type": "list",
        "ordered": false,
        "start": null,
        "spread": false,
        "children": [
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "`.scrollIntoView()` can time out waiting for assertions you've added to pass."
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "Command Log"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Assert element is visible after scrolling it into view"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "cy.get('#scroll-horizontal button').scrollIntoView()cy.get('#scroll-horizontal button').should('be.visible')"
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "The commands above will display in the Command Log as:"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "When clicking on the `scrollintoview` command within the command log, the console outputs the following:"
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "See also"
          }
        ]
      },
      {
        "type": "list",
        "ordered": false,
        "start": null,
        "spread": false,
        "children": [
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/api/commands/scrollto.md",
                    "children": [
                      {
                        "type": "text",
                        "value": "`cy.scrollTo()`"
                      }
                    ]
                  }
                ]
              }
            ]
          }
        ]
      }
    ]
  },
  "token_estimate": 531
}