Commit cdad3233 authored by Mark Florian's avatar Mark Florian

Merge branch 'ps-breakup-custom-jest-matchers-module' into 'master'

Break up jest helpers/matchers into seperate modules

See merge request gitlab-org/gitlab!77623
parents 753405a1 1589b067
export default {
toHaveSpriteIcon: (element, iconName) => {
if (!iconName) {
throw new Error('toHaveSpriteIcon is missing iconName argument!');
}
if (!(element instanceof HTMLElement)) {
throw new Error(`${element} is not a DOM element!`);
}
const iconReferences = [].slice.apply(element.querySelectorAll('svg use'));
const matchingIcon = iconReferences.find(
(reference) => reference.parentNode.getAttribute('data-testid') === `${iconName}-icon`,
);
const pass = Boolean(matchingIcon);
let message;
if (pass) {
message = `${element.outerHTML} contains the sprite icon "${iconName}"!`;
} else {
message = `${element.outerHTML} does not contain the sprite icon "${iconName}"!`;
const existingIcons = iconReferences.map((reference) => {
const iconUrl = reference.getAttribute('href');
return `"${iconUrl.replace(/^.+#/, '')}"`;
});
if (existingIcons.length > 0) {
message += ` (only found ${existingIcons.join(',')})`;
}
}
return {
pass,
message: () => message,
};
},
toMatchInterpolatedText(received, match) {
let clearReceived;
let clearMatch;
try {
clearReceived = received.replace(/\s\s+/gm, ' ').replace(/\s\./gm, '.').trim();
} catch (e) {
return { actual: received, message: 'The received value is not a string', pass: false };
}
try {
clearMatch = match.replace(/%{\w+}/gm, '').trim();
} catch (e) {
return { message: 'The comparator value is not a string', pass: false };
}
const pass = clearReceived === clearMatch;
const message = pass
? () => `
\n\n
Expected: ${this.utils.printExpected(clearReceived)}
To not equal: ${this.utils.printReceived(clearMatch)}
`
: () =>
`
\n\n
Expected: ${this.utils.printExpected(clearReceived)}
To equal: ${this.utils.printReceived(clearMatch)}
`;
return { actual: received, message, pass };
},
};
export * from './to_have_sprite_icon';
export * from './to_match_interpolated_text';
export const toHaveSpriteIcon = (element, iconName) => {
if (!iconName) {
throw new Error('toHaveSpriteIcon is missing iconName argument!');
}
if (!(element instanceof HTMLElement)) {
throw new Error(`${element} is not a DOM element!`);
}
const iconReferences = [].slice.apply(element.querySelectorAll('svg use'));
const matchingIcon = iconReferences.find(
(reference) => reference.parentNode.getAttribute('data-testid') === `${iconName}-icon`,
);
const pass = Boolean(matchingIcon);
let message;
if (pass) {
message = `${element.outerHTML} contains the sprite icon "${iconName}"!`;
} else {
message = `${element.outerHTML} does not contain the sprite icon "${iconName}"!`;
const existingIcons = iconReferences.map((reference) => {
const iconUrl = reference.getAttribute('href');
return `"${iconUrl.replace(/^.+#/, '')}"`;
});
if (existingIcons.length > 0) {
message += ` (only found ${existingIcons.join(',')})`;
}
}
return {
pass,
message: () => message,
};
};
export const toMatchInterpolatedText = (received, match) => {
let clearReceived;
let clearMatch;
try {
clearReceived = received.replace(/\s\s+/gm, ' ').replace(/\s\./gm, '.').trim();
} catch (e) {
return { actual: received, message: 'The received value is not a string', pass: false };
}
try {
clearMatch = match.replace(/%{\w+}/gm, '').trim();
} catch (e) {
return { message: 'The comparator value is not a string', pass: false };
}
const pass = clearReceived === clearMatch;
const message = pass
? () => `
\n\n
Expected: ${this.utils.printExpected(clearReceived)}
To not equal: ${this.utils.printReceived(clearMatch)}
`
: () =>
`
\n\n
Expected: ${this.utils.printExpected(clearReceived)}
To equal: ${this.utils.printReceived(clearMatch)}
`;
return { actual: received, message, pass };
};
describe('custom matcher toMatchInterpolatedText', () => {
describe('malformed input', () => {
it.each([null, 1, Symbol, Array, Object])(
'fails graciously if the expected value is %s',
(expected) => {
expect(expected).not.toMatchInterpolatedText('null');
},
);
});
describe('malformed matcher', () => {
it.each([null, 1, Symbol, Array, Object])(
'fails graciously if the matcher is %s',
(matcher) => {
expect('null').not.toMatchInterpolatedText(matcher);
},
);
});
describe('positive assertion', () => {
it.each`
htmlString | templateString
${'foo'} | ${'foo'}
${'foo'} | ${'foo%{foo}'}
${'foo '} | ${'foo'}
${'foo '} | ${'foo%{foo}'}
${'foo . '} | ${'foo%{foo}.'}
${'foo bar . '} | ${'foo%{foo} bar.'}
${'foo\n\nbar . '} | ${'foo%{foo} bar.'}
${'foo bar . .'} | ${'foo%{fooStart} bar.%{fooEnd}.'}
`('$htmlString equals $templateString', ({ htmlString, templateString }) => {
expect(htmlString).toMatchInterpolatedText(templateString);
});
});
describe('negative assertion', () => {
it.each`
htmlString | templateString
${'foo'} | ${'bar'}
${'foo'} | ${'bar%{foo}'}
${'foo'} | ${'@{lol}foo%{foo}'}
${' fo o '} | ${'foo'}
`('$htmlString does not equal $templateString', ({ htmlString, templateString }) => {
expect(htmlString).not.toMatchInterpolatedText(templateString);
});
});
});
describe('Custom jest matchers', () => {
describe('toMatchInterpolatedText', () => {
describe('malformed input', () => {
it.each([null, 1, Symbol, Array, Object])(
'fails graciously if the expected value is %s',
(expected) => {
expect(expected).not.toMatchInterpolatedText('null');
},
);
});
describe('malformed matcher', () => {
it.each([null, 1, Symbol, Array, Object])(
'fails graciously if the matcher is %s',
(matcher) => {
expect('null').not.toMatchInterpolatedText(matcher);
},
);
});
describe('positive assertion', () => {
it.each`
htmlString | templateString
${'foo'} | ${'foo'}
${'foo'} | ${'foo%{foo}'}
${'foo '} | ${'foo'}
${'foo '} | ${'foo%{foo}'}
${'foo . '} | ${'foo%{foo}.'}
${'foo bar . '} | ${'foo%{foo} bar.'}
${'foo\n\nbar . '} | ${'foo%{foo} bar.'}
${'foo bar . .'} | ${'foo%{fooStart} bar.%{fooEnd}.'}
`('$htmlString equals $templateString', ({ htmlString, templateString }) => {
expect(htmlString).toMatchInterpolatedText(templateString);
});
});
describe('negative assertion', () => {
it.each`
htmlString | templateString
${'foo'} | ${'bar'}
${'foo'} | ${'bar%{foo}'}
${'foo'} | ${'@{lol}foo%{foo}'}
${' fo o '} | ${'foo'}
`('$htmlString does not equal $templateString', ({ htmlString, templateString }) => {
expect(htmlString).not.toMatchInterpolatedText(templateString);
});
});
});
});
......@@ -8,7 +8,7 @@ import setWindowLocation from './set_window_location_helper';
import { setGlobalDateToFakeDate } from './fake_date';
import { loadHTMLFixture, setHTMLFixture } from './fixtures';
import { TEST_HOST } from './test_constants';
import customMatchers from './matchers';
import * as customMatchers from './matchers';
import './dom_shims';
import './jquery';
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment