- assert.dom()
- DOMAssertions
Once installed the DOM element assertions are available at assert.dom(...).*:
Parameters
target(string | HTMLElement) A CSS selector that can be used to find elements usingquerySelector(), or an [HTMLElement][] (Not all assertions support both target types.) (optional, defaultrootElementordocument)rootElementHTMLElement? The root element of the DOM in which to search for thetarget(optional, defaultdocument)
Examples
test('the title exists', function(assert) {
assert.dom('#title').exists();
});- See: #doesNotExist
Assert an [HTMLElement][] (or multiple) matching the selector exists.
assert.dom('#title').exists();
assert.dom('.choice').exists({ count: 4 });- See: #exists
Assert an [HTMLElement][] matching the selector does not exists.
messagestring?
assert.dom('.should-not-exist').doesNotExist();- See: #isNotChecked
Assert that the [HTMLElement][] or an [HTMLElement][] matching the
selector is currently checked.
messagestring?
assert.dom('input.active').isChecked();- See: #isChecked
Assert that the [HTMLElement][] or an [HTMLElement][] matching the
selector is currently unchecked.
messagestring?
assert.dom('input.active').isNotChecked();- See: #isNotFocused
Assert that the [HTMLElement][] or an [HTMLElement][] matching the
selector is currently focused.
messagestring?
assert.dom('input.email').isFocused();- See: #isFocused
Assert that the [HTMLElement][] or an [HTMLElement][] matching the
selector is not currently focused.
messagestring?
assert.dom('input[type="password"]').isNotFocused();- See: #isNotRequired
Assert that the [HTMLElement][] or an [HTMLElement][] matching the
selector is currently required.
messagestring?
assert.dom('input[type="text"]').isRequired();- See: #isRequired
Assert that the [HTMLElement][] or an [HTMLElement][] matching the
selector is currently not required.
messagestring?
assert.dom('input[type="text"]').isNotRequired();- See: #isNotVisible
Assert that the [HTMLElement][] or an [HTMLElement][] matching the
selector exists and is visible.
Visibility is determined by asserting that:
- the element's offsetWidth and offsetHeight are non-zero
- any of the element's DOMRect objects have a non-zero size
Additionally, visibility in this case means that the element is visible on the page, but not necessarily in the viewport.
messagestring?
assert.dom('.foo').isVisible();- See: #isVisible
Assert that the [HTMLElement][] or an [HTMLElement][] matching the
selector does not exist or is not visible on the page.
Visibility is determined by asserting that:
- the element's offsetWidth or offsetHeight are zero
- all of the element's DOMRect objects have a size of zero
Additionally, visibility in this case means that the element is visible on the page, but not necessarily in the viewport.
messagestring?
assert.dom('.foo').isNotVisible();Assert that the [HTMLElement][] has an attribute with the provided name
and optionally checks if the attribute value matches the provided text
or regular expression.
assert.dom('input.password-input').hasAttribute('type', 'password');- See: #hasAttribute
Assert that the [HTMLElement][] has no attribute with the provided name.
Aliases: hasNoAttribute, lacksAttribute
assert.dom('input.username').hasNoAttribute('disabled');- See: #isNotDisabled
Assert that the [HTMLElement][] or an [HTMLElement][] matching the
selector is disabled.
messagestring?
assert.dom('.foo').isDisabled();- See: #isDisabled
Assert that the [HTMLElement][] or an [HTMLElement][] matching the
selector is not disabled.
messagestring?
assert.dom('.foo').isNotDisabled();- See: #doesNotHaveClass
Assert that the [HTMLElement][] has the expected CSS class using
classList.
assert.dom('input[type="password"]').hasClass('secret-password-input');- See: #hasClass
Assert that the [HTMLElement][] does not have the expected CSS class using
classList.
Aliases: hasNoClass, lacksClass
assert.dom('input[type="password"]').doesNotHaveClass('username-input');- See: #includesText
Assert that the text of the [HTMLElement][] or an [HTMLElement][]
matching the selector matches the expected text, using the
textContent
attribute and stripping/collapsing whitespace.
expected can also be a regular expression.
Aliases: matchesText
// <h2 id="title">
// Welcome to <b>QUnit</b>
// </h2>
assert.dom('#title').hasText('Welcome to QUnit');assert.dom('.foo').hasText(/[12]\d{3}/);- See: #hasText
Assert that the textContent property of an [HTMLElement][] is not empty.
messagestring?
assert.dom('button.share').hasAnyText();- See: #hasText
Assert that the text of the [HTMLElement][] or an [HTMLElement][]
matching the selector contains the given text, using the
textContent
attribute.
Aliases: containsText, hasTextContaining
assert.dom('#title').includesText('Welcome');Assert that the text of the [HTMLElement][] or an [HTMLElement][]
matching the selector does not include the given text, using the
textContent
attribute.
Aliases: doesNotContainText, doesNotHaveTextContaining
assert.dom('#title').doesNotIncludeText('Welcome');- See: #hasAnyValue
- See: #hasNoValue
Assert that the value property of an [HTMLInputElement][] matches
the expected text or regular expression.
If no expected value is provided, the assertion will fail if the
value is an empty string.
assert.dom('input.username').hasValue('HSimpson');- See: #hasValue
- See: #hasNoValue
Assert that the value property of an [HTMLInputElement][] is not empty.
messagestring?
assert.dom('input.username').hasAnyValue();- See: #hasValue
- See: #hasAnyValue
Assert that the value property of an [HTMLInputElement][] is empty.
Aliases: lacksValue
messagestring?
assert.dom('input.username').hasNoValue();