'
+ );
+
+ assert.isTrue(isFixedPosition(vNode));
+ });
+
+ it('returns true for ancestor with "position: fixed" even when the element is positioned differently', () => {
+ const vNode = queryFixture(
+ '
'
+ );
+
+ assert.isTrue(isFixedPosition(vNode));
+ });
+
+ it('returns false on detached elements', function () {
+ var el = document.createElement('div');
+ el.innerHTML = 'I am not visible because I am detached!';
+
+ assert.isFalse(axe.commons.dom.isFixedPosition(el));
+ });
+
+ describe('options.skipAncestors', () => {
+ it('returns false for ancestor with "position: fixed"', () => {
+ const vNode = queryFixture(
+ '
'
+ );
+
+ assert.isFalse(isFixedPosition(vNode, { skipAncestors: true }));
+ });
+ });
+
+ describe('Shadow DOM', () => {
+ it('returns false when no element in the composed tree has position: fixed', () => {
+ const vNode = queryShadowFixture(
+ '',
+ ''
+ );
+ assert.isFalse(isFixedPosition(vNode));
+ });
+
+ it('returns true for element in shadow tree with position: fixed', () => {
+ const vNode = queryShadowFixture(
+ '',
+ ''
+ );
+
+ assert.isTrue(isFixedPosition(vNode));
+ });
+
+ it('returns true when ancestor outside shadow tree has position: fixed', () => {
+ const vNode = queryShadowFixture(
+ '
',
+ ''
+ );
+ assert.isTrue(isFixedPosition(vNode));
+ });
+
+ it('returns true when ancestor outside shadow is fixed and target in shadow has a different position', () => {
+ const vNode = queryShadowFixture(
+ '
',
+ ''
+ );
+ assert.isTrue(isFixedPosition(vNode));
+ });
+
+ it('returns false with skipAncestors when only ancestor outside shadow tree is fixed', () => {
+ const vNode = queryShadowFixture(
+ '
';
- var el = document.getElementById('target');
+ after(() => {
+ window.scrollTo(0, 0);
+ });
+
+ it('should be false for 0 height elements at the top of the viewport', () => {
+ assert.isFalse(isOffscreen(document.body));
+ assert.isFalse(isOffscreen(document.documentElement));
+
+ const vNode = queryFixture('');
+ assert.isFalse(isOffscreen(vNode));
+ });
- assert.isTrue(axe.commons.dom.isOffscreen(el));
+ it('should detect elements positioned outside the left edge', () => {
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
+ assert.isTrue(isOffscreen(vNode));
});
- it('should detect elements positioned to but not beyond the left edge', function () {
- fixture.innerHTML =
- '
Offscreen?
';
- var el = document.getElementById('target');
+ it('should detect elements positioned to but not beyond the left edge', () => {
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
- assert.isTrue(axe.commons.dom.isOffscreen(el));
+ assert.isTrue(isOffscreen(vNode));
});
- it('should not detect elements at the left edge with a zero width', function () {
- fixture.innerHTML =
- '';
- var el = document.getElementById('target');
+ it('should not detect elements at the left edge with a zero width', () => {
+ const vNode = queryFixture(
+ ''
+ );
- assert.isFalse(axe.commons.dom.isOffscreen(el));
+ assert.isFalse(isOffscreen(vNode));
});
- it('should detect elements positioned outside the top edge', function () {
- fixture.innerHTML =
- '
Offscreen?
';
- var el = document.getElementById('target');
- assert.isTrue(axe.commons.dom.isOffscreen(el));
+ it('should detect elements positioned outside the top edge', () => {
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
+ assert.isTrue(isOffscreen(vNode));
});
- it('should never detect elements positioned outside the bottom edge', function () {
- fixture.innerHTML =
- '
Offscreen?
';
- var el = document.getElementById('target');
+ it('should never detect elements positioned outside the bottom edge', () => {
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
- assert.isFalse(axe.commons.dom.isOffscreen(el));
+ assert.isFalse(isOffscreen(vNode));
});
- it('should detect elements positioned that bleed inside the left edge', function () {
- fixture.innerHTML =
- '
Offscreen?
';
- var el = document.getElementById('target');
+ it('should detect elements positioned that bleed inside the left edge', () => {
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
- assert.isFalse(axe.commons.dom.isOffscreen(el));
+ assert.isFalse(isOffscreen(vNode));
});
- it('should detect elements positioned outside the right edge', function () {
- fixture.innerHTML =
- '
Offscreen?
';
- var el = document.getElementById('target');
+ it('should detect elements positioned outside the right edge', () => {
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
- assert.isFalse(axe.commons.dom.isOffscreen(el));
+ assert.isFalse(isOffscreen(vNode));
});
- it('should detect elements positioned outside the top edge', function () {
- fixture.innerHTML =
- '
Offscreen?
';
- var el = document.getElementById('target');
+ it('should detect elements positioned outside the top edge', () => {
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
- assert.isFalse(axe.commons.dom.isOffscreen(el));
+ assert.isFalse(isOffscreen(vNode));
});
- it('should detect elements positioned outside the bottom edge', function () {
- fixture.innerHTML =
- '
Offscreen?
';
- var el = document.getElementById('target');
+ it('should detect elements positioned outside the bottom edge', () => {
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
- assert.isFalse(axe.commons.dom.isOffscreen(el));
+ assert.isFalse(isOffscreen(vNode));
});
- it('should detect elements that are made off-screen by a parent', function () {
- fixture.innerHTML =
- '
' +
- '
Offscreen?
' +
- '
';
-
- var el = document.getElementById('target');
+ it('should detect elements that are made off-screen by a parent', () => {
+ const vNode = queryFixture(`
+
+
Offscreen?
+
+ `);
- assert.isTrue(axe.commons.dom.isOffscreen(el));
+ assert.isTrue(isOffscreen(vNode));
});
- it('should NOT detect elements positioned outside the right edge on LTR documents', function () {
- fixture.innerHTML =
- '
Offscreen?
';
- var el = document.getElementById('target');
+ it('should NOT detect elements positioned outside the right edge on LTR documents', () => {
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
- assert.isFalse(axe.commons.dom.isOffscreen(el));
+ assert.isFalse(isOffscreen(vNode));
});
- it('should detect elements positioned outside the right edge on RTL documents', function () {
+ it('should detect elements positioned outside the right edge on RTL documents', () => {
document.body.style.direction = 'rtl';
- fixture.innerHTML =
- '
Offscreen?
';
- var el = document.getElementById('target');
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
+ assert.isTrue(isOffscreen(vNode));
+ });
- assert.isTrue(axe.commons.dom.isOffscreen(el));
+ it('should NOT detect elements positioned outside the left edge on RTL documents', () => {
+ document.body.style.direction = 'rtl';
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
+
+ assert.isFalse(isOffscreen(vNode));
});
- it('should NOT detect elements positioned outside the left edge on RTL documents', function () {
+ it('should detect elements positioned outside the right edge on RTL documents', () => {
document.body.style.direction = 'rtl';
- fixture.innerHTML =
- '
Offscreen?
';
- var el = document.getElementById('target');
-
- assert.isFalse(axe.commons.dom.isOffscreen(el));
- });
-
- it('should not detect elements positioned because of a scroll', function () {
- fixture.innerHTML =
- '
' +
- '
goobye
' +
- '
high
' +
- '
hello
' +
- '
';
- var viz = document.getElementById('visible');
- assert.isFalse(axe.commons.dom.isOffscreen(viz));
- var scrollme = document.getElementById('scrollme');
+ const vNode = queryFixture(
+ '
Offscreen?
'
+ );
+
+ assert.isTrue(isOffscreen(vNode));
+ });
+
+ it('should not detect elements positioned because of a scroll', () => {
+ fixtureSetup(`
+
+
goodbye
+
high
+
hello
+
+ `);
+ const viz = document.getElementById('visible');
+ assert.isFalse(isOffscreen(viz));
+ const scrollme = document.getElementById('scrollme');
scrollme.scrollIntoView();
- assert.isFalse(axe.commons.dom.isOffscreen(viz));
+ assert.isFalse(isOffscreen(viz));
});
- it('should return undefined if actual ndoe is undefined', function () {
- assert.isUndefined(axe.commons.dom.isOffscreen());
+ it('should return undefined if actual node is undefined', () => {
+ assert.isUndefined(isOffscreen());
});
- (shadowSupport.v1 ? it : xit)(
- 'should detect on screen shadow nodes',
- function () {
- fixture.innerHTML = '';
- var shadow = fixture.querySelector('div').attachShadow({ mode: 'open' });
- shadow.innerHTML = '
`
+ );
+ assert.isTrue(isOffscreen(vNode));
+ });
+
+ it('should consider elements in the viewport, but beyond the window size as on screen', () => {
+ const vNode = queryFixture(`
+
+
Hello World
+
+ Offscreen?
+
+
+ `);
+ assert.isFalse(isOffscreen(vNode));
+ });
+
+ it('should detect elements positioned outside the right edge (LTR)', () => {
+ const vNode = queryFixture(
+ `