Skip to content

Commit

Permalink
redo trusted-set-attr tests
Browse files Browse the repository at this point in the history
  • Loading branch information
@stanislav-atr
stanislav-atr committed Feb 2, 2024
1 parent bf797df commit 3d24a71
Showing 1 changed file with 81 additions and 154 deletions.
235 changes: 81 additions & 154 deletions tests/scriptlets/trusted-set-attr.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,207 +4,134 @@ import { runScriptlet, clearGlobalProps } from '../helpers';
const { test, module } = QUnit;
const name = 'trusted-set-attr';

const afterEach = () => {
clearGlobalProps('hit', '__debug');
};
const TARGET_ELEM_ID = 'target';
const MISMATCH_ELEM_ID = 'mismatch';
const TARGET_ATTR_NAME = 'test-attr';
const TARGET_ELEM_BAIT_ATTR = 'another-attr-value';

module(name, { afterEach });
let context;
let testCaseCount = 0;

const createHit = () => {
window.__debug = () => {
window.hit = 'FIRED';
};
};

const createElem = (className) => {
const createElement = (id) => {
const elem = document.createElement('div');
if (className) {
elem.classList.add(className);
}
elem.id = id;
document.body.appendChild(elem);
return elem;
};

function changeAttr(elem, attr) {
elem.setAttribute(attr, 'not-test-value');
}

test('selector + attr + eligible number', (assert) => {
createHit();
const attr = 'test-attr';
const value = '1234';
const matchClassName = 'testClass';
const mismatchClassName = 'none';

const matchElem = createElem(matchClassName);
const mismatchElem = createElem(mismatchClassName);

const scriptletArgs = [`.${matchClassName}`, attr, value];
runScriptlet(name, scriptletArgs);

assert.ok(matchElem.getAttribute(attr), `Attr ${attr} added to selector-matched element`);
assert.ok(matchElem.getAttribute(attr) === value, `New attr value ${value} is correct`);
assert.notOk(mismatchElem.getAttribute(attr), `Attr ${attr} is not added to mismatch element`);
const createContext = () => {
// This prevents multiple observers from tinkering with other tests
testCaseCount += 1;

assert.strictEqual(window.hit, 'FIRED');
clearGlobalProps('hit');

const done = assert.async();
const targetUID = `${TARGET_ELEM_ID}-${testCaseCount}`;
const mismatchUID = `${MISMATCH_ELEM_ID}-${testCaseCount}`;

changeAttr(matchElem, attr);
setTimeout(() => {
assert.ok(matchElem.getAttribute(attr) === value, `New attr val ${value} is still correct`);
assert.strictEqual(window.hit, 'FIRED');
// Clean up test elements
matchElem.remove();
mismatchElem.remove();
done();
}, 30);
});

test('selector + attr + empty string', (assert) => {
createHit();
const attr = 'test-attr';
const value = '';
const matchClassName = 'testClass';
const mismatchClassName = 'none';

const matchElem = createElem(matchClassName);
const mismatchElem = createElem(mismatchClassName);
return {
targetSelector: `#${targetUID}`,
targetElem: createElement(targetUID),
mismatchElem: createElement(mismatchUID),
changeTargetAttribute(attributeName) {
return this.targetElem.setAttribute(attributeName, TARGET_ELEM_BAIT_ATTR);
},
};
};

const scriptletArgs = [`.${matchClassName}`, attr, value];
runScriptlet(name, scriptletArgs);
const clearContext = () => {
context.targetElem.remove();
context.mismatchElem.remove();
context = null;
};

// Have to revert state here, as getAttribute returns value '' that evaluates to false
assert.ok(!matchElem.getAttribute(attr), `Attr ${attr} added to selector-matched element`);
assert.ok(matchElem.getAttribute(attr) === value, `New attr value ${value} is correct`);
assert.notOk(mismatchElem.getAttribute(attr), `Attr ${attr} is not added to mismatch element`);
const beforeEach = () => {
context = createContext();
window.__debug = () => {
window.hit = 'FIRED';
};
};

assert.strictEqual(window.hit, 'FIRED');
matchElem.remove();
mismatchElem.remove();
clearGlobalProps('hit');
});
const afterEach = () => {
clearContext();
clearGlobalProps('hit', '__debug');
};

test('selector + attr + empty string', (assert) => {
createHit();
const attr = 'test-attr';
const matchClassName = 'testClass';
const mismatchClassName = 'none';
module(name, { beforeEach, afterEach });

const matchElem = createElem(matchClassName);
const mismatchElem = createElem(mismatchClassName);
test('setting arbitrary value', (assert) => {
const value = '{ playbackRate: 1.5 }';
const { targetSelector, targetElem, mismatchElem } = context;
const scriptletArgs = [targetSelector, TARGET_ATTR_NAME, value];

const scriptletArgs = [`.${matchClassName}`, attr];
runScriptlet(name, scriptletArgs);

// Have to revert state here, as getAttribute returns value '' that evaluates to false
assert.ok(!matchElem.getAttribute(attr), `Attr ${attr} added to selector-matched element`);
/* eslint-disable-next-line quotes */
assert.ok(matchElem.getAttribute(attr) === '', `New attr value '' is correct`);
assert.notOk(mismatchElem.getAttribute(attr), `Attr ${attr} is not added to mismatch element`);
assert.strictEqual(targetElem.getAttribute(TARGET_ATTR_NAME), value, `New attr value ${value} is correct`);
assert.strictEqual(
mismatchElem.getAttribute(TARGET_ATTR_NAME),
null,
`Attr ${TARGET_ATTR_NAME} is not added to mismatch element`,
);
assert.strictEqual(window.hit, 'FIRED', 'hit function has been called');

assert.strictEqual(window.hit, 'FIRED');
matchElem.remove();
mismatchElem.remove();
clearGlobalProps('hit');
});

test('selector + attr + true', (assert) => {
createHit();
const attr = 'test-attr-true';
const value = 'true';
const matchClassName = 'testClassTrue';
const mismatchClassName = 'none';

const matchElem = createElem(matchClassName);
const mismatchElem = createElem(mismatchClassName);

const scriptletArgs = [`.${matchClassName}`, attr, value];
runScriptlet(name, scriptletArgs);

assert.ok(matchElem.getAttribute(attr), `Attr ${attr} added to selector-matched element`);
assert.ok(matchElem.getAttribute(attr) === value, `New attr value ${value} is correct`);
assert.notOk(mismatchElem.getAttribute(attr), `Attr ${attr} is not added to mismatch element`);

assert.strictEqual(window.hit, 'FIRED');
clearGlobalProps('hit');
context.changeTargetAttribute(TARGET_ATTR_NAME);

const done = assert.async();

changeAttr(matchElem, attr);
setTimeout(() => {
assert.ok(matchElem.getAttribute(attr) === value, `New attr val ${value} is still correct`);
assert.strictEqual(window.hit, 'FIRED');
// Clean up test elements
matchElem.remove();
mismatchElem.remove();
assert.strictEqual(targetElem.getAttribute(TARGET_ATTR_NAME), value, `New attr val ${value} is still correct`);
assert.strictEqual(window.hit, 'FIRED', 'hit function has been called again');
done();
}, 30);
});

test('selector + attr + False', (assert) => {
createHit();
const attr = 'test-attr-False';
const value = 'False';
const matchClassName = 'testClassFalse';
const mismatchClassName = 'none';

const matchElem = createElem(matchClassName);
const mismatchElem = createElem(mismatchClassName);
test('setting empty string', (assert) => {
const value = '';
const { targetSelector, targetElem, mismatchElem } = context;
const scriptletArgs = [targetSelector, TARGET_ATTR_NAME, value];

const scriptletArgs = [`.${matchClassName}`, attr, value];
runScriptlet(name, scriptletArgs);

assert.ok(matchElem.getAttribute(attr), `Attr ${attr} added to selector-matched element`);
assert.ok(matchElem.getAttribute(attr) === value, `New attr value ${value} is correct`);
assert.notOk(mismatchElem.getAttribute(attr), `Attr ${attr} is not added to mismatch element`);
assert.strictEqual(targetElem.getAttribute(TARGET_ATTR_NAME), value, `New attr value ${value} is correct`);
assert.strictEqual(
mismatchElem.getAttribute(TARGET_ATTR_NAME),
null,
`Attr ${TARGET_ATTR_NAME} is not added to mismatch element`,
);
assert.strictEqual(window.hit, 'FIRED', 'hit function has been called');

assert.strictEqual(window.hit, 'FIRED');
clearGlobalProps('hit');

const done = assert.async();
context.changeTargetAttribute(TARGET_ATTR_NAME);

changeAttr(matchElem, attr);
const done = assert.async();
setTimeout(() => {
assert.ok(matchElem.getAttribute(attr) === value, `New attr val ${value} is still correct`);
assert.strictEqual(window.hit, 'FIRED');
// Clean up test elements
matchElem.remove();
mismatchElem.remove();
assert.strictEqual(targetElem.getAttribute(TARGET_ATTR_NAME), value, `New attr val ${value} is still correct`);
assert.strictEqual(window.hit, 'FIRED', 'hit function has been called again');
done();
}, 30);
});

test('selector + attr + stringified object', (assert) => {
createHit();
const attr = 'test-attr-False';
const value = '{ playback: false }';
const matchClassName = 'testClassFalse';
const mismatchClassName = 'none';
test('setting attribute without value', (assert) => {
const { targetSelector, targetElem, mismatchElem } = context;
const scriptletArgs = [targetSelector, TARGET_ATTR_NAME];

const matchElem = createElem(matchClassName);
const mismatchElem = createElem(mismatchClassName);

const scriptletArgs = [`.${matchClassName}`, attr, value];
runScriptlet(name, scriptletArgs);

assert.ok(matchElem.getAttribute(attr), `Attr ${attr} added to selector-matched element`);
assert.ok(matchElem.getAttribute(attr) === value, `New attr value ${value} is correct`);
assert.notOk(mismatchElem.getAttribute(attr), `Attr ${attr} is not added to mismatch element`);
assert.strictEqual(targetElem.getAttribute(TARGET_ATTR_NAME), '', 'New attr set without value');
assert.strictEqual(
mismatchElem.getAttribute(TARGET_ATTR_NAME),
null,
`Attr ${TARGET_ATTR_NAME} is not added to mismatch element`,
);
assert.strictEqual(window.hit, 'FIRED', 'hit function has been called');

assert.strictEqual(window.hit, 'FIRED');
clearGlobalProps('hit');

const done = assert.async();
context.changeTargetAttribute(TARGET_ATTR_NAME);

changeAttr(matchElem, attr);
const done = assert.async();
setTimeout(() => {
assert.ok(matchElem.getAttribute(attr) === value, `New attr val ${value} is still correct`);
assert.strictEqual(window.hit, 'FIRED');
// Clean up test elements
matchElem.remove();
mismatchElem.remove();
assert.strictEqual(targetElem.getAttribute(TARGET_ATTR_NAME), '', 'New attr state is still correct');
assert.strictEqual(window.hit, 'FIRED', 'hit function has been called again');
done();
}, 30);
});

0 comments on commit 3d24a71

Please sign in to comment.