Skip to content
Permalink
Browse files

Chore: Fix report positions in tests

Also enhance find-original-element to aid in getting location data
and fix passing `ignoredUrls` to `hint-runner` in `utils-test-helpers`.
  • Loading branch information...
antross committed Mar 13, 2019
1 parent 48b45ff commit 4ad0ea41871335a9958df710e4dba33f92e301a8
@@ -41,7 +41,7 @@ hintRunner.testHint(hintPath, elementAttrAddedAlwaysTrue, { browserslist: ['> 1%
const elementAttrVersionAddedFalse: HintTest[] = [
{
name: 'Element attributes that have version added as false and not deprecated should fail.',
reports: [{ message: 'srcset attribute of the img element is not supported by ie.', position: { column: 9, line: 4 } }],
reports: [{ message: 'srcset attribute of the img element is not supported by ie.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('img-srcset')
}
];
@@ -87,7 +87,7 @@ hintRunner.testHint(hintPath, elementAddedVersionOfTargetedBrowser, { browsersli
const elementAddedInVersionAfterTargetedBrowserVersion: HintTest[] = [
{
name: 'Elements added in version after targeted browser should fail.',
reports: [{ message: 'video element is not supported by ie 8.', position: { column: 9, line: 4 } }],
reports: [{ message: 'video element is not supported by ie 8.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('video')
}
];
@@ -118,7 +118,7 @@ hintRunner.testHint(hintPath, globalAttrVersionAddedNull, { browserslist: ['last
const globalAttrVersionAddedFalse: HintTest[] = [
{
name: 'Global attributes that have version added as false and not deprecated should fail.',
reports: [{ message: 'global attribute dropzone is not supported by edge, firefox, ie.', position: { column: 9, line: 4 } }],
reports: [{ message: 'global attribute dropzone is not supported by edge, firefox, ie.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('global-attr-dropzone')
}
];
@@ -146,7 +146,7 @@ hintRunner.testHint(hintPath, globalAttrAddedVersionOfTargetedBrowser, { browser
const globalAttrAddedInVersionAfterTargetedBrowserVersion: HintTest[] = [
{
name: 'Global attributes added in version after targeted browser should fail.',
reports: [{ message: 'global attribute class is not supported by firefox 31.', position: { column: 9, line: 4 } }],
reports: [{ message: 'global attribute class is not supported by firefox 31.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('div')
}
];
@@ -169,7 +169,7 @@ hintRunner.testHint(hintPath, inputTypeVersionAddedNull, { browserslist: ['last
const inputTypeVersionAddedFalse: HintTest[] = [
{
name: 'Input types that have version added as false and not deprecated should fail.',
reports: [{ message: 'input type color is not supported by ie.', position: { column: 9, line: 4 } }],
reports: [{ message: 'input type color is not supported by ie.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('input-color')
}
];
@@ -179,7 +179,7 @@ hintRunner.testHint(hintPath, inputTypeVersionAddedFalse, { browserslist: ['ie 9
const inputTypeVersionAddedAfterTargetedBrowsers: HintTest[] = [
{
name: 'Input types added in a version after the targeted browsers should fail.',
reports: [{ message: 'input type color is not supported by chrome 19, firefox 28.', position: { column: 9, line: 4 } }],
reports: [{ message: 'input type color is not supported by chrome 19, firefox 28.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('input-color')
}
];
@@ -193,7 +193,7 @@ hintRunner.testHint(hintPath, inputTypeVersionAddedAfterTargetedBrowsers, { brow
const mixedFeaturedCompatibility: HintTest[] = [
{
name: 'Features with mixed compatibility (not supported for specific version and never supported) and not deprecated should throw errors for browsers in which the feature is not supported.',
reports: [{ message: 'integrity attribute of the link element is not supported by edge, ie, safari, safari_ios, samsunginternet_android 4, webview_android 4.', position: { column: 9, line: 4 } }],
reports: [{ message: 'integrity attribute of the link element is not supported by edge, ie, safari, safari_ios, samsunginternet_android 4, webview_android 4.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('link-integrity')
}
];
@@ -50,7 +50,7 @@ hintRunner.testHint(hintPath, removedForFlags, { browserslist: ['firefox 34'] })
const onlySupportedByFlags: HintTest[] = [
{
name: 'Elements only supported by flags should fail.',
reports: [{ message: 'shadow element is not supported by firefox 60.', position: { column: 9, line: 4 } }],
reports: [{ message: 'shadow element is not supported by firefox 60.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('shadow')
}
];
@@ -99,7 +99,7 @@ hintRunner.testHint(hintPath, elementRemovedVersionEarlierThanTargetedBrowser, {
const elementVersionAddedFalse: HintTest[] = [
{
name: 'Elements that have version added as false should fail.',
reports: [{ message: 'blink element is not supported by chrome.', position: { column: 9, line: 4 } }],
reports: [{ message: 'blink element is not supported by chrome.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('blink')
}
];
@@ -109,7 +109,7 @@ hintRunner.testHint(hintPath, elementVersionAddedFalse, { browserslist: ['last 2
const featureVersionAddedFalseForAllTargetedBrowsers: HintTest[] = [
{
name: 'Features with no support (version added is false) for multiple targeted browsers should fail.',
reports: [{ message: 'element element is not supported by any of your target browsers.', position: { column: 9, line: 4 } }],
reports: [{ message: 'element element is not supported by any of your target browsers.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('element')
}
];
@@ -119,7 +119,7 @@ hintRunner.testHint(hintPath, featureVersionAddedFalseForAllTargetedBrowsers, {
const elementVersionAddedFalseForMultipleBrowsers: HintTest[] = [
{
name: 'Elements that have version added as false for multiple browsers should fail with one error.',
reports: [{ message: 'blink element is not supported by chrome, edge, ie.', position: { column: 9, line: 4 } }],
reports: [{ message: 'blink element is not supported by chrome, edge, ie.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('blink')
}
];
@@ -129,7 +129,7 @@ hintRunner.testHint(hintPath, elementVersionAddedFalseForMultipleBrowsers, { bro
const featureVersionAddedMixedFalseAndNullForDifferentBrowsers: HintTest[] = [
{
name: 'Features with unknown support (version added is null) and no support (version added is false) for different browsers should fail for unsupported browsers.',
reports: [{ message: 'element element is not supported by edge, firefox_android.', position: { column: 9, line: 4 } }],
reports: [{ message: 'element element is not supported by edge, firefox_android.', position: { column: 9, line: 6 } }],
serverConfig: generateHTMLConfig('element')
}
];
@@ -26,7 +26,7 @@ const tests: HintTest[] = [
name: `'link' with initial // fails the hint`,
reports: [{
message: generateErrorMessage('//site.webmanifest'),
position: { column: 9, line: 1 }
position: { column: 9, line: 3 }
}],
serverConfig: generateHTMLPage('<link rel="manifest" href="//site.webmanifest">')
},
@@ -46,7 +46,7 @@ const tests: HintTest[] = [
name: `'script' with initial // fails the hint`,
reports: [{
message: generateErrorMessage('//script.js'),
position: { column: 9, line: 4 }
position: { column: 9, line: 6 }
}],
serverConfig: generateHTMLPage(undefined, '<script src="//script.js"></script>')
},
@@ -66,7 +66,7 @@ const tests: HintTest[] = [
name: `'a' with initial // fails the hint`,
reports: [{
message: generateErrorMessage('//home'),
position: { column: 9, line: 4 }
position: { column: 9, line: 6 }
}],
serverConfig: generateHTMLPage(undefined, '<a href="//home">home</a>')
},
@@ -39,5 +39,5 @@ hintRunner.testLocalHint(hintPath, testsIgnoredUrls, {
'sri'
]
}],
parser: ['html']
parsers: ['html']
});
@@ -33,8 +33,8 @@ const findMatch = (document: HTMLDocument, element: HTMLElement, query: string,
});
}

// Return the nth match if possible, or the first match otherwise.
return matches[matchIndex] || matches[0] || null;
// Return the nth match if possible.
return matches[matchIndex] || null;
};

/**
@@ -69,5 +69,13 @@ export default (document: HTMLDocument, element: HTMLElement): HTMLElement | nul
});
}

return null;
const firstClass = (element.getAttribute('class') || '').split(' ')[0];

// Elements with class names (try just the first).
if (firstClass) {
return findMatch(document, element, `${element.nodeName}.${firstClass}`);
}

// Otherwise use the nth match.
return findMatch(document, element, element.nodeName);
};
@@ -7,8 +7,8 @@ const compare = (originalSource: string, snapshotSource: string) => {
const originalDocument = createHTMLDocument(originalSource);
const snapshotDocument = createHTMLDocument(snapshotSource);

const originalElement = originalDocument.querySelectorAll('.original')[0] || null;
const snapshotElement = snapshotDocument.querySelectorAll('.snapshot')[0];
const originalElement = originalDocument.querySelectorAll('[data-original]')[0] || null;
const snapshotElement = snapshotDocument.querySelectorAll('[data-snapshot]')[0];

const foundElement = findOriginalElement(originalDocument, snapshotElement);

@@ -26,11 +26,11 @@ const compare = (originalSource: string, snapshotSource: string) => {
test('Find by URL match (src)', (t) => {
const result = compare(
`
<img class="original" src="test2.png">
<img data-original src="test2.png">
`,
`
<img src="test1.png">
<img class="snapshot" src="test2.png">
<img data-snapshot src="test2.png">
<img src="test3.png">
`
);
@@ -45,7 +45,7 @@ test('Find by URL no match (src)', (t) => {
`,
`
<img src="test1.png">
<img class="snapshot" src="test2.png">
<img data-snapshot src="test2.png">
<img src="test3.png">
`
);
@@ -57,12 +57,12 @@ test('Find by nth URL match (src)', (t) => {
const result = compare(
`
<img src="test2.png">
<img class="original" src="test2.png">
<img data-original src="test2.png">
`,
`
<img src="test1.png">
<img src="test2.png">
<img class="snapshot" src="test2.png">
<img data-snapshot src="test2.png">
<img src="test3.png">
`
);
@@ -73,11 +73,11 @@ test('Find by nth URL match (src)', (t) => {
test('Find by URL match (href)', (t) => {
const result = compare(
`
<link class="original" src="test2.css">
<link data-original src="test2.css">
`,
`
<link src="test1.css">
<link class="snapshot" src="test2.css">
<link data-snapshot src="test2.css">
<link src="test3.css">
`
);
@@ -88,11 +88,11 @@ test('Find by URL match (href)', (t) => {
test('Find by content match (script)', (t) => {
const result = compare(
`
<script class="original">var foo2 = 'bar';</script>
<script data-original>var foo2 = 'bar';</script>
`,
`
<script>var foo1 = 'bar';</script>
<script class="snapshot">var foo2 = 'bar';</script>
<script data-snapshot>var foo2 = 'bar';</script>
<script>var foo3 = 'bar';</script>
`
);
@@ -106,7 +106,7 @@ test('Find by URL or content no match (script)', (t) => {
<script src="test2.js"></script>
`,
`
<script class="snapshot" src="test1.js"></script>
<script data-snapshot src="test1.js"></script>
<script src="test2.js"></script>
`
);
@@ -118,28 +118,59 @@ test('Find by nth content match (button)', (t) => {
const result = compare(
`
<button>OK</button>
<button class="original">OK</button>
<button data-original>OK</button>
`,
`
<button>OK</button>
<button>Cancel</button>
<button class="snapshot">OK</button>
<button data-snapshot>OK</button>
<button>Cancel</button>
`
);

t.true(result);
});

test('Find by first class match (div)', (t) => {
const result = compare(
`
<div class="first">Test</div>
<div class="second" data-original>Test</div>
<div class="third">Test</div>
`,
`
<div class="first">Test</div>
<div class="third">Test</div>
<div class="second active" data-snapshot>Test</div>
`
);

t.true(result);
});

test('Find by first class no match (div)', (t) => {
const result = compare(
`
<div class="first">Test</div>
`,
`
<div class="first">Test</div>
<div class="second" data-snapshot>Test</div>
`
);

t.true(result);
});

test('Find by singleton match (html)', (t) => {
const result = compare(
`
<html class="original">
<html data-original>
Test
</html>
`,
`
<html class="snapshot">
<html data-snapshot>
<head>
<title></title>
</head>
@@ -152,3 +183,42 @@ test('Find by singleton match (html)', (t) => {

t.true(result);
});

test('Find by nth match (tr)', (t) => {
const result = compare(
`
<table>
<tr><td>Data</td></tr>
<tr data-original><td>Data</td></tr>
</table>
`,
`
<table>
<tr><td>Data</td></tr>
<tr data-snapshot><td>Data</td></tr>
</table>
`
);

t.true(result);
});

test('Find by nth no match (tr)', (t) => {
const result = compare(
`
<table>
<tr><td>Data</td></tr>
<tr><td>Data</td></tr>
</table>
`,
`
<table>
<tr><td>Data</td></tr>
<tr><td>Data</td></tr>
<tr data-snapshot><td>Data</td></tr>
</table>
`
);

t.true(result);
});
@@ -55,6 +55,7 @@ const createConfig = (id: string, connector: string, opts?: any): Configuration
options: {}
},
hints,
ignoredUrls: opts.ignoredUrls,
parsers: determineParsers(opts && opts.parsers)
};

0 comments on commit 4ad0ea4

Please sign in to comment.
You can’t perform that action at this time.