diff --git a/test/scripts/block-utils.test.js b/test/scripts/block-utils.test.js deleted file mode 100644 index ff557e51..00000000 --- a/test/scripts/block-utils.test.js +++ /dev/null @@ -1,123 +0,0 @@ -/* eslint-disable no-unused-expressions */ -/* global describe before it */ - -import { readFile } from '@web/test-runner-commands'; -import { expect } from '@esm-bundle/chai'; -import sinon from 'sinon'; - -let blockUtils; - -document.body.innerHTML = await readFile({ path: './dummy.html' }); -document.head.innerHTML = await readFile({ path: './head.html' }); - -describe('Utils methods', () => { - before(async () => { - blockUtils = await import('../../scripts/lib-franklin.js'); - document.body.innerHTML = await readFile({ path: './body.html' }); - }); - - it('Sanitizes class name', async () => { - expect(blockUtils.toClassName('Hello world')).to.equal('hello-world'); - expect(blockUtils.toClassName(null)).to.equal(''); - }); - - it('Extracts metadata', async () => { - expect(blockUtils.getMetadata('description')).to.equal('Lorem ipsum dolor sit amet.'); - expect(blockUtils.getMetadata('og:title')).to.equal('Foo'); - }); - - it('Loads CSS', async () => { - // loads a css file and calls callback - const load = await new Promise((resolve) => { - blockUtils.loadCSS('/test/scripts/test.css', (e) => resolve(e)); - }); - expect(load).to.equal('load'); - expect(getComputedStyle(document.body).color).to.equal('rgb(255, 0, 0)'); - - // does nothing if css already loaded - const noop = await new Promise((resolve) => { - blockUtils.loadCSS('/test/scripts/test.css', (e) => resolve(e)); - }); - expect(noop).to.equal('noop'); - - // calls callback in case of error - const error = await new Promise((resolve) => { - blockUtils.loadCSS('/test/scripts/nope.css', (e) => resolve(e)); - }); - expect(error).to.equal('error'); - }); - - it('Collects RUM data', async () => { - const sendBeacon = sinon.stub(navigator, 'sendBeacon'); - // turn on RUM - window.history.pushState({}, '', `${window.location.href}&rum=on`); - delete window.hlx; - - // sends checkpoint beacon - await blockUtils.sampleRUM('test', { foo: 'bar' }); - expect(sendBeacon.called).to.be.true; - sendBeacon.resetHistory(); - - // sends cwv beacon - await blockUtils.sampleRUM('cwv', { foo: 'bar' }); - expect(sendBeacon.called).to.be.true; - - // test error handling - sendBeacon.throws(); - await blockUtils.sampleRUM('error', { foo: 'bar' }); - - sendBeacon.restore(); - }); - - it('Normalizes headings', async () => { - const numHeadings = document.querySelectorAll('h1, h2, h3, h4, h5, h6').length; - blockUtils.normalizeHeadings(document.querySelector('main'), ['h1', 'h2', 'h3']); - expect(document.querySelectorAll('h1, h2, h3, h4, h5, h6').length).to.equal(numHeadings); - expect(document.querySelectorAll('h4, h5, h6').length).to.equal(0); - }); -}); - -describe('Sections and blocks', () => { - it('Decorates sections', async () => { - blockUtils.decorateSections(document.querySelector('main')); - expect(document.querySelectorAll('main .section').length).to.equal(2); - }); - - it('Decorates blocks', async () => { - blockUtils.decorateBlocks(document.querySelector('main')); - expect(document.querySelectorAll('main .block').length).to.equal(1); - }); - - it('Loads blocks', async () => { - await blockUtils.loadBlocks(document.querySelector('main')); - document.querySelectorAll('main .block').forEach(($block) => { - expect($block.dataset.blockStatus).to.equal('loaded'); - }); - }); - - it('Updates section status', async () => { - blockUtils.updateSectionsStatus(document.querySelector('main')); - document.querySelectorAll('main .section').forEach(($section) => { - expect($section.dataset.sectionStatus).to.equal('loaded'); - }); - - // test section with block still loading - const $section = document.querySelector('main .section'); - delete $section.dataset.sectionStatus; - $section.querySelector(':scope .block').dataset.blockStatus = 'loading'; - blockUtils.updateSectionsStatus(document.querySelector('main')); - expect($section.dataset.sectionStatus).to.equal('loading'); - }); - - it('Reads block config', async () => { - document.querySelector('main .section > div').innerHTML += await readFile({ path: './config.html' }); - const cfg = blockUtils.readBlockConfig(document.querySelector('main .config')); - expect(cfg).to.deep.include({ - 'prop-0': 'Plain text', - 'prop-1': 'Paragraph', - 'prop-2': ['First paragraph', 'Second paragraph'], - 'prop-3': 'https://www.adobe.com/', - 'prop-4': ['https://www.adobe.com/', 'https://www.hlx.live/'], - }); - }); -});