look at this scenario. the result will return - ReferenceError: _dollar is not defined
const $ = selector => document.querySelector(selector);
module.exports = $;
const puppeteer = require('puppeteer');
const QUnit = require('qunit');
const $ = require('./dollar');
const { module: testModule, test } = QUnit;
testModule('$ - dollar DOM', (hooks) => {
hooks.before(async function() {
this.browser = await puppeteer.launch();
});
hooks.after(async function() {
await this.browser.close();
});
test('sould return the dom element if exist', async function (assert) {
const page = await this.browser.newPage();
await page.goto(`file:${fixturePath}/index.html`);
await page.addScriptTag({ url: 'https://www.unpkg.com/domjson' });
const bodyEl = await page.evaluate(() => {
return domJSON.toJSON($('body'));
});
console.log(JSON.stringify(bodyEl, true, 2)); // return ReferenceError: _dollar is not defined
assert.ok(bodyEl);
await page.close();
});
});
Trying the evaluate script the .evaluate will return a {}
test('sould return the dom element if exist', async function (assert) {
const page = await this.browser.newPage();
await page.goto(`file:${fixturePath}/index.html`);
await page.addScriptTag({ url: 'https://www.unpkg.com/domjson' });
const bodyEl = await page.evaluate(`
// Now I'm inside BROWSER environment
() => {
return domJSON.toJSON($('body'));
}
`);
console.log(JSON.stringify(bodyEl, true, 2)); // {}
assert.ok(bodyEl);
await page.close();
});
look at this scenario. the result will return -
ReferenceError: _dollar is not definedTrying the evaluate script the
.evaluatewill return a {}