-
https://blog.adobe.com/en/publish/2022/12/07/kah-milah-ledgester-breathes-life-into-award-winning-art-with-adobe-creative-cloud
diff --git a/test/blocks/global-navigation/global-navigation.test.js b/test/blocks/global-navigation/global-navigation.test.js
index 945328606d..b260ee3f21 100644
--- a/test/blocks/global-navigation/global-navigation.test.js
+++ b/test/blocks/global-navigation/global-navigation.test.js
@@ -10,6 +10,7 @@ import {
viewports,
unavLocalesTestData,
analyticsTestData,
+ unavVersion,
} from './test-utilities.js';
import { setConfig, getLocale } from '../../../libs/utils/utils.js';
import initGnav, { getUniversalNavLocale, osMap } from '../../../libs/blocks/global-navigation/global-navigation.js';
@@ -27,7 +28,7 @@ describe('global navigation', () => {
before(() => {
document.head.innerHTML = `
-
+
`;
});
@@ -366,8 +367,8 @@ describe('global navigation', () => {
toFake: ['setTimeout'],
shouldAdvanceTime: true,
});
- window.UniversalNav = sinon.spy();
- window.UniversalNav.reload = sinon.spy();
+ window.UniversalNav = sinon.spy(() => Promise.resolve());
+ window.UniversalNav.reload = sinon.spy(() => Promise.resolve());
// eslint-disable-next-line no-underscore-dangle
window._satellite = { track: sinon.spy() };
window.alloy = () => new Promise((resolve) => {
@@ -578,7 +579,7 @@ describe('global navigation', () => {
document.head.innerHTML = `
-
+
`;
const gnav = await createFullGlobalNavigation({});
gnav.decorateAppPrompt();
@@ -592,7 +593,7 @@ describe('global navigation', () => {
-
+
`;
const gnav = await createFullGlobalNavigation({});
window.adobeIMS = { isSignedInUser: () => true };
diff --git a/test/blocks/global-navigation/gnav-brand.test.js b/test/blocks/global-navigation/gnav-brand.test.js
index 3150a0fa7f..9b0917fbed 100644
--- a/test/blocks/global-navigation/gnav-brand.test.js
+++ b/test/blocks/global-navigation/gnav-brand.test.js
@@ -4,6 +4,7 @@ import {
createFullGlobalNavigation,
selectors,
isElementVisible,
+ unavVersion,
} from './test-utilities.js';
import logoOnlyNav from './mocks/global-navigation-only-logo.plain.js';
import brandOnlyNav from './mocks/global-navigation-only-brand.plain.js';
@@ -15,7 +16,7 @@ describe('brand', () => {
before(() => {
document.head.innerHTML = `
-
+
`;
});
diff --git a/test/blocks/global-navigation/gnav-cross-cloud.test.js b/test/blocks/global-navigation/gnav-cross-cloud.test.js
index 9bd2986ddd..000fc0372b 100644
--- a/test/blocks/global-navigation/gnav-cross-cloud.test.js
+++ b/test/blocks/global-navigation/gnav-cross-cloud.test.js
@@ -4,6 +4,7 @@ import {
createFullGlobalNavigation,
selectors,
isElementVisible,
+ unavVersion,
} from './test-utilities.js';
import globalNavigationCrossCloud from './mocks/global-navigation-cross-cloud.plain.js';
@@ -11,7 +12,7 @@ describe('Cross Cloud Menu', () => {
before(() => {
document.head.innerHTML = `
-
+
`;
});
diff --git a/test/blocks/global-navigation/gnav-main-nav-popup.test.js b/test/blocks/global-navigation/gnav-main-nav-popup.test.js
index 25e80c908b..3799a07514 100644
--- a/test/blocks/global-navigation/gnav-main-nav-popup.test.js
+++ b/test/blocks/global-navigation/gnav-main-nav-popup.test.js
@@ -5,6 +5,7 @@ import {
createFullGlobalNavigation,
selectors,
isElementVisible,
+ unavVersion,
} from './test-utilities.js';
import { toFragment } from '../../../libs/blocks/global-navigation/utilities/utilities.js';
import globalNavigationMock from './mocks/global-navigation.plain.js';
@@ -14,7 +15,7 @@ describe('main nav popups', () => {
before(() => {
document.head.innerHTML = `
-
+
`;
});
diff --git a/test/blocks/global-navigation/gnav-main-nav.test.js b/test/blocks/global-navigation/gnav-main-nav.test.js
index ef984078f2..5a09cb5518 100644
--- a/test/blocks/global-navigation/gnav-main-nav.test.js
+++ b/test/blocks/global-navigation/gnav-main-nav.test.js
@@ -7,6 +7,7 @@ import {
selectors,
isElementVisible,
viewports,
+ unavVersion,
} from './test-utilities.js';
import { isDesktop, setActiveLink, toFragment } from '../../../libs/blocks/global-navigation/utilities/utilities.js';
import globalNavigationActiveMock from './mocks/global-navigation-active.plain.js';
@@ -15,7 +16,7 @@ describe('main nav', () => {
before(() => {
document.head.innerHTML = `
-
+
`;
});
diff --git a/test/blocks/global-navigation/gnav-profile.test.js b/test/blocks/global-navigation/gnav-profile.test.js
index bc1210e4cd..0594568243 100644
--- a/test/blocks/global-navigation/gnav-profile.test.js
+++ b/test/blocks/global-navigation/gnav-profile.test.js
@@ -5,6 +5,7 @@ import {
createFullGlobalNavigation,
selectors,
isElementVisible,
+ unavVersion,
} from './test-utilities.js';
import globalNavigationMock from './mocks/global-navigation.plain.js';
@@ -12,7 +13,7 @@ describe('profile', () => {
before(() => {
document.head.innerHTML = `
-
+
`;
});
diff --git a/test/blocks/global-navigation/gnav-promo.test.js b/test/blocks/global-navigation/gnav-promo.test.js
index 972dd297db..eede5833c5 100644
--- a/test/blocks/global-navigation/gnav-promo.test.js
+++ b/test/blocks/global-navigation/gnav-promo.test.js
@@ -1,13 +1,13 @@
/* eslint-disable no-restricted-syntax */
import { expect } from '@esm-bundle/chai';
-import { createFullGlobalNavigation } from './test-utilities.js';
+import { createFullGlobalNavigation, unavVersion } from './test-utilities.js';
import { toFragment } from '../../../libs/blocks/global-navigation/utilities/utilities.js';
describe('Promo', () => {
before(() => {
document.head.innerHTML = `
-
+
`;
});
diff --git a/test/blocks/global-navigation/gnav-search.test.js b/test/blocks/global-navigation/gnav-search.test.js
index c25ef8b9f0..17f24b286c 100644
--- a/test/blocks/global-navigation/gnav-search.test.js
+++ b/test/blocks/global-navigation/gnav-search.test.js
@@ -7,6 +7,7 @@ import {
selectors,
isElementVisible,
mockRes,
+ unavVersion,
} from './test-utilities.js';
const ogFetch = window.fetch;
@@ -19,7 +20,7 @@ describe('search', () => {
before(() => {
document.head.innerHTML = `
-
+
`;
});
diff --git a/test/blocks/global-navigation/test-utilities.js b/test/blocks/global-navigation/test-utilities.js
index 70be91e0ca..9e38a606b8 100644
--- a/test/blocks/global-navigation/test-utilities.js
+++ b/test/blocks/global-navigation/test-utilities.js
@@ -77,6 +77,8 @@ export const analyticsTestData = {
'unc|click|markUnread': 'Mark Notification as unread',
};
+export const unavVersion = '1.3';
+
export const unavLocalesTestData = Object.entries(LANGMAP).reduce((acc, curr) => {
const result = [];
const [locale, prefixes] = curr;
diff --git a/test/blocks/marquee/marquee.test.js b/test/blocks/marquee/marquee.test.js
index 5874bd6bd5..0ab42a2cdd 100644
--- a/test/blocks/marquee/marquee.test.js
+++ b/test/blocks/marquee/marquee.test.js
@@ -1,8 +1,8 @@
import { readFile } from '@web/test-runner-commands';
import { expect } from '@esm-bundle/chai';
import sinon from 'sinon';
-import { waitForElement } from '../../helpers/waitfor.js';
-import { setConfig } from '../../../libs/utils/utils.js';
+import { waitFor, waitForElement } from '../../helpers/waitfor.js';
+import { setConfig, loadStyle } from '../../../libs/utils/utils.js';
import { loadMnemonicList } from '../../../libs/blocks/marquee/marquee.js';
const locales = { '': { ietf: 'en-US', tk: 'hah7vzn.css' } };
@@ -16,6 +16,15 @@ const video = await readFile({ path: './mocks/video.html' });
const multipleIcons = await readFile({ path: './mocks/multiple-icons.html' });
describe('marquee', () => {
+ before(async () => {
+ await new Promise((resolve) => {
+ loadStyle('../../../../libs/styles/styles.css', resolve);
+ });
+ await new Promise((resolve) => {
+ loadStyle('../../../../libs/blocks/marquee/marquee.css', resolve);
+ });
+ });
+
const marquees = document.querySelectorAll('.marquee');
marquees.forEach((marquee) => {
init(marquee);
@@ -69,7 +78,9 @@ describe('marquee', () => {
init(marquee);
videoBLock(document.querySelector('#single-background a[href*=".mp4"]'));
const videoEl = await waitForElement('#single-background .background video');
- expect(videoEl).to.exist;
+ const intersectionObserverAddsSource = () => videoEl.querySelector('source');
+ await waitFor(intersectionObserverAddsSource);
+ expect(videoEl.querySelector('source')).to.exist;
document.getElementById('single-background').remove();
});
@@ -78,7 +89,9 @@ describe('marquee', () => {
init(marquee);
document.querySelectorAll('#multiple-background a[href*=".mp4"]').forEach((videoLink) => videoBLock(videoLink));
await waitForElement('#multiple-background .background video');
- expect(marquee.querySelectorAll('.background video').length).to.equal(1);
+ const intersectionObserverAddsSource = () => document.querySelector('.background video source');
+ await waitFor(intersectionObserverAddsSource);
+ expect(marquee.querySelectorAll('.background video source').length).to.equal(1);
document.getElementById('multiple-background').remove();
});
diff --git a/test/blocks/video/mocks/body.html b/test/blocks/video/mocks/body.html
index bafb0a0338..b3f1963c85 100644
--- a/test/blocks/video/mocks/body.html
+++ b/test/blocks/video/mocks/body.html
@@ -4,7 +4,7 @@
}
-
+
https://main--blog--adobecom.hlx.page/media_17927691d22fe4e1bd058e94762a224fdc57ebb7b.mp4
diff --git a/test/blocks/video/video.test.js b/test/blocks/video/video.test.js
index e80298c650..3a4ac9b1e9 100644
--- a/test/blocks/video/video.test.js
+++ b/test/blocks/video/video.test.js
@@ -1,25 +1,26 @@
import { readFile } from '@web/test-runner-commands';
import { expect, assert } from '@esm-bundle/chai';
-
import sinon from 'sinon';
+import { waitFor, waitForElement } from '../../helpers/waitfor.js';
-import { waitForElement } from '../../helpers/waitfor.js';
-import { setConfig } from '../../../libs/utils/utils.js';
+import { setConfig, createTag } from '../../../libs/utils/utils.js';
setConfig({});
const { default: init } = await import('../../../libs/blocks/video/video.js');
-document.body.innerHTML = await readFile({ path: './mocks/body.html' });
describe('video uploaded using franklin bot', () => {
- it('decorates no-lazy video', async () => {
- const block = document.querySelector('.video.no-lazy');
- const a = block.querySelector('a');
- a.textContent = 'no-lazy';
- block.append(a);
+ beforeEach(async () => {
+ document.body.innerHTML = await readFile({ path: './mocks/body.html' });
+ });
- init(a);
- const video = await waitForElement('.video.no-lazy video');
- expect(video).to.exist;
+ afterEach(() => {
+ document.body.innerHTML = '';
+ });
+
+ it('decorates video', (done) => {
+ const anchor = createTag('a');
+ anchor.remove = () => done();
+ init(anchor);
});
it('decorates video', async () => {
@@ -74,7 +75,6 @@ describe('video uploaded using franklin bot', () => {
it('no hoverplay attribute added when with autoplay on loop', async () => {
const block = document.querySelector('.video.autoplay.playonhover');
const a = block.querySelector('a');
- a.textContent = 'no-lazy';
block.append(a);
init(a);
@@ -86,7 +86,6 @@ describe('video uploaded using franklin bot', () => {
it('decorate video with hoverplay when only hoverplay is added to url', async () => {
const block = document.querySelector('.video.hoveronly');
const a = block.querySelector('a');
- a.textContent = 'no-lazy';
block.append(a);
init(a);
@@ -97,7 +96,6 @@ describe('video uploaded using franklin bot', () => {
it('decorate video with viewportplay only with autoplay', async () => {
const block = document.querySelector('.video.autoplay.viewportplay');
const a = block.querySelector('a');
- a.textContent = 'no-lazy';
block.append(a);
init(a);
@@ -108,7 +106,6 @@ describe('video uploaded using franklin bot', () => {
it('play video when element reached 80% viewport', async () => {
const block = document.querySelector('.video.autoplay.viewportplay.scrolled-80');
const a = block.querySelector('a');
- a.textContent = 'no-lazy';
block.append(a);
const nextFrame = () => new Promise((resolve) => {
requestAnimationFrame(resolve);
@@ -116,13 +113,10 @@ describe('video uploaded using franklin bot', () => {
init(a);
const video = block.querySelector('video');
- const source = video.querySelector('source');
- source.setAttribute('src', 'https://www.adobe.com/creativecloud/media_1167374e3354ef57f126fa78a55cbc1708ac4babd.mp4');
- source.setAttribute('type', 'video/mp4');
-
const playSpy = sinon.spy(video, 'play');
const pauseSpy = sinon.spy(video, 'pause');
-
+ const intersectionObserverAddsSource = () => video.querySelector('source');
+ await waitFor(intersectionObserverAddsSource);
video.scrollIntoView();
await nextFrame();
await new Promise((resolve) => {
@@ -130,20 +124,22 @@ describe('video uploaded using franklin bot', () => {
});
assert.isTrue(playSpy.calledOnce);
- document.body.scrollIntoView();
+ // push the video out of the viewport
+ const div = document.createElement('div');
+ div.style.height = '2000px';
+ video.parentNode.insertBefore(div, video);
+
await nextFrame();
await new Promise((resolve) => {
setTimeout(resolve, 100);
});
assert.isTrue(pauseSpy.calledOnce);
-
expect(video.hasAttribute('data-play-viewport')).to.be.true;
});
it('Don\'t play the video once it end when autoplay1 enabled', async () => {
const block = document.querySelector('.video.autoplay1.viewportplay.ended');
const a = block.querySelector('a');
- a.textContent = 'no-lazy';
block.append(a);
const nextFrame = () => new Promise((resolve) => {
requestAnimationFrame(resolve);
@@ -151,15 +147,13 @@ describe('video uploaded using franklin bot', () => {
init(a);
const video = block.querySelector('video');
- const source = video.querySelector('source');
- source.setAttribute('src', 'https://www.adobe.com/creativecloud/media_1167374e3354ef57f126fa78a55cbc1708ac4babd.mp4');
- source.setAttribute('type', 'video/mp4');
-
const playSpy = sinon.spy(video, 'play');
const pauseSpy = sinon.spy(video, 'pause');
const endedSpy = sinon.spy();
- video.addEventListener('ended', endedSpy);
+ const intersectionObserverAddsSource = () => video.querySelector('source');
+ await waitFor(intersectionObserverAddsSource);
+ video.addEventListener('ended', endedSpy);
video.scrollIntoView();
await nextFrame();
await new Promise((resolve) => {
@@ -167,13 +161,16 @@ describe('video uploaded using franklin bot', () => {
});
assert.isTrue(playSpy.calledOnce);
- document.body.scrollIntoView();
+ // push the video out of the viewport
+ const div = document.createElement('div');
+ div.style.height = '2000px';
+ video.parentNode.insertBefore(div, video);
+
await nextFrame();
await new Promise((resolve) => {
setTimeout(resolve, 100);
});
assert.isTrue(pauseSpy.calledOnce);
-
video.dispatchEvent(new Event('ended'));
await nextFrame();
await new Promise((resolve) => {
@@ -193,7 +190,6 @@ describe('video uploaded using franklin bot', () => {
it('decorate video with viewportplay only with autoplay1', async () => {
const block = document.querySelector('.video.autoplay1.viewportplay');
const a = block.querySelector('a');
- a.textContent = 'no-lazy';
block.append(a);
init(a);
@@ -204,7 +200,6 @@ describe('video uploaded using franklin bot', () => {
it('decorate video with no viewportplay with autoplay1 hoverplay', async () => {
const block = document.querySelector('.video.autoplay1.hoverplay.no-viewportplay');
const a = block.querySelector('a');
- a.textContent = 'no-lazy';
block.append(a);
init(a);
@@ -215,7 +210,6 @@ describe('video uploaded using franklin bot', () => {
it('decorate video with no viewportplay with hoverplay', async () => {
const block = document.querySelector('.video.hoverplay.no-viewportplay');
const a = block.querySelector('a');
- a.textContent = 'no-lazy';
block.append(a);
init(a);
@@ -226,7 +220,6 @@ describe('video uploaded using franklin bot', () => {
it('decorate video with no viewportplay no autoplay', async () => {
const block = document.querySelector('.video.no-autoplay.no-viewportplay');
const a = block.querySelector('a');
- a.textContent = 'no-lazy';
block.append(a);
init(a);
@@ -237,7 +230,6 @@ describe('video uploaded using franklin bot', () => {
it('decorate video with no viewportplay no autoplay1', async () => {
const block = document.querySelector('.video.no-autoplay1.no-viewportplay');
const a = block.querySelector('a');
- a.textContent = 'no-lazy';
block.append(a);
init(a);
diff --git a/test/features/personalization/mocks/manifestSectionBlock.json b/test/features/personalization/mocks/manifestSectionBlock.json
index 1a5809b040..08be67a8f6 100644
--- a/test/features/personalization/mocks/manifestSectionBlock.json
+++ b/test/features/personalization/mocks/manifestSectionBlock.json
@@ -5,7 +5,7 @@
"data": [
{
"action": "removeContent",
- "selector": ".custom-block1",
+ "selector": ".custom-block-1",
"page filter (optional)": "",
"param-newoffer=123": "",
"all": "on"
diff --git a/test/features/personalization/modifyNonFragmentSelector.test.js b/test/features/personalization/modifyNonFragmentSelector.test.js
index fd3cdbf893..58b6813b4b 100644
--- a/test/features/personalization/modifyNonFragmentSelector.test.js
+++ b/test/features/personalization/modifyNonFragmentSelector.test.js
@@ -117,7 +117,7 @@ const values = [
},
{
b: 'section1 .random-block2',
- a: 'main > div:nth-child(1) .random-block:nth-child(2 of .random-block)',
+ a: 'main > div:nth-child(1) .random-block2',
},
{
b: 'main > section30',
@@ -143,6 +143,14 @@ const values = [
b: 'any-marquee ul li:nth-child(2)',
a: '[class*="marquee"] ul li:nth-child(2)',
},
+ {
+ b: 'any-marquee-section',
+ a: 'main > div:has([class*="marquee"])',
+ },
+ {
+ b: '.aside03',
+ a: '.aside03',
+ },
];
describe('test different values', () => {
values.forEach((value) => {