chromium/src/third_party/blink/web_tests/external/wpt/css/css-text/i18n/zh/css-text-line-break-zh-pr-normal.html - manifest_repos/chromium_src - Git at Google

 <!DOCTYPE html>
 <html  lang="en" >
 <head>
 <meta charset="utf-8"/>
 <title>CSS text, linebreaks: PR AFW (normal,zh)</title>
 <link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
 <link rel="help" href="https://drafts.csswg.org/css-text-3/#line-break-property">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <meta name="assert" content="When the language is Chinese, and line-break:normal, a browser will NOT allow a break before a PR character with East Asian Width of A, F, or W.">
 <style type="text/css">
 @font-face {
     font-family: 'mplus-1p-regular';
     src: url('/fonts/mplus-1p-regular.woff') format('woff');
     }
 #wrapper { position: relative; }
 .test { color: red; }
 .test, .ref { font-size: 30px; font-family: mplus-1p-regular, sans-serif; width: 185px; padding: 0; border: 1px solid orange; line-height: 1em; }
 </style>
 <style>
 .test { line-break: normal; }
 </style>
 <script>
 var charlist = `00B1  PLUS-MINUS SIGN
 20AC  EURO SIGN
 2116  NUMERO SIGN
 FE69  SMALL DOLLAR SIGN
 FF04  FULLWIDTH DOLLAR SIGN
 FFE1  FULLWIDTH POUND SIGN
 FFE5  FULLWIDTH YEN SIGN
 FFE6  FULLWIDTH WON SIGN`
 </script>
 </head>
 <body>
 <script>
 var lines = charlist.split('\n')
 var out = '<div id="log"></div>\n'
 for (var i=0;i<lines.length;i++) {
 	// get the data
 	var firstSpace = lines[i].indexOf(' ')
 	var hex = lines[i].substr(0,firstSpace)
 	var name = lines[i].substr(firstSpace)
 	// make a test
 	out +=  '<div class="wrapper"><div>'+hex+'</div>' +
 	'<div class="test" id="test'+i+'" lang="zh">文文文文文文&#x'+hex+';字<span id="testSpan'+i+'">字</span></div>' +
 	 '<div class="ref" id="ref'+i+'" lang="zh">文文文文文<br/>文&#x'+hex+';字<span id="refSpan'+i+'">字</span></div>' +
 	 '</div>'
 	}
 function spansNearEnough(counter) {
   return Math.abs( document.getElementById('testSpan'+counter).getBoundingClientRect().left
            - document.getElementById('refSpan'+counter).getBoundingClientRect().left ) < 1;
 }

 document.querySelector('body').innerHTML = out
 setup({explicit_done: true});

 document.fonts.ready.then(validate);

 function validate() {
   for (i=0;i<lines.length;i++) {
     test(function() {
       assert_true(spansNearEnough(i));
     }, lines[i]+' may NOT appear at line start if zh and normal');
     // Hide successful tests.
     if (spansNearEnough(i)) document.getElementById('test'+i).parentNode.style.display = 'none'
   }
   done();
 }
 </script>
 <!--Notes:
 The test creates a box with room for 6 characters, causing wrapping to occur either between the 6th and the 7th character, or before the 6th if the breaks after the 6th or before the 7th are prohibited.

 It also creates the expected behaviour with a ref instance, using <br/>. Each line ends with a span. The test then checks whether the left edge of the span is in the same place in test and ref instance.
 -->
 </body>
 </html>
	<!DOCTYPE html>
	<html lang="en" >
	<head>
	<meta charset="utf-8"/>
	<title>CSS text, linebreaks: PR AFW (normal,zh)</title>
	<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
	<link rel="help" href="https://drafts.csswg.org/css-text-3/#line-break-property">
	<script src="/resources/testharness.js"></script>
	<script src="/resources/testharnessreport.js"></script>
	<meta name="assert" content="When the language is Chinese, and line-break:normal, a browser will NOT allow a break before a PR character with East Asian Width of A, F, or W.">
	<style type="text/css">
	@font-face {
	font-family: 'mplus-1p-regular';
	src: url('/fonts/mplus-1p-regular.woff') format('woff');
	}
	#wrapper { position: relative; }
	.test { color: red; }
	.test, .ref { font-size: 30px; font-family: mplus-1p-regular, sans-serif; width: 185px; padding: 0; border: 1px solid orange; line-height: 1em; }
	</style>
	<style>
	.test { line-break: normal; }
	</style>
	<script>
	var charlist = `00B1 PLUS-MINUS SIGN
	20AC EURO SIGN
	2116 NUMERO SIGN
	FE69 SMALL DOLLAR SIGN
	FF04 FULLWIDTH DOLLAR SIGN
	FFE1 FULLWIDTH POUND SIGN
	FFE5 FULLWIDTH YEN SIGN
	FFE6 FULLWIDTH WON SIGN`
	</script>
	</head>
	<body>
	<script>
	var lines = charlist.split('\n')
	var out = '<div id="log"></div>\n'
	for (var i=0;i<lines.length;i++) {
	// get the data
	var firstSpace = lines[i].indexOf(' ')
	var hex = lines[i].substr(0,firstSpace)
	var name = lines[i].substr(firstSpace)
	// make a test
	out += '<div class="wrapper"><div>'+hex+'</div>' +
	'<div class="test" id="test'+i+'" lang="zh">文文文文文文&#x'+hex+';字<span id="testSpan'+i+'">字</span></div>' +
	'<div class="ref" id="ref'+i+'" lang="zh">文文文文文<br/>文&#x'+hex+';字<span id="refSpan'+i+'">字</span></div>' +
	'</div>'
	}
	function spansNearEnough(counter) {
	return Math.abs( document.getElementById('testSpan'+counter).getBoundingClientRect().left
	- document.getElementById('refSpan'+counter).getBoundingClientRect().left ) < 1;
	}

	document.querySelector('body').innerHTML = out
	setup({explicit_done: true});

	document.fonts.ready.then(validate);

	function validate() {
	for (i=0;i<lines.length;i++) {
	test(function() {
	assert_true(spansNearEnough(i));
	}, lines[i]+' may NOT appear at line start if zh and normal');
	// Hide successful tests.
	if (spansNearEnough(i)) document.getElementById('test'+i).parentNode.style.display = 'none'
	}
	done();
	}
	</script>
	<!--Notes:
	The test creates a box with room for 6 characters, causing wrapping to occur either between the 6th and the 7th character, or before the 6th if the breaks after the 6th or before the 7th are prohibited.

	It also creates the expected behaviour with a ref instance, using <br/>. Each line ends with a span. The test then checks whether the left edge of the span is in the same place in test and ref instance.
	-->
	</body>
	</html>