Highlight: type property

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

The type property of the Highlight interface is an enumerated String used to specify the meaning of the highlight. This allows assistive technologies, such as screen readers, to include this meaning when exposing the highlight to users.

By default, a highlight object will have its type set to highlight, but you can change it to spelling-error or grammar-error.

Value

The possible values of the type enumerated value are:

highlight

This is the default highlight type. It does not have any specific meaning.

spelling-error

Use this type when the highlight is used to emphasize misspelled content.

grammar-error

Use this type when the highlight is used to emphasize content that is grammatically incorrect.

Examples

js
const spellErrorRange = new Range();
spellErrorRange.setStart(textNode, 10);
spellErrorRange.setEnd(textNode, 20);

const spellErrorsHighlight = new Highlight(spellErrorRange);

spellErrorsHighlight.type = "spelling-error";

Specifications

Specification
CSS Custom Highlight API Module Level 1
# enumdef-highlighttype

Browser compatibility

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
type

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
In development. Supported in a pre-release version.
In development. Supported in a pre-release version.
No support
No support
See implementation notes.

See also