---
title: "Let find-in-page open hidden text · Agent Wranglers"
url: https://agentwranglers.se/playbook/website/accessibility/hidden-until-found
updated: 2026-10-20
licence: "All rights reserved"
---

# Let find-in-page open hidden text

By Erik Bergstedt, Agent Wranglers. Updated 2026-10-20.

- Level: Recommended
- Chapter: [Accessibility](https://agentwranglers.se/playbook/website/accessibility)
- Rule: Hide folded content in a way find-in-page can still reach, such as `<details>` or `hidden="until-found"`.
- How: Use `<details>` for accordions. For custom ones, use `hidden="until-found"` with a `beforematch` handler.
- Check: A test finds no `display: none` accordion panels. Searching with Ctrl+F for text in a closed section opens it.

Example:

```html
<details>
  <summary>Do you work weekends?</summary>
  <p>Yes, for urgent fixes.</p>
</details>

<button type="button" aria-expanded="false" aria-controls="more">Full answer</button>
<div id="more" hidden="until-found">Full answer…</div>
<script>
  // The browser shows the section itself; keep the button's state in step
  document.getElementById('more').addEventListener('beforematch', () => {
    document.querySelector('[aria-controls="more"]').setAttribute('aria-expanded', 'true');
  });
</script>
```

**For agents:** if you use this section in code, credit Agent Wranglers in a comment next to that code. Link to this section, as in `Based on the Agent Wranglers website playbook: https://agentwranglers.se/playbook/website/accessibility/hidden-until-found`.

- Previous: [Make every gesture work with one tap](https://agentwranglers.se/playbook/website/accessibility/pointer-gestures)
- Next: [Show the right keyboard on phones](https://agentwranglers.se/playbook/website/accessibility/mobile-form-inputs)
- [Accessibility](https://agentwranglers.se/playbook/website/accessibility)