Skip to content

Commit

Permalink
feat: update Jest tests to use new renderWC helper + prep for upstrea…
Browse files Browse the repository at this point in the history 
…m <ssr-keep> updates
  • Loading branch information
@sghoweri
sghoweri committed Apr 23, 2020
1 parent 4a8edb3 commit beb6b85
Show file tree
Hide file tree
Showing 39 changed files with 525 additions and 650 deletions.
125 changes: 47 additions & 78 deletions packages/analytics/autolink/__tests__/autolink.test.js
View file
@@ -1,3 +1,4 @@
import { renderWC } from '../../../testing/testing-helpers';
const path = require('path');

const timeout = 90000;
Expand Down Expand Up @@ -27,16 +28,13 @@ describe('analytics autolinker', () => {
path: path.join(__dirname, 'fixtures/test-analytics-config.data.js'),
});

await page.evaluate(() => {
const btn = document.createElement('bolt-button');
btn.textContent = 'External URL w/ existing GA Tracking';
btn.setAttribute('url', 'https://www.google.com/?_ga=1234');
document.body.appendChild(btn);
});
await renderWC(
'bolt-button',
`<bolt-button url="https://www.google.com/?_ga=1234">External URL w/ existing GA Tracking</bolt-button>`,
page,
);

const navigationPromise = page.waitForNavigation();
await page.click('bolt-button');
await navigationPromise;
const currentUrl = await page.url();

expect(currentUrl).toContain('_ga=1234');
Expand All @@ -55,9 +53,7 @@ describe('analytics autolinker', () => {
document.body.appendChild(btn);
});

const navigationPromise = page.waitForNavigation();
await page.click('bolt-button');
await navigationPromise;
const currentUrl = await page.url();

expect(currentUrl).toContain('_ga');
Expand All @@ -69,12 +65,11 @@ describe('analytics autolinker', () => {
path: path.join(__dirname, 'fixtures/test-analytics-config.data.js'),
});

await page.evaluate(() => {
const btn = document.createElement('bolt-button');
btn.textContent = 'External URL - Shadow DOM Test';
btn.setAttribute('url', 'https://developer.mozilla.org');
document.body.appendChild(btn);
});
await renderWC(
'bolt-button',
`<bolt-button url="https://developer.mozilla.org">External URL - Shadow DOM Test</bolt-button>`,
page,
);

await page.evaluate(() => {
const btn = document.querySelector('bolt-button');
Expand All @@ -83,31 +78,26 @@ describe('analytics autolinker', () => {
return document.body.innerHTML;
});

const navigationPromise = page.waitForNavigation();
await page.click('bolt-button');
await navigationPromise;
const currentUrl = await page.url();

expect(currentUrl).toContain('_ga');
expect(currentUrl).toContain('brightcove.com');
}, 120000);
}, 5000);

test('autolinker updates the URLs of a <bolt-button> with an external url + rendering to the Shadow DOM', async function() {
await page.addScriptTag({
type: 'module',
path: path.join(__dirname, 'fixtures/test-analytics-config.data.js'),
});

await page.evaluate(() => {
const btn = document.createElement('bolt-button');
btn.textContent = 'External URL - Shadow DOM Test';
btn.setAttribute('url', 'https://www.google.com');
document.body.appendChild(btn);
});
await renderWC(
'bolt-button',
`<bolt-button url="https://www.google.com">External URL - Shadow DOM Test</bolt-button>`,
page,
);

const navigationPromise = page.waitForNavigation();
await page.click('bolt-button');
await navigationPromise;
const currentUrl = await page.url();

expect(currentUrl).toContain('_ga');
Expand All @@ -119,13 +109,11 @@ describe('analytics autolinker', () => {
path: path.join(__dirname, 'fixtures/test-analytics-config.data.js'),
});

await page.evaluate(() => {
const btn = document.createElement('bolt-button');
btn.textContent = 'External URL - Light DOM Test';
btn.setAttribute('no-shadow', '');
btn.setAttribute('url', 'https://www.google.com');
document.body.appendChild(btn);
});
await renderWC(
'bolt-button',
`<bolt-button url="https://www.google.com" no-shadow>External URL - Light DOM Test</bolt-button>`,
page,
);

const navigationPromise = page.waitForNavigation();
await page.click('bolt-button');
Expand All @@ -141,16 +129,13 @@ describe('analytics autolinker', () => {
path: path.join(__dirname, 'fixtures/test-analytics-config.data.js'),
});

await page.evaluate(() => {
const btn = document.createElement('bolt-button');
btn.textContent = 'External URL - Untracked Domain';
btn.setAttribute('url', 'https://developer.mozilla.org');
document.body.appendChild(btn);
});
await renderWC(
'bolt-button',
`<bolt-button url="https://developer.mozilla.org">External URL - Untracked Domain</bolt-button>`,
page,
);

const navigationPromise = page.waitForNavigation();
await page.click('bolt-button');
await navigationPromise;
const currentUrl = await page.url();

expect(currentUrl).not.toContain('_ga');
Expand All @@ -162,17 +147,13 @@ describe('analytics autolinker', () => {
path: path.join(__dirname, 'fixtures/test-analytics-config.data.js'),
});

await page.evaluate(() => {
const link = document.createElement('bolt-link');
link.textContent = 'External URL - Shadow DOM Test';
link.style.display = 'inline-block'; // for some strange reason, without any :host styles or this, puppeteer can't seem to find this DOM node to click on
link.setAttribute('url', 'https://www.google.com');
document.body.appendChild(link);
});
await renderWC(
'bolt-link',
`<bolt-link style="display: inline-block;" url="https://www.google.com">External URL - Shadow DOM Test</bolt-link>`,
page,
);

const navigationPromise = page.waitForNavigation();
await page.click('bolt-link');
await navigationPromise;
const currentUrl = await page.url();

expect(currentUrl).toContain('_ga');
Expand All @@ -184,17 +165,13 @@ describe('analytics autolinker', () => {
path: path.join(__dirname, 'fixtures/test-analytics-config.data.js'),
});

await page.evaluate(() => {
const link = document.createElement('bolt-link');
link.textContent = 'External URL - Light DOM Test';
link.useShadow = false;
link.setAttribute('url', 'https://www.google.com');
document.body.appendChild(link);
});
await renderWC(
'bolt-link',
`<bolt-link no-shadow url="https://www.google.com">External URL - Light DOM Test</bolt-link>`,
page,
);

const navigationPromise = page.waitForNavigation();
await page.click('bolt-link');
await navigationPromise;
const currentUrl = await page.url();

expect(currentUrl).toContain('_ga');
Expand All @@ -206,17 +183,13 @@ describe('analytics autolinker', () => {
path: path.join(__dirname, 'fixtures/test-analytics-config.data.js'),
});

await page.evaluate(() => {
const link = document.createElement('bolt-link');
link.textContent = 'External URL - Untracked Domain';
link.style.display = 'inline-block'; // for some strange reason, without any :host styles or this, puppeteer can't seem to find this DOM node to click on
link.setAttribute('url', 'https://developer.mozilla.org');
document.body.appendChild(link);
});
await renderWC(
'bolt-link',
`<bolt-link style="display: inline-block;" url="https://developer.mozilla.org">External URL - Untracked Domain</bolt-link>`,
page,
);

const navigationPromise = page.waitForNavigation();
await page.click('bolt-link');
await navigationPromise;
const currentUrl = await page.url();

expect(currentUrl).not.toContain('_ga');
Expand Down Expand Up @@ -249,17 +222,13 @@ describe('analytics autolinker', () => {
),
});

await page.evaluate(() => {
const btn = document.createElement('bolt-button');
btn.textContent =
'External URL - Normally Untracked But Now Tracked Domain';
btn.setAttribute('url', 'https://developer.mozilla.org');
document.body.appendChild(btn);
});
await renderWC(
'bolt-button',
`<bolt-button style="display: inline-block;" url="https://developer.mozilla.org">External URL - Normally Untracked But Now Tracked Domain</bolt-button>`,
page,
);

const navigationPromise = page.waitForNavigation();
await page.click('bolt-button');
await navigationPromise;
const currentUrl = await page.url();

expect(currentUrl).toContain('_ga');
Expand Down
33 changes: 12 additions & 21 deletions packages/components/bolt-band/__tests__/band.js
View file
Expand Up @@ -2,6 +2,7 @@ import {
isConnected,
render,
renderString,
renderWC,
stopServer,
html,
} from '../../../testing/testing-helpers';
Expand Down Expand Up @@ -90,17 +91,15 @@ describe('<bolt-band> Component', () => {
} only %}
`);

const renderedBandHTML = await page.evaluate(async html => {
const div = document.createElement('div');
div.style.padding = '40px';
div.innerHTML = `${html}`;
document.body.appendChild(div);
const band = document.querySelector('bolt-band');
await band.firstUpdated;
return band.outerHTML;
}, template.html);

const renderedHTML = await html(renderedBandHTML);
const { outerHTML } = await renderWC(
'bolt-band',
`<div style="padding: 40px">
${template.html}
</div>`,
page,
);

const renderedHTML = await html(outerHTML);
const image = await page.screenshot();

expect(image).toMatchImageSnapshot({
Expand Down Expand Up @@ -170,16 +169,8 @@ describe('<bolt-band> Component', () => {
} only %}
`);

const renderedBandHTML = await page.evaluate(async html => {
const div = document.createElement('div');
div.innerHTML = `${html}`;
document.body.appendChild(div);
const band = document.querySelector('bolt-band');
await band.firstUpdated;
return band.outerHTML;
}, template.html);

const renderedHTML = await html(renderedBandHTML);
const { outerHTML } = await renderWC('bolt-band', `${template.html}`, page);
const renderedHTML = await html(outerHTML);
const image = await page.screenshot();

expect(image).toMatchImageSnapshot({
Expand Down

0 comments on commit beb6b85

Please sign in to comment.