tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

css-text-line-break-de-cj-strict.html (4339B)

      1 <!DOCTYPE html>
      2 <html  lang="en" >
      3 <head>
      4 <meta charset="utf-8"/>
      5 <title>line-break:strict, Conditional Japanese Starter (CJ) (de)</title>
      6 <link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
      7 <link rel="help" href="https://drafts.csswg.org/css-text-3/#line-break-property">
      8 <script src="/resources/testharness.js"></script>
      9 <script src="/resources/testharnessreport.js"></script>
     10 <meta name="assert" content="With line-break:strict, a browser will NOT allow a conditional Japanese starter at the beginning of a line; the language not being Chinese or Japanese makes no difference.">
     11 <style type="text/css">
     12 @font-face {
     13    font-family: 'mplus-1p-regular';
     14    src: url('/fonts/mplus-1p-regular.woff') format('woff');
     15    }
     16 #wrapper { position: relative; }
     17 .test { color: red; }
     18 .test, .ref { font-size: 30px; font-family: mplus-1p-regular, sans-serif; width: 185px; padding: 0; border: 1px solid orange; line-height: 1em; }
     19 </style>
     20 <style>
     21 .test { line-break: strict; }
     22 </style>
     23 <script>
     24 var charlist = `3041  HIRAGANA LETTER SMALL A
     25 3043  HIRAGANA LETTER SMALL I
     26 3045  HIRAGANA LETTER SMALL U
     27 3047  HIRAGANA LETTER SMALL E
     28 3049  HIRAGANA LETTER SMALL O
     29 3063  HIRAGANA LETTER SMALL TU
     30 3083  HIRAGANA LETTER SMALL YA
     31 3085  HIRAGANA LETTER SMALL YU
     32 3087  HIRAGANA LETTER SMALL YO
     33 308E  HIRAGANA LETTER SMALL WA
     34 3095  HIRAGANA LETTER SMALL KA
     35 3096  HIRAGANA LETTER SMALL KE
     36 30A1  KATAKANA LETTER SMALL A
     37 30A3  KATAKANA LETTER SMALL I
     38 30A5  KATAKANA LETTER SMALL U
     39 30A7  KATAKANA LETTER SMALL E
     40 30A9  KATAKANA LETTER SMALL O
     41 30C3  KATAKANA LETTER SMALL TU
     42 30E3  KATAKANA LETTER SMALL YA
     43 30E5  KATAKANA LETTER SMALL YU
     44 30E7  KATAKANA LETTER SMALL YO
     45 30EE  KATAKANA LETTER SMALL WA
     46 30F5  KATAKANA LETTER SMALL KA
     47 30F6  KATAKANA LETTER SMALL KE
     48 30FC  KATAKANA-HIRAGANA PROLONGED SOUND MARK
     49 31F0  KATAKANA LETTER SMALL KU
     50 31F1  KATAKANA LETTER SMALL SI
     51 31F2  KATAKANA LETTER SMALL SU
     52 31F3  KATAKANA LETTER SMALL TO
     53 31F4  KATAKANA LETTER SMALL NU
     54 31F5  KATAKANA LETTER SMALL HA
     55 31F6  KATAKANA LETTER SMALL HI
     56 31F7  KATAKANA LETTER SMALL HU
     57 31F8  KATAKANA LETTER SMALL HE
     58 31F9  KATAKANA LETTER SMALL HO
     59 31FA  KATAKANA LETTER SMALL MU
     60 31FB  KATAKANA LETTER SMALL RA
     61 31FC  KATAKANA LETTER SMALL RI
     62 31FD  KATAKANA LETTER SMALL RU
     63 31FE  KATAKANA LETTER SMALL RE
     64 31FF  KATAKANA LETTER SMALL RO
     65 FF67  HALFWIDTH KATAKANA LETTER SMALL A
     66 FF68  HALFWIDTH KATAKANA LETTER SMALL I
     67 FF69  HALFWIDTH KATAKANA LETTER SMALL U
     68 FF6A  HALFWIDTH KATAKANA LETTER SMALL E
     69 FF6B  HALFWIDTH KATAKANA LETTER SMALL O
     70 FF6C  HALFWIDTH KATAKANA LETTER SMALL YA
     71 FF6D  HALFWIDTH KATAKANA LETTER SMALL YU
     72 FF6E  HALFWIDTH KATAKANA LETTER SMALL YO
     73 FF6F  HALFWIDTH KATAKANA LETTER SMALL TU
     74 FF70  HALFWIDTH KATAKANA-HIRAGANA PROLONGED SOUND MARK`
     75 </script>
     76 </head>
     77 <body>
     78 <script>
     79 var lines = charlist.split('\n')
     80 var out = '<div id="log"></div>\n'
     81 for (var i=0;i<lines.length;i++) {
     82 // get the data
     83 var firstSpace = lines[i].indexOf(' ')
     84 var hex = lines[i].substr(0,firstSpace)
     85 var name = lines[i].substr(firstSpace)
     86 // make a test
     87 out +=  '<div class="wrapper"><div>'+hex+'</div>' +
     88 '<div class="test" id="test'+i+'" lang="de">文文文文文文&#x'+hex+';字<span id="testSpan'+i+'">字</span></div>' +
     89  '<div class="ref" id="ref'+i+'" lang="de">文文文文文<br/>文&#x'+hex+';字<span id="refSpan'+i+'">字</span></div>' +
     90  '</div>'
     91 }
     92 
     93 document.querySelector('body').innerHTML = out
     94 setup({explicit_done: true});
     95 
     96 document.fonts.ready.then(validate);
     97 
     98 function validate() {
     99  for (i=0;i<lines.length;i++) {
    100    test(function() {
    101      assert_approx_equals(
    102        document.getElementById('testSpan'+i).getBoundingClientRect().left,
    103        document.getElementById('refSpan'+i).getBoundingClientRect().left, 1);
    104      // Hide successful tests.
    105      document.getElementById('test'+i).parentNode.style.display = 'none';
    106    }, lines[i]+' may NOT appear at line start if de and strict');
    107  }
    108  done();
    109 }
    110 </script>
    111 <!--Notes:
    112 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.
    113 
    114 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.
    115 -->
    116 </body>
    117 </html>