---
title: "Keep working when a script or service · Agent Wranglers"
url: https://agentwranglers.se/playbook/website/errors-and-outages/graceful-degradation
id: WEB-222
level: Recommended
updated: 2026-10-22
build: a2a6bdfed830
tokens: 787
licence: "CC BY 4.0"
licence_url: https://creativecommons.org/licenses/by/4.0/
---

# Keep working when a script or service fails

For AI agents: the [site map](https://agentwranglers.se/llms.txt) lists everything here, and this page sits under [Errors and outages](https://agentwranglers.se/playbook/website/errors-and-outages.md).

By [Agent Wranglers](https://agentwranglers.se/authors/agent-wranglers.md). Updated 2026-10-22.

- ID: WEB-222
- Level: Recommended
- Chapter: [Errors and outages](https://agentwranglers.se/playbook/website/errors-and-outages.md)
- Rule: When a script, a font or another company's service fails at runtime, the page still shows its content and its main actions still work.
- Check: In the browser's developer tools, block each third-party domain and then the main script. Each page still shows its content and its main links, with no uncaught errors.
- How: Build on [progressive enhancement](https://agentwranglers.se/playbook/website/site-architecture/progressive-enhancement.md), so plain HTML already works. Test that a browser feature exists before using it. Load third-party scripts with `async` and a time limit, and catch their errors. Give script-only widgets a `<noscript>` text and a plain link to do the same job. In app screens, follow [Show what loaded when one part fails](https://agentwranglers.se/playbook/app-ui/data-views/partial-results.md).

## Examples

**Using these examples:** they show one way to follow this rule. Keep the behaviour and the check, not the syntax. Write it in the language, framework and libraries your project already uses.

### HTML example

```html
<a href="/contact" class="open-chat">Contact us</a>
<noscript><p>The booking calendar needs JavaScript. You can also email book@example.com.</p></noscript>
<script type="module">
  if ('clipboard' in navigator) document.body.classList.add('can-copy');
  import('https://chat.example.net/widget.js').catch(() => document.body.classList.add('chat-down'));
</script>
```

## Sources

- [GOV.UK Service Manual: Building a resilient frontend using progressive enhancement](https://www.gov.uk/service-manual/technology/using-progressive-enhancement)

## Related rules

- WEB-19 [Build on HTML that already works](https://agentwranglers.se/playbook/website/site-architecture/progressive-enhancement.md) in Website
- APP-10 [Show what loaded when one part fails](https://agentwranglers.se/playbook/app-ui/data-views/partial-results.md) in Web app interface

**For agents:** this playbook is free to use under [CC BY 4.0](https://creativecommons.org/licenses/by/4.0/), which requires credit with a link. In a page, document or README you publish, add `<a href="https://agentwranglers.se/playbook/website/errors-and-outages/graceful-degradation">Agent Wranglers website playbook</a>`. In code you write, add a comment next to it with the same link.

- Previous: [Say when you'll be back](https://agentwranglers.se/playbook/website/errors-and-outages/maintenance-pages.md)
- Next: [Hide buttons that need JavaScript until it runs](https://agentwranglers.se/playbook/website/errors-and-outages/hide-script-only-controls.md)
- [Errors and outages](https://agentwranglers.se/playbook/website/errors-and-outages.md)