Commit 5b2b4b0c authored by Charlie Hu's avatar Charlie Hu Committed by Commit Bot

Isolate font-display wpt tests to subframes

In order to unblock document policy violation report deduplication
implementation, it is necessary to separate subtests for font-display
wpt test into subframes so that their violation reports do not
interfere with each other.

Bug: 1087277
Change-Id: I79ece4fbaae2b28b40b85ca0a0df4daffd54bca0
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2227863Reviewed-by: default avatarJason Chase <chasej@chromium.org>
Commit-Queue: Charlie Hu <chenleihu@google.com>
Cr-Commit-Position: refs/heads/master@{#775291}
parent 887bb131
<!DOCTYPE html>
<html>
<head>
<title>Test for font-display-late-swap feature policy set to report-only</title>
<link rel="help" href="https://github.com/w3c/webappsec-feature-policy/blob/master/policies/font-display-late-swap.md">
<script src='/resources/testharness.js'></script>
<script src='/resources/testharnessreport.js'></script>
<style>
</style>
</head>
<body>
<p>
Tests if the correct number of violation reports are generated and each report corresponds to this feature.
4 reports should be created out of the 6 options below (reports for all except for 'fallback' and 'optional').
</p>
<table id="container">
<tr>
<th>not-set</th>
<th>auto</th>
<th>block</th>
<th>swap</th>
<th>fallback</th>
<th>optional</th>
</tr>
</table>
<script>
const fontDisplayValues = ['', 'auto', 'block', 'swap', 'fallback', 'optional'];
const table = document.getElementById('container');
function makeFontFaceDeclaration(family, display) {
url = '/fonts/Ahem.ttf?pipe=trickle(d1)'; // Before the swap period is over
return '@font-face { font-family: ' + family + '; src: url("' + url + '"); font-display: ' + display + '; }';
}
window.onload = () => {
let tr = document.createElement('tr');
for (let display of fontDisplayValues) {
const family = display + '-face';
const rule = makeFontFaceDeclaration(family, display);
document.styleSheets[0].insertRule(rule, 0);
let td = document.createElement('td');
td.textContent = 'a';
td.style.fontFamily = family + ', Arial';
tr.appendChild(td);
}
table.appendChild(tr);
}
let reportCounter = 4;
let t = async_test('font-display-late-swap Report Format');
let check_report_format = (reports, observer) => {
reportCounter -= reports.length;
for (let report of reports) {
assert_equals(report.type, 'document-policy-violation');
assert_equals(report.url, document.location.href, 'Report URL');
assert_equals(report.body.featureId, 'font-display-late-swap');
assert_equals(report.body.disposition, 'report');
assert_true('sourceFile' in report.body);
assert_true('lineNumber' in report.body);
assert_true('columnNumber' in report.body);
}
// Test is done when we have exactly 4 reports for the following
// font-display values: not set, 'auto', 'block', 'swap'
if (reportCounter == 0) t.done();
};
new ReportingObserver(t.step_func(check_report_format),
{types: ['document-policy-violation'], buffered: true}).observe();
</script>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<title>Test for font-display-late-swap feature policy set to reporting</title>
<link rel="help" href="https://github.com/w3c/webappsec-feature-policy/blob/master/policies/font-display-late-swap.md">
<script src='/resources/testharness.js'></script>
<script src='/resources/testharnessreport.js'></script>
<style>
</style>
</head>
<body>
<p>
Tests if the correct number of violation reports are generated and each report corresponds to this feature.
4 reports should be created out of the 6 options below (reports for all except for 'fallback' and 'optional').
</p>
<table id="container">
<tr>
<th>not-set</th>
<th>auto</th>
<th>block</th>
<th>swap</th>
<th>fallback</th>
<th>optional</th>
</tr>
</table>
<script>
const fontDisplayValues = ['', 'auto', 'block', 'swap', 'fallback', 'optional'];
const table = document.getElementById('container');
function makeFontFaceDeclaration(family, display) {
url = '/fonts/Ahem.ttf?pipe=trickle(d1)'; // Before the swap period is over
return '@font-face { font-family: ' + family + '; src: url("' + url + '"); font-display: ' + display + '; }';
}
window.onload = () => {
let tr = document.createElement('tr');
for (let display of fontDisplayValues) {
const family = display + '-face';
const rule = makeFontFaceDeclaration(family, display);
document.styleSheets[0].insertRule(rule, 0);
let td = document.createElement('td');
td.textContent = 'a';
td.style.fontFamily = family + ', Arial';
tr.appendChild(td);
}
table.appendChild(tr);
}
let reportCounter = 4;
let t = async_test('font-display-late-swap Report Format');
let check_report_format = (reports, observer) => {
reportCounter -= reports.length;
for (let report of reports) {
assert_equals(report.type, 'document-policy-violation');
assert_equals(report.url, document.location.href, 'Report URL');
assert_equals(report.body.featureId, 'font-display-late-swap');
assert_equals(report.body.disposition, 'enforce');
assert_true('sourceFile' in report.body);
assert_true('lineNumber' in report.body);
assert_true('columnNumber' in report.body);
}
// Test is done when we have exactly 4 reports for the following
// font-display values: not set, 'auto', 'block', 'swap'
if (reportCounter == 0) t.done();
};
new ReportingObserver(t.step_func(check_report_format),
{types: ['document-policy-violation'], buffered: true}).observe();
</script>
</body>
</html>
\ No newline at end of file
......@@ -2,7 +2,7 @@
<html class="reftest-wait">
<title>Test for no-font-display-late-swap document policy behavior</title>
<link rel="help" href="https://github.com/w3c/webappsec-feature-policy/blob/master/policies/font-display-late-swap.md">
<link rel="match" href="font-display-document-policy-01.tentative-ref.html">
<link rel="match" href="override-to-optional.tentative-ref.html">
<style>
</style>
<p>Tests if font-display is set to optional for each option except for when it is set to fallback</p>
......
<!DOCTYPE html>
<title>Test for font-display-late-swap feature policy set to report-only</title>
<link rel="help" href="https://github.com/w3c/webappsec-feature-policy/blob/master/policies/font-display-late-swap.md">
<script src='/resources/testharness.js'></script>
<script src='/resources/testharnessreport.js'></script>
<style></style>
<p>
Tests if the correct number of violation reports are generated and each report corresponds to this feature.
4 reports should be created out of the 6 options below (reports for all except for 'fallback' and 'optional').
</p>
<table id="container">
<tr>
<th>not-set</th>
<th>auto</th>
<th>block</th>
<th>swap</th>
<th>fallback</th>
<th>optional</th>
</tr>
</table>
<script>
const fontDisplayValues = ['', 'auto', 'block', 'swap', 'fallback', 'optional'];
const table = document.getElementById('container');
const t = async_test('font-display-late-swap Report Format');
function makeFontFaceDeclaration(family, display) {
url = '/fonts/Ahem.ttf?pipe=trickle(d1)'; // Before the swap period is over
return `@font-face { font-family: ${family}; src: url("${url}"); font-display: ${display}; }`;
}
window.onload = () => {
let tr = document.createElement('tr');
for (let display of fontDisplayValues) {
const family = display + '-face';
const rule = makeFontFaceDeclaration(family, display);
// Create a separate iframe for testing purpose.
// For same document, violation reports with same content might be deduped.
let iframe = document.createElement('iframe');
iframe.src = 'resources/report-only-iframe.html';
iframe.onload = t.step_func(() => {
iframe.contentWindow.postMessage({
display,
family,
rule
}, '*');
});
let td = document.createElement('td');
td.appendChild(iframe);
tr.appendChild(td);
}
table.appendChild(tr);
}
function check_report_format(report) {
assert_equals(report.type, 'document-policy-violation');
assert_equals(report.url, document.getElementsByTagName('iframe')[0].contentWindow.location.href);
assert_equals(report.body.featureId, 'font-display-late-swap');
assert_equals(report.body.disposition, 'report');
assert_true('sourceFile' in report.body);
assert_true('lineNumber' in report.body);
assert_true('columnNumber' in report.body);
};
const expectedFontDisplayValues = ['', 'auto', 'block', 'swap']
expectedFontDisplayValues.sort();
const fontDisplayValuesReceived = [];
window.onmessage = t.step_func((e) => {
const reports = JSON.parse(e.data.reports);
assert_equals(reports.length, 1);
check_report_format(reports[0]);
fontDisplayValuesReceived.push(e.data.fontDisplayValue);
// Test is done when we have exactly 4 reports for the following
// font-display values: not set, 'auto', 'block', 'swap'
if (fontDisplayValuesReceived.length == 4) {
fontDisplayValuesReceived.sort();
assert_array_equals(fontDisplayValuesReceived, expectedFontDisplayValues);
t.done();
}
});
</script>
<!DOCTYPE html>
<title>Test for font-display-late-swap feature policy</title>
<link rel="help" href="https://github.com/w3c/webappsec-feature-policy/blob/master/policies/font-display-late-swap.md">
<script src='/resources/testharness.js'></script>
<script src='/resources/testharnessreport.js'></script>
<style></style>
<p>
Tests if the correct number of violation reports are generated and each report corresponds to this feature.
4 reports should be created out of the 6 options below (reports for all except for 'fallback' and 'optional').
</p>
<table id="container">
<tr>
<th>not-set</th>
<th>auto</th>
<th>block</th>
<th>swap</th>
<th>fallback</th>
<th>optional</th>
</tr>
</table>
<script>
const fontDisplayValues = ['', 'auto', 'block', 'swap', 'fallback', 'optional'];
const table = document.getElementById('container');
const t = async_test('font-display-late-swap Report Format');
function makeFontFaceDeclaration(family, display) {
url = '/fonts/Ahem.ttf?pipe=trickle(d1)'; // Before the swap period is over
return `@font-face { font-family: ${family}; src: url("${url}"); font-display: ${display}; }`;
}
window.onload = () => {
let tr = document.createElement('tr');
for (let display of fontDisplayValues) {
const family = display + '-face';
const rule = makeFontFaceDeclaration(family, display);
// Create a separate iframe for testing purpose.
// For same document, violation reports with same content might be deduped.
let iframe = document.createElement('iframe');
iframe.src = 'resources/reporting-iframe.html';
iframe.onload = t.step_func(() => {
iframe.contentWindow.postMessage({
display,
family,
rule
}, '*');
});
let td = document.createElement('td');
td.appendChild(iframe);
tr.appendChild(td);
}
table.appendChild(tr);
}
function check_report_format(report) {
assert_equals(report.type, 'document-policy-violation');
assert_equals(report.url, document.getElementsByTagName('iframe')[0].contentWindow.location.href);
assert_equals(report.body.featureId, 'font-display-late-swap');
assert_equals(report.body.disposition, 'enforce');
assert_true('sourceFile' in report.body);
assert_true('lineNumber' in report.body);
assert_true('columnNumber' in report.body);
};
const expectedFontDisplayValues = ['', 'auto', 'block', 'swap']
expectedFontDisplayValues.sort();
const fontDisplayValuesReceived = [];
window.onmessage = t.step_func((e) => {
const reports = JSON.parse(e.data.reports);
assert_equals(reports.length, 1);
check_report_format(reports[0]);
fontDisplayValuesReceived.push(e.data.fontDisplayValue);
// Test is done when we have exactly 4 reports for the following
// font-display values: not set, 'auto', 'block', 'swap'
if (fontDisplayValuesReceived.length == 4) {
fontDisplayValuesReceived.sort();
assert_array_equals(fontDisplayValuesReceived, expectedFontDisplayValues);
t.done();
}
});
</script>
<!DOCTYPE html>
<style></style>
<p>This is a subframe with 'no-font-display-late-swap'</p>
<p id="text"></p>
<script>
window.onmessage = (e) => {
const rule = e.data.rule;
const family = e.data.family;
// Id used to distinguish response source in main frame.
const display = e.data.display;
function send_report(reports) {
// stringify reports because report is not clonable.
e.source.postMessage({
fontDisplayValue: display,
reports: JSON.stringify(reports)
}, '*');
}
new ReportingObserver(send_report, {
types: ['document-policy-violation'],
buffered: true
})
.observe();
document.styleSheets[0].insertRule(rule, 0);
// Trigger font display violation.
const p = document.getElementById('text');
p.textContent = 'a';
p.style.fontFamily = `${family}, Arial`;
};
</script>
<!DOCTYPE html>
<style></style>
<p>This is a subframe with 'no-font-display-late-swap'</p>
<p id="text"></p>
<script>
window.onmessage = (e) => {
const rule = e.data.rule;
const family = e.data.family;
// Id used to distinguish response source in main frame.
const display = e.data.display;
function send_report(reports) {
// stringify reports because report is not clonable.
e.source.postMessage({
fontDisplayValue: display,
reports: JSON.stringify(reports)
}, '*');
}
new ReportingObserver(send_report, {
types: ['document-policy-violation'],
buffered: true
})
.observe();
document.styleSheets[0].insertRule(rule, 0);
// Trigger font display violation.
const p = document.getElementById('text');
p.textContent = 'a';
p.style.fontFamily = `${family}, Arial`;
};
</script>
......@@ -295,7 +295,7 @@ SET TIMEOUT: css/css-fonts/font-display/font-display-change-ref.html
SET TIMEOUT: css/css-fonts/font-display/font-display-feature-policy-01.tentative.html
SET TIMEOUT: css/css-fonts/font-display/font-display-feature-policy-02.tentative.html
SET TIMEOUT: css/css-fonts/font-display/font-display-preload.html
SET TIMEOUT: document-policy/font-display/font-display-document-policy-01.tentative.html
SET TIMEOUT: document-policy/font-display/override-to-optional.tentative.html
SET TIMEOUT: feature-policy/experimental-features/resources/focus-without-user-activation-iframe-tentative.html
SET TIMEOUT: html/browsers/windows/auxiliary-browsing-contexts/resources/close-opener.html
SET TIMEOUT: html/cross-origin-embedder-policy/resources/navigate-none.sub.html
......
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