JavaScript enabled

Description #Link to section description

The JavaScript enabled input is a hidden field marked is="ds-input-javascript-enabled". The server renders it with a false value; when the web component upgrades it sets the value to true.

Use it when the server needs to know whether the progressive enhancements ran, for example to decide whether to trust a value another component filled in. Load the component with a <link rel="modulepreload"> for ds-input-javascript-enabled.js; the Svelte component does not add one.

Example #Link to section example

Accessibility #Link to section accessibility

• The field is type="hidden", so it is not announced and takes no focus.
• The form must still work when the value is false; never block a submission because JavaScript did not run.

References #Link to section references

• Customized built-in elements(opens in new tab) — MDN

Related #Link to section related

• Timezone — another hidden field filled on upgrade
• Browser up to date — a hidden field that reports an outdated browser

Variables #Link to section variables

• id — defaults to javascript-enabled
• name — defaults to the id
• value — defaults to false