> For the complete documentation index, see [llms.txt](https://docs.bugbug.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.bugbug.io/debugging-tests/dom-snapshot.md).

# DOM Snapshot

When a test fails, BugBug automatically captures the full DOM structure of the page at the exact moment of failure. You can then inspect it using browser DevTools — just like inspecting a live page.

***

#### Enabling DOM snapshots

DOM snapshots are **enabled by default**. To change this setting, go to **Project Settings** and find the **Capture DOM on failure** section.

<figure><img src="/files/DlqrXU16NVHfgYKqAOM5" alt=""><figcaption></figcaption></figure>

***

#### How to access a DOM snapshot

DOM snapshots are available for test runs with a **Failed** or **Error** status.

1. Go to the **Runs history**
2. Click on the failed test run to open its details
3. Click the **Show DOM snapshot** button

![](/files/xeJnPe650F3aGMwANeRU)

The snapshot opens in a new browser tab, showing the page structure as it was when the test failed.

***

#### Inspecting the DOM snapshot

Once the snapshot is open, you can use **Chrome DevTools** to inspect the page just like you would on a live site.

1. Right-click anywhere on the page → **Inspect**, or press `F12`
2. Use the **Elements** panel to browse the HTML structure
3. Check element attributes, classes, and computed styles to understand why a selector may have failed to match

<figure><img src="/files/YLnGbN6ZQ9MFy9Qhhbgl" alt=""><figcaption></figcaption></figure>

***

#### Common debugging scenarios

**Selector not found**

Inspect the element BugBug was trying to interact with. Check if its attributes or structure have changed since the test was recorded.

**Assertion failed**

Find the element your assertion targeted and verify its actual content, value, or visibility state at the time of failure.

**Page loaded incorrectly**

Browse the DOM to see if key elements are missing, hidden, or rendered differently than expected.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.bugbug.io/debugging-tests/dom-snapshot.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
