third_party/WebKit/LayoutTests/external/wpt/css-font-display/font-display.html - Issue 2895123002: Convert CSS font-display test to wpt

Side by Side Diff: third_party/WebKit/LayoutTests/external/wpt/css-font-display/font-display.html

Issue 2895123002: Convert CSS font-display test to wpt (Closed)

Patch Set: rebase, update network service expectation Created 3 years, 6 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

« no previous file with comments | « third_party/WebKit/LayoutTests/TestExpectations ('k') | third_party/WebKit/LayoutTests/external/wpt/css-font-display/font-display-ref.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!DOCTYPE html>	1 <!DOCTYPE html>

	2 <html class="reftest-wait">

2 <title>Test for font-display @font-face descriptor</title>	3 <title>Test for font-display @font-face descriptor</title>

	4 <link rel="match" href="font-display-ref.html">

3 <style>	5 <style>

4 .hidden { display: none; }	6 .hidden { display: none; }

5 </style>	7 </style>

6 <p>Tests how text with a font that takes <i>delay</i> seconds to load look like after <i>T</i> seconds from load start.</p>	8 <p>Tests how text with a font that takes <i>delay</i> seconds to load look like after <i>T</i> seconds from load start.</p>

7 <table id="container">	9 <table id="container">

8 <tr>	10 <tr>

9 <th>T[sec]</th>	11 <th>T[sec]</th>

10 <th>delay[sec]</th>	12 <th>delay[sec]</th>

11 <th>auto</th>	13 <th>auto</th>

12 <th>block</th>	14 <th>block</th>

13 <th>swap</th>	15 <th>swap</th>

14 <th>fallback</th>	16 <th>fallback</th>

15 <th>optional</th>	17 <th>optional</th>

16 </tr>	18 </tr>

17 </table>	19 </table>

18 <script>	20 <script>

19 if (window.testRunner)

20 testRunner.waitUntilDone();

21

22 var fontDisplayValues = ['auto', 'block', 'swap', 'fallback', 'optional'];	21 var fontDisplayValues = ['auto', 'block', 'swap', 'fallback', 'optional'];

23 var configs = [{time: 0, delay: 1000},	22 var configs = [{time: 0, delay: 1000},

24 {time: 1000, delay: 0},	23 {time: 1000, delay: 0},

25 {time: 1000, delay: 500},	24 {time: 1000, delay: 500},

26 {time: 1000, delay: 3000},	25 {time: 1000, delay: 3000},

27 {time: 5000, delay: 2000},	26 {time: 5000, delay: 2000},

28 {time: 5000, delay: 4000},	27 {time: 5000, delay: 4000},

29 {time: 5000, delay: 8000}];	28 {time: 5000, delay: 8000}];

30	29

31 function makeFontFaceDeclaration(family, config, display) {	30 function makeFontFaceDeclaration(family, config, display) {

32 var url = '/resources/Ahem.ttf';	31 url = 'resources/slow-ahem-loading.py?ms=' + config.delay;

33 if (config.delay > 0)

34 url = 'slow-ahem-loading.cgi?delay=' + config.delay + '&t=' + config.tim e;

35 return '@font-face { font-family: ' + family + '; src: url(' + url + '); fon t-display: ' + display + '; }';	32 return '@font-face { font-family: ' + family + '; src: url(' + url + '); fon t-display: ' + display + '; }';

36 }	33 }

37	34

38	35

39 var maxTime = Math.max.apply(null, configs.map((config) => config.time));	36 var maxTime = Math.max.apply(null, configs.map((config) => config.time));

40 var table = document.getElementById('container');	37 var table = document.getElementById('container');

41	38

42 window.onload = function() {	39 window.onload = function() {

43 for (var config, i = 0; config = configs[i]; i++) {	40 for (var config, i = 0; config = configs[i]; i++) {

44 var tr = document.createElement('tr');	41 var tr = document.createElement('tr');

(...skipping 11 matching lines...) Expand all Loading...
56 document.styleSheets[0].insertRule(rule, 0);	53 document.styleSheets[0].insertRule(rule, 0);

57 var td = document.createElement('td');	54 var td = document.createElement('td');

58 td.textContent = 'a';	55 td.textContent = 'a';

59 td.style.fontFamily = family + ', Arial';	56 td.style.fontFamily = family + ', Arial';

60 tr.appendChild(td);	57 tr.appendChild(td);

61 }	58 }

62 table.appendChild(tr);	59 table.appendChild(tr);

63 if (config.time == 0) {	60 if (config.time == 0) {

64 setTimeout((function(tr){	61 setTimeout((function(tr){

65 tr.classList.remove('hidden');	62 tr.classList.remove('hidden');

66 if (window.testRunner)	63 document.documentElement.classList.remove("reftest-wait");

67 testRunner.notifyDone();

68 }).bind(null, tr), maxTime);	64 }).bind(null, tr), maxTime);

69 } else {	65 } else {

70 setTimeout((function(tr){tr.classList.remove('hidden')}).bind(null, tr), maxTime - config.time);	66 setTimeout((function(tr){tr.classList.remove('hidden')}).bind(null, tr), maxTime - config.time);

71 }	67 }

72 }	68 }

73 }	69 }

74	70

75 </script>	71 </script>

	72 </html>

OLD	NEW