Interface ElementInternals

The ElementInternals interface of the Document Object Model gives web developers a way to allow custom elements to fully participate in HTML forms. It provides utilities for working with these elements in the same way you would work with any standard HTML form element, and also exposes the Accessibility Object Model to the element.

interface ElementInternals {
    ariaActiveDescendantElement: Element | null;
    ariaAtomic: string | null;
    ariaAutoComplete: string | null;
    ariaBrailleLabel: string | null;
    ariaBrailleRoleDescription: string | null;
    ariaBusy: string | null;
    ariaChecked: string | null;
    ariaColCount: string | null;
    ariaColIndex: string | null;
    ariaColIndexText: string | null;
    ariaColSpan: string | null;
    ariaControlsElements: readonly Element[] | null;
    ariaCurrent: string | null;
    ariaDescribedByElements: readonly Element[] | null;
    ariaDescription: string | null;
    ariaDetailsElements: readonly Element[] | null;
    ariaDisabled: string | null;
    ariaErrorMessageElements: readonly Element[] | null;
    ariaExpanded: string | null;
    ariaFlowToElements: readonly Element[] | null;
    ariaHasPopup: string | null;
    ariaHidden: string | null;
    ariaInvalid: string | null;
    ariaKeyShortcuts: string | null;
    ariaLabel: string | null;
    ariaLabelledByElements: readonly Element[] | null;
    ariaLevel: string | null;
    ariaLive: string | null;
    ariaModal: string | null;
    ariaMultiLine: string | null;
    ariaMultiSelectable: string | null;
    ariaOrientation: string | null;
    ariaOwnsElements: readonly Element[] | null;
    ariaPlaceholder: string | null;
    ariaPosInSet: string | null;
    ariaPressed: string | null;
    ariaReadOnly: string | null;
    ariaRelevant: string | null;
    ariaRequired: string | null;
    ariaRoleDescription: string | null;
    ariaRowCount: string | null;
    ariaRowIndex: string | null;
    ariaRowIndexText: string | null;
    ariaRowSpan: string | null;
    ariaSelected: string | null;
    ariaSetSize: string | null;
    ariaSort: string | null;
    ariaValueMax: string | null;
    ariaValueMin: string | null;
    ariaValueNow: string | null;
    ariaValueText: string | null;
    form: HTMLFormElement | null;
    labels: NodeList;
    role: string | null;
    shadowRoot: ShadowRoot | null;
    states: CustomStateSet;
    validationMessage: string;
    validity: ValidityState;
    willValidate: boolean;
    checkValidity(): boolean;
    reportValidity(): boolean;
    setFormValue(
        value: string | File | FormData | null,
        state?: string | File | FormData | null,
    ): void;
    setValidity(
        flags?: ValidityStateFlags,
        message?: string,
        anchor?: HTMLElement,
    ): void;
}

Hierarchy (View Summary)

ARIAMixin
- ElementInternals

Index

Properties

Methods

checkValidity reportValidity setFormValue setValidity

Properties

ariaActiveDescendantElement

ariaActiveDescendantElement: Element | null

ariaAtomic

ariaAtomic: string | null

ariaAutoComplete

ariaAutoComplete: string | null

ariaBrailleLabel

ariaBrailleLabel: string | null

ariaBrailleRoleDescription

ariaBrailleRoleDescription: string | null

ariaBusy

ariaBusy: string | null

ariaChecked

ariaChecked: string | null

ariaColCount

ariaColCount: string | null

ariaColIndex

ariaColIndex: string | null

ariaColIndexText

ariaColIndexText: string | null

ariaColSpan

ariaColSpan: string | null

ariaControlsElements

ariaControlsElements: readonly Element[] | null

ariaCurrent

ariaCurrent: string | null

ariaDescribedByElements

ariaDescribedByElements: readonly Element[] | null

ariaDescription

ariaDescription: string | null

ariaDetailsElements

ariaDetailsElements: readonly Element[] | null

ariaDisabled

ariaDisabled: string | null

ariaErrorMessageElements

ariaErrorMessageElements: readonly Element[] | null

ariaExpanded

ariaExpanded: string | null

ariaFlowToElements

ariaFlowToElements: readonly Element[] | null

ariaHasPopup

ariaHasPopup: string | null

ariaHidden

ariaHidden: string | null

ariaInvalid

ariaInvalid: string | null

ariaKeyShortcuts

ariaKeyShortcuts: string | null

ariaLabel

ariaLabel: string | null

ariaLabelledByElements

ariaLabelledByElements: readonly Element[] | null

ariaLevel

ariaLevel: string | null

ariaLive

ariaLive: string | null

ariaModal

ariaModal: string | null

ariaMultiLine

ariaMultiLine: string | null

ariaMultiSelectable

ariaMultiSelectable: string | null

ariaOrientation

ariaOrientation: string | null

ariaOwnsElements

ariaOwnsElements: readonly Element[] | null

ariaPlaceholder

ariaPlaceholder: string | null

ariaPosInSet

ariaPosInSet: string | null

ariaPressed

ariaPressed: string | null

ariaReadOnly

ariaReadOnly: string | null

ariaRelevant

ariaRelevant: string | null

ariaRequired

ariaRequired: string | null

ariaRoleDescription

ariaRoleDescription: string | null

ariaRowCount

ariaRowCount: string | null

ariaRowIndex

ariaRowIndex: string | null

ariaRowIndexText

ariaRowIndexText: string | null

ariaRowSpan

ariaRowSpan: string | null

ariaSelected

ariaSelected: string | null

ariaSetSize

ariaSetSize: string | null

ariaSort

ariaSort: string | null

ariaValueMax

ariaValueMax: string | null

ariaValueMin

ariaValueMin: string | null

ariaValueNow

ariaValueNow: string | null

ariaValueText

ariaValueText: string | null

`Readonly`form

form: HTMLFormElement | null

The form read-only property of the ElementInternals interface returns the HTMLFormElement associated with this element.

`Readonly`labels

labels: NodeList

The labels read-only property of the ElementInternals interface returns the labels associated with the element.

role

role: string | null

`Readonly`shadowRoot

shadowRoot: ShadowRoot | null

The shadowRoot read-only property of the ElementInternals interface returns the ShadowRoot for this element.

`Readonly`states

states: CustomStateSet

The states read-only property of the ElementInternals interface returns a CustomStateSet representing the possible states of the custom element.

`Readonly`validationMessage

validationMessage: string

The validationMessage read-only property of the ElementInternals interface returns the validation message for the element.

`Readonly`validity

validity: ValidityState

The validity read-only property of the ElementInternals interface returns a ValidityState object which represents the different validity states the element can be in, with respect to constraint validation.

`Readonly`willValidate

willValidate: boolean

The willValidate read-only property of the ElementInternals interface returns true if the element is a submittable element that is a candidate for constraint validation.

Methods

checkValidity

checkValidity(): boolean
The checkValidity() method of the ElementInternals interface checks if the element meets any constraint validation rules applied to it.

MDN Reference

Returns boolean

reportValidity

reportValidity(): boolean
The reportValidity() method of the ElementInternals interface checks if the element meets any constraint validation rules applied to it.

MDN Reference

Returns boolean

setFormValue

setFormValue(
value: string | File | FormData | null,
state?: string | File | FormData | null,
): void
The setFormValue() method of the ElementInternals interface sets the element's submission value and state, communicating these to the user agent.

MDN Reference
Parameters
- value: string | File | FormData | null
- Optionalstate: string | File | FormData | null
Returns void

setValidity

setValidity(
    flags?: ValidityStateFlags,
    message?: string,
    anchor?: HTMLElement,
): void
The setValidity() method of the ElementInternals interface sets the validity of the element.

MDN Reference
Parameters
- Optionalflags: ValidityStateFlags
- Optionalmessage: string
- Optionalanchor: HTMLElement
Returns void