UNPKG

han-css

Version:

The CSS typography framework optimised for Hanzi

268 lines (267 loc) 34.7 kB
(function(){ var test, module, doc, div, makeArray, qsa, convertHtml, htmlEqual; test = QUnit.test; module = QUnit.module; doc = function(){ return document.cloneNode(true); }; div = function(){ return document.createElement('div'); }; makeArray = function(it){ return [].slice.call(it); }; qsa = function(context, q){ return makeArray(context.querySelectorAll(q)); }; convertHtml = function(html){ return html.toLowerCase().replace(/[\x20\t\f\s]{2,}/g, '').replace(/[\r\n]/g, '').replace(/="([^"]+)"/g, '=$1'); }; htmlEqual = function(a, b, log){ a = convertHtml(a); b = convertHtml(b); return equal(a, b, log); }; module('Basics'); test('Default rendering routine', function(){ var before, d; before = '<html lang="zh"><head><title>A辭Q</title></head><body><article><p></article></body></html>'; d = doc(); d.documentElement.innerHTML = before; Han(d.body, d.documentElement).render(); htmlEqual(d.body.innerHTML, '<article><p></p></article>'); equal(d.title, 'A辭Q'); equal(d.documentElement.classList.contains('han-js-rendered'), true); before = '<html lang="ja"><head><title>AノQ</title></head><body><article><p></article></body></html>'; d = doc(); d.documentElement.innerHTML = before; Han(d.body, d.documentElement).render(); htmlEqual(d.body.innerHTML, '<article><p></p></article>'); equal(d.title, 'AノQ'); equal(d.documentElement.classList.contains('han-js-rendered'), true); }); module('Normalisation'); test('Adjacent decoration lines', function(){ var d; d = div(); d.innerHTML = '<u>a</u><u>b</u>c<u>d</u>'; Han(d).renderDecoLine(); htmlEqual(d.innerHTML, '<u>a</u><u class="adjacent">b</u>c<u>d</u>'); d.innerHTML = '<u></u><u></u><u></u>'; Han(d).renderDecoLine(); htmlEqual(d.innerHTML, '<u></u><u class="adjacent"></u><u></u>'); d.innerHTML = '<u>註記元素甲</u><ins>增訂元素甲</ins><u>註記元素乙</u>一般文字節點<ins>增訂元素乙</ins><u>註記元素丙</u><ins>增訂元素丙</ins>一般文字節點;<s>訛訊元素甲</s><del>刪訂元素甲</del><s>訛訊元素乙</s>一般文字節點<del>刪訂元素乙</del><s>訛訊元素乙</s><del>刪訂元素丙</del>。'; Han(d).renderDecoLine(); htmlEqual(d.innerHTML, '<u>註記元素甲</u><ins class="adjacent">增訂元素甲</ins><u class="adjacent">註記元素乙</u>一般文字節點<ins>增訂元素乙</ins><u class="adjacent">註記元素丙</u><ins class="adjacent">增訂元素丙</ins>一般文字節點;<s>訛訊元素甲</s><del>刪訂元素甲</del><s>訛訊元素乙</s>一般文字節點<del>刪訂元素乙</del><s>訛訊元素乙</s><del>刪訂元素丙</del>。'); d.innerHTML = '<u>註記元素丁</u><s>訛訊元素丁</s><ins>增訂元素丁</ins><del>刪訂元素丁</del>。'; Han(d).renderDecoLine(); htmlEqual(d.innerHTML, '<u>註記元素丁</u><s>訛訊元素丁</s><ins>增訂元素丁</ins><del>刪訂元素丁</del>。'); }); test('Emphasis marks', function(){ var support, d; support = Han.support.textemphasis; d = div(); d.innerHTML = '<em>測試abc</em>'; Han(d).renderEm(); if (support) { htmlEqual(d.innerHTML, '<em>測試abc</em>'); } else { htmlEqual(d.innerHTML, '<em><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk></h-char><h-word class=western><h-char class=alphabet latin>a</h-char><h-char class=alphabet latin>b</h-char><h-char class=alphabet latin>c</h-char></h-word></em>'); } d.innerHTML = '<em>「測『試』」,test ‘this!’。</em>'; Han(d).renderEm(); if (support) { htmlEqual(d.innerHTML, '<em><h-char unicode=300c class=biaodian cjk bd-open></h-char><h-char unicode=300e class=biaodian cjk bd-open></h-char><h-char unicode=300f class=biaodian cjk bd-close bd-end></h-char><h-char unicode=300d class=biaodian cjk bd-close bd-end></h-char><h-char unicode=ff0c class=biaodian cjk bd-end></h-char>test <h-char class=punct></h-char>this<h-char class=punct>!</h-char><h-char class=punct></h-char><h-char unicode=3002 class=biaodian cjk bd-end></h-char></em>'); } else { htmlEqual(d.innerHTML, '<em><h-jinze class=tou><h-char unicode=300c class=biaodian cjk bd-open></h-char><h-char class=hanzi cjk></h-char></h-jinze><h-jinze class=touwei><h-char unicode=300e class=biaodian cjk bd-open></h-char><h-char class=hanzi cjk></h-char><h-char-group class=biaodian cjk>』」,</h-char-group></h-jinze><h-word class=western><h-char class=alphabet latin>t</h-char><h-char class=alphabet latin>e</h-char><h-char class=alphabet latin>s</h-char><h-char class=alphabet latin>t</h-char></h-word> <h-word class=western><h-char class=punct></h-char><h-char class=alphabet latin>t</h-char><h-char class=alphabet latin>h</h-char><h-char class=alphabet latin>i</h-char><h-char class=alphabet latin>s</h-char><h-char class=punct>!</h-char></h-word><h-jinze class=wei><h-word class=western><h-char class=punct></h-char></h-word><h-char unicode=3002 class=biaodian cjk bd-end></h-char></h-jinze></em>'); } d.innerHTML = '<em>𫞵𫞦𠁻𠁶〇⼌⿕⺃⻍⻰⻳⿸⿷⿳</em>'; Han(d).renderEm(); if (support) { htmlEqual(d.innerHTML, '<em>𫞵𫞦𠁻𠁶〇⼌⿕⺃⻍⻰⻳⿸⿷⿳</em>'); } else { htmlEqual(d.innerHTML, '<em><h-char class=hanzi cjk>𫞵</h-char><h-char class=hanzi cjk>𫞦</h-char><h-char class=hanzi cjk>𠁻</h-char><h-char class=hanzi cjk>𠁶</h-char><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk></h-char></em>'); } d.innerHTML = '<em>¡Hola! Ὅμηρος Свети</em>'; Han(d).renderEm(); if (support) { htmlEqual(d.innerHTML, '<em><h-char class=punct>¡</h-char>hola<h-char class=punct>!</h-char> ὅμηρος свети</em>'); } else { htmlEqual(d.innerHTML, '<em><h-word class=western><h-char class=punct>¡</h-char><h-char class=alphabet latin>h</h-char><h-char class=alphabet latin>o</h-char><h-char class=alphabet latin>l</h-char><h-char class=alphabet latin>a</h-char><h-char class=punct>!</h-char></h-word> <h-word class=western><h-char class=alphabet ellinika greek></h-char><h-char class=alphabet ellinika greek>μ</h-char><h-char class=alphabet ellinika greek>η</h-char><h-char class=alphabet ellinika greek>ρ</h-char><h-char class=alphabet ellinika greek>ο</h-char><h-char class=alphabet ellinika greek>ς</h-char></h-word> <h-word class=western><h-char class=alphabet kirillica cyrillic>с</h-char><h-char class=alphabet kirillica cyrillic>в</h-char><h-char class=alphabet kirillica cyrillic>е</h-char><h-char class=alphabet kirillica cyrillic>т</h-char><h-char class=alphabet kirillica cyrillic>и</h-char></h-word></em>'); } }); test('Interlinear annotations (Ruby)', function(){ var support, supportZhuyin, supportRubyDisplay, d, ruby; support = Han.support.ruby; supportZhuyin = Han.support['ruby-interchar']; supportRubyDisplay = Han.support['ruby-display']; d = div(); d.innerHTML = '<ruby><rt>zi</ruby>'; Han(d).renderRuby(); if (support) { htmlEqual(d.innerHTML, '<ruby><rt>zi</rt></ruby>'); } else { htmlEqual(d.innerHTML, '<h-ruby><h-ru annotation=zi><rt>zi</rt></h-ru></h-ruby>'); } d.innerHTML = '<ruby class="zhuyin">\n 事<rt>ㄕˋ</rt><rt>ㄑㄧㄥˊ</rt>\n 看<rt>ㄎㄢˋ</rt>\n 冷<rt>ㄌㄥˇ</rt><rt>ㄋㄨㄢˇ</rt>\n</ruby>'; Han(d).renderRuby(); qsa(d, 'h-ru').forEach(function(it){ it.removeAttribute('form'); it.removeAttribute('zhuyin'); it.removeAttribute('diao'); it.removeAttribute('length'); }); if (supportZhuyin) { htmlEqual(d.innerHTML, '<ruby class=zhuyin><rt><h-zhuyin length=1 diao=ˋ><h-yin></h-yin><h-diao>ˋ</h-diao></h-zhuyin></rt><rt><h-zhuyin length=3 diao=ˊ><h-yin>ㄑㄧㄥ</h-yin><h-diao>ˊ</h-diao></h-zhuyin></rt><rt><h-zhuyin length=2 diao=ˋ><h-yin>ㄎㄢ</h-yin><h-diao>ˋ</h-diao></h-zhuyin></rt><rt><h-zhuyin length=2 diao=ˇ><h-yin>ㄌㄥ</h-yin><h-diao>ˇ</h-diao></h-zhuyin></rt><rt><h-zhuyin length=3 diao=ˇ><h-yin>ㄋㄨㄢ</h-yin><h-diao>ˇ</h-diao></h-zhuyin></rt></ruby>'); } else { htmlEqual(d.innerHTML, '<h-ruby class=zhuyin><h-ru><h-zhuyin length=1 diao=ˋ><h-yin></h-yin><h-diao>ˋ</h-diao></h-zhuyin></h-ru><h-ru><h-zhuyin length=3 diao=ˊ><h-yin>ㄑㄧㄥ</h-yin><h-diao>ˊ</h-diao></h-zhuyin></h-ru><h-ru><h-zhuyin length=2 diao=ˋ><h-yin>ㄎㄢ</h-yin><h-diao>ˋ</h-diao></h-zhuyin></h-ru><h-ru><h-zhuyin length=2 diao=ˇ><h-yin>ㄌㄥ</h-yin><h-diao>ˇ</h-diao></h-zhuyin></h-ru><h-ru><h-zhuyin length=3 diao=ˇ><h-yin>ㄋㄨㄢ</h-yin><h-diao>ˇ</h-diao></h-zhuyin></h-ru></h-ruby>'); } d.innerHTML = '<p>\n <ruby class="complex">\n 辛亥革命發生在<rb>1911-</rb><rb>10-</rb><rb>10,</rb>\n <rtc><rt></rt><rt></rt><rt></rt></rtc>\n <rtc><rt rbspan="3">清宣統三年</rt></rtc>\n 那天革命先烈們一同推翻了帝制。\n </ruby>\n</p>'; Han(d).renderRuby(); d.querySelector('h-ruby').removeAttribute('doubleline'); qsa(d, 'h-ru').forEach(function(it){ it.removeAttribute('annotation'); it.removeAttribute('order'); it.removeAttribute('span'); }); htmlEqual(d.innerHTML, '<p><h-ruby class=complex>辛亥革命發生在<h-ru class=complex><h-ru class=complex><rb>1911-</rb><rt></rt></h-ru><h-ru class=complex><rb>10-</rb><rt></rt></h-ru><h-ru class=complex><rb>10,</rb><rt></rt></h-ru><rt rbspan=3>清宣統三年</rt></h-ru>那天革命先烈們一同推翻了帝制。</h-ruby></p>'); d.innerHTML = '<p>\n <ruby class="complex">\n 「<rb></rb><rb></rb><rb></rb>」\n <rtc class="reading romanization">\n <rt rbspan="2">Niǔyuē</rt><rt>Shì</rt>\n </rtc>\n <rtc class="reading annotation">\n <rt rbspan="3">New York City</rt>\n </rtc>\n </ruby>\n\n <ruby class="complex">\n 『<rb></rb><rb></rb><rb></rb>』\n <rtc class="reading annotation">\n <rt rbspan="3">New York City</rt>\n </rtc>\n <rtc class="reading romanization">\n <rt rbspan="2">Niǔyuē</rt><rt>Shì</rt>\n </rtc>\n </ruby>\n\n <ruby class="complex">\n ‘<rb></rb><rb></rb><rb></rb>’\n <rtc class="reading annotation">\n <rt rbspan="3">New York City</rt>\n </rtc>\n <rtc class="reading romanization">\n <rt>niǔ</rt><rt>yuē</rt><rt>shì</rt></rtc>\n </ruby>\n\n <ruby class="complex">\n &#x201E;<rb></rb><rb></rb><rb></rb>&#x201F;\n <rtc class="reading romanization">\n <rt>niǔ</rt><rt>yuē</rt><rt>shì</rt>\n </rtc>\n <rtc class="reading annotation">\n <rt rbspan="3">New York City</rt>\n </rtc>\n </ruby>\n\n <ruby class="complex">\n ⸘<rb></rb><rb></rb><rb></rb>‽\n <rtc class="reading annotation">\n <rt rbspan="3">New York City</rt>\n </rtc>\n <rtc class="reading annotation">\n <rt rbspan="3">世界之都</rt>\n </rtc>\n </ruby>。\n<p>\n <ruby class="complex">\n <rb></rb><rb></rb><rb></rb><rb></rb><rb></rb><rb></rb>,\n <rb></rb><rb></rb><rb></rb><rb></rb><rb></rb>!\n\n <rtc class="romanization">\n <rt>san1</rt><rt>shih2</rt><rt>liu4</rt><rt>ko0</rt><rt>ya2</rt><rt>ch\'ih3</rt><rt>cho1</rt><rt rbspan="2">tuirh4</rt><rt>ssu1</rt><rt>ta3</rt>\n </rtc>\n <rtc class="romanization">\n <rt>sān</rt><rt>shí</rt><rt>liù</rt><rt>ge</rt><rt></rt><rt>chǐ</rt><rt>zhuō</rt><rt rbspan="2">duìr</rt><rt></rt><rt></rt>\n </rtc>\n </ruby>'; Han(d).renderRuby(); qsa(d, 'h-ruby').forEach(function(it){ it.removeAttribute('doubleline'); }); qsa(d, 'h-ru').forEach(function(it){ it.removeAttribute('annotation'); it.removeAttribute('order'); it.removeAttribute('span'); }); htmlEqual(d.innerHTML, '<p><h-ruby class=complex><h-ru class=complex><h-ru class=complex><rb></rb><rb></rb><rt rbspan=2>niǔyuē</rt></h-ru><h-ru class=complex><rb></rb><rt>shì</rt></h-ru><rt rbspan=3>new york city</rt></h-ru></h-ruby><h-ruby class=complex><h-ru class=complex><h-ru class=complex><rb></rb><rb></rb><rt rbspan=2>niǔyuē</rt></h-ru><h-ru class=complex><rb></rb><rt>shì</rt></h-ru><rt rbspan=3>new york city</rt></h-ru></h-ruby><h-ruby class=complex><h-ru class=complex><h-ru class=complex><rb></rb><rt>niǔ</rt></h-ru><h-ru class=complex><rb></rb><rt>yuē</rt></h-ru><h-ru class=complex><rb></rb><rt>shì</rt></h-ru><rt rbspan=3>new york city</rt></h-ru></h-ruby><h-ruby class=complex><h-ru class=complex><h-ru class=complex><rb></rb><rt>niǔ</rt></h-ru><h-ru class=complex><rb></rb><rt>yuē</rt></h-ru><h-ru class=complex><rb></rb><rt>shì</rt></h-ru><rt rbspan=3>new york city</rt></h-ru></h-ruby><h-ruby class=complex><h-ru class=complex><h-ru class=complex><rb></rb><rb></rb><rb></rb><rt rbspan=3>new york city</rt></h-ru><rt rbspan=3>世界之都</rt></h-ru></h-ruby></p><p><h-ruby class=complex><h-ru class=complex><h-ru class=complex><rb></rb><rt>san1</rt></h-ru><rt>sān</rt></h-ru><h-ru class=complex><h-ru class=complex><rb></rb><rt>shih2</rt></h-ru><rt>shí</rt></h-ru><h-ru class=complex><h-ru class=complex><rb></rb><rt>liu4</rt></h-ru><rt>liù</rt></h-ru><h-ru class=complex><h-ru class=complex><rb></rb><rt>ko0</rt></h-ru><rt>ge</rt></h-ru><h-ru class=complex><h-ru class=complex><rb></rb><rt>ya2</rt></h-ru><rt></rt></h-ru><h-ru class=complex><h-ru class=complex><rb></rb><rt>ch\'ih3</rt></h-ru><rt>chǐ</rt></h-ru><h-ru class=complex><h-ru class=complex><rb></rb><rt>cho1</rt></h-ru><rt>zhuō</rt></h-ru><h-ru class=complex><h-ru class=complex><rb></rb><rb></rb><rt rbspan=2>tuirh4</rt></h-ru><rt rbspan=2>duìr</rt></h-ru><h-ru class=complex><h-ru class=complex><rb></rb><rt>ssu1</rt></h-ru><rt></rt></h-ru><h-ru class=complex><h-ru class=complex><rb></rb><rt>ta3</rt></h-ru><rt></rt></h-ru></h-ruby></p>'); d.innerHTML = '<p>\n <ruby class="complex">\n <rb></rb>\n <rb></rb>\n <rb></rb>\n <rb></rb>\n <rb></rb>\n <rb></rb>。\n\n <rtc class="zhuyin">\n <rt>ㄐㄧㆵ͘</rt>\n <rt>ㄌㄤˊ</rt>\n <rt>ㄏㄨㄢˊ</rt>\n <rt>ㄌㄜˋ</rt>\n <rt>ㄐㄧㆵ͘</rt>\n <rt>ㄧㆫ˫</rt>\n </rtc>\n\n <rtc class="romanization">\n <rt>Tsi̍t</rt>\n <rt>lâng</rt>\n <rt rbspan="2">hoân‑ló</rt>\n <rt>chi̍t</rt>\n <rt>iūⁿ</rt>\n </rtc>\n\n <rtc class="romanization"><rt>Tsi̍t</rt>\n <rt>lâng</rt>\n <rt rbspan="2">huân-ló</rt>\n <rt>tsi̍t</rt>\n <rt>iūnn</rt>\n </rtc>\n </ruby>\n</p>'; Han(d).renderRuby(); ruby = d.querySelector('h-ruby'); ruby.removeAttribute('rightangle'); ruby.removeAttribute('doubleline'); qsa(d, 'h-ru').forEach(function(it){ it.removeAttribute('annotation'); it.removeAttribute('order'); it.removeAttribute('span'); it.removeAttribute('form'); it.removeAttribute('zhuyin'); it.removeAttribute('diao'); it.removeAttribute('length'); }); htmlEqual(d.innerHTML, '<p><h-ruby class=complex><h-ru class=complex><h-ru class=complex><h-ru><rb></rb><h-zhuyin length=2 diao=ㆵ͘><h-yin>ㄐㄧ</h-yin><h-diao>ㆵ͘</h-diao></h-zhuyin></h-ru><rt>tsi̍t</rt></h-ru><rt>tsi̍t</rt></h-ru><h-ru class=complex><h-ru class=complex><h-ru><rb></rb><h-zhuyin length=2 diao=ˊ><h-yin>ㄌㄤ</h-yin><h-diao>ˊ</h-diao></h-zhuyin></h-ru><rt>lâng</rt></h-ru><rt>lâng</rt></h-ru><h-ru class=complex><h-ru class=complex><h-ru><rb></rb><h-zhuyin length=3 diao=ˊ><h-yin>ㄏㄨㄢ</h-yin><h-diao>ˊ</h-diao></h-zhuyin></h-ru><h-ru><rb></rb><h-zhuyin length=2 diao=ˋ><h-yin>ㄌㄜ</h-yin><h-diao>ˋ</h-diao></h-zhuyin></h-ru><rt rbspan=2>hoân‑ló</rt></h-ru><rt rbspan=2>huân-ló</rt></h-ru><h-ru class=complex><h-ru class=complex><h-ru><rb></rb><h-zhuyin length=2 diao=ㆵ͘><h-yin>ㄐㄧ</h-yin><h-diao>ㆵ͘</h-diao></h-zhuyin></h-ru><rt>chi̍t</rt></h-ru><rt>tsi̍t</rt></h-ru><h-ru class=complex><h-ru class=complex><h-ru><rb></rb><h-zhuyin length=2 diao=˫><h-yin>ㄧㆫ</h-yin><h-diao>˫</h-diao></h-zhuyin></h-ru><rt>iūⁿ</rt></h-ru><rt>iūnn</rt></h-ru></h-ruby></p>'); }); module('Advanced typesetting features'); test('Hanzi-Western script mixed spacing (HWS)', function(){ var d; d = div(); d.innerHTML = '測試test測試123測試'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '測試<h-hws hidden=""> </h-hws>test<h-hws hidden=""> </h-hws>測試<h-hws hidden=""> </h-hws>123<h-hws hidden=""> </h-hws>測試'); d.innerHTML = '中文加上 <code>some code</code>,中文加上 <code>some code</code> 放在中間,<code>some code</code> 加上中文,一般的 English。'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '中文加上 <code>some code</code>,中文加上 <code>some code</code> 放在中間,<code>some code</code> 加上中文,一般的 English。'); d.innerHTML = '中文加上<code>some code</code>,中文加上<code>some code</code>放在中間,<code>some code</code>加上中文,一般的English。'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '中文加上<h-hws hidden=""> </h-hws><code>some code</code>,中文加上<h-hws hidden=""> </h-hws><code>some code</code><h-hws hidden=""> </h-hws>放在中間,<code>some code</code><h-hws hidden=""> </h-hws>加上中文,一般的<h-hws hidden=""> </h-hws>English。'); d.innerHTML = '測試 test 測試 123 測試<code>測試 test測試。</code>'; Han(d).renderHWS(true); htmlEqual(d.innerHTML, '測試<h-hws hidden=""> </h-hws>test<h-hws hidden=""> </h-hws>測試<h-hws hidden=""> </h-hws>123<h-hws hidden=""> </h-hws>測試<code>測試 test測試。</code>'); d.innerHTML = '測試,test測試123。'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '測試,test<h-hws hidden=""> </h-hws>測試<h-hws hidden=""> </h-hws>123。'); d.innerHTML = '測試α測試β測試'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '測試<h-hws hidden=""> </h-hws>α<h-hws hidden=""> </h-hws>測試<h-hws hidden=""> </h-hws>β<h-hws hidden=""> </h-hws>測試'); d.innerHTML = 'я測試у測試ь測試в'; Han(d).renderHWS(); htmlEqual(d.innerHTML, 'я<h-hws hidden=""> </h-hws>測試<h-hws hidden=""> </h-hws>у<h-hws hidden=""> </h-hws>測試<h-hws hidden=""> </h-hws>ь<h-hws hidden=""> </h-hws>測試<h-hws hidden=""> </h-hws>в'); d.innerHTML = 'A㐀a㘻a䶵a𠀀a𫠝a〇a⿸a⻍a⻰aのa'; Han(d).renderHWS(); htmlEqual(d.innerHTML, 'a<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>a<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>a<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>a<h-hws hidden=""> </h-hws>𠀀<h-hws hidden=""> </h-hws>a<h-hws hidden=""> </h-hws>𫠝<h-hws hidden=""> </h-hws>a<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>a<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>a<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>a<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>a<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>a'); d.innerHTML = '天然ê上好。荷Ὅ̴̊̌ηρος̃馬。貓К҉о҈ш҉к҈а҈咪。'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '天然<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>上好。荷<h-hws hidden=""> </h-hws>ὅ̴̊̌ηρος̃<h-hws hidden=""> </h-hws>馬。貓<h-hws hidden=""> </h-hws>к҉о҈ш҉к҈а҈<h-hws hidden=""> </h-hws>咪。'); d.innerHTML = '去<u>Europe</u>旅行。'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '去<h-hws hidden=""> </h-hws><u>europe</u><h-hws hidden=""> </h-hws>旅行。'); d.innerHTML = '去<!-- x -->Europe<wbr><!---->旅行。'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '去<!-- x --><h-hws hidden=""> </h-hws>europe<wbr><!----><h-hws hidden=""> </h-hws>旅行。'); d.innerHTML = '測試¿測試?測試¡測試!為‘什’麼;為“什”麼?'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '測試<h-hws hidden=""> </h-hws>¿測試?<h-hws hidden=""> </h-hws>測試<h-hws hidden=""> </h-hws>¡測試!<h-hws hidden=""> </h-hws>為‘什’麼;<h-hws hidden=""> </h-hws>為“什”麼?'); d.innerHTML = '單\'引\'號和雙"引"號和單\'引\'號和雙"引"號.'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '單<h-hws hidden=""> </h-hws>\'引\'<h-hws hidden=""> </h-hws>號和雙<h-hws hidden=""> </h-hws>"引"<h-hws hidden=""> </h-hws>號和單<h-hws hidden=""> </h-hws>\'引\'<h-hws hidden=""> </h-hws>號和雙<h-hws hidden=""> </h-hws>"引"<h-hws hidden=""> </h-hws>號.'); d.innerHTML = '\'單x引x號\'"雙x引x號".'; Han(d).renderHWS(); htmlEqual(d.innerHTML, '\'單<h-hws hidden=""> </h-hws>x<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>x<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>號\'"雙<h-hws hidden=""> </h-hws>x<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>x<h-hws hidden=""> </h-hws><h-hws hidden=""> </h-hws>號".'); d.innerHTML = '單\'引\'號和雙"引"號和單\'引\'號和雙"引"號.'; Han(d).renderHWS(); return htmlEqual(d.innerHTML, '單<h-hws hidden=""> </h-hws>\'引\'<h-hws hidden=""> </h-hws>號和雙<h-hws hidden=""> </h-hws>"引"<h-hws hidden=""> </h-hws>號和單<h-hws hidden=""> </h-hws>\'引\'<h-hws hidden=""> </h-hws>號和雙<h-hws hidden=""> </h-hws>"引"<h-hws hidden=""> </h-hws>號.'); }); test('Biaodian jiya', function(){ var d; d = div(); d.innerHTML = '「字『字』?」字「字『字』」字?'; Han(d).renderJiya(); /* qsa d, \h-char .forEach -> it.removeAttribute \unicode */ htmlEqual(d.innerHTML, '<h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char><h-char unicode=300e class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char><h-char-group class=biaodian cjk><h-char unicode=300f class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char unicode=ff1f class=biaodian cjk bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char unicode=300d class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char></h-char-group><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char><h-char unicode=300e class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char><h-char-group class=biaodian cjk><h-char unicode=300f class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char unicode=300d class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char></h-char-group><h-char unicode=ff1f class=biaodian cjk bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char>'); d.innerHTML = '字、「字」字,(字)字……「字」。'; Han(d).renderJiya(); /* qsa d, \h-char .forEach -> it.removeAttribute \unicode */ htmlEqual(d.innerHTML, '字<h-char-group class=biaodian cjk><h-char unicode=3001 class=biaodian cjk bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-char unicode=300d class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char-group class=biaodian cjk><h-char unicode=ff0c class=biaodian cjk bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char unicode=ff08 class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-char unicode=ff09 class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char-group class=biaodian cjk><h-char unicode=2026 class=biaodian cjk bd-liga>……</h-char><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-char-group class=biaodian cjk><h-char unicode=300d class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char unicode=3002 class=biaodian cjk bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char></h-char-group>'); d.innerHTML = '《書名》〈篇名〉(內容)'; Han(d).renderJiya(); /* qsa d, \h-char .forEach -> it.removeAttribute \unicode */ return htmlEqual(d.innerHTML, '<h-char unicode=300a class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char>書名<h-char-group class=biaodian cjk><h-char unicode=300b class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char unicode=3008 class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group>篇名<h-char-group class=biaodian cjk><h-char unicode=3009 class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char unicode=ff08 class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group>內容<h-char unicode=ff09 class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char>'); }); test('Hanging Biaodian', function(){ var d; d = div(); d.innerHTML = '點、點,點。點.'; Han(d).renderHanging(); htmlEqual(d.innerHTML, '點<h-hangable><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable><h-hangable><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable><h-hangable><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable><h-hangable><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable>'); d.innerHTML = '「標點。」'; Han(d).renderHanging(); htmlEqual(d.innerHTML, '「標點。」'); d.innerHTML = '標點……。'; Han(d).renderHanging(); htmlEqual(d.innerHTML, '標點<h-hangable>……<h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable>'); d.innerHTML = '「標點」。'; Han(d).renderHanging(); htmlEqual(d.innerHTML, '「標點<h-hangable><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable>'); }); test('Jiya and Hanging', function(){ var d, support; d = div(); d.innerHTML = '「標」、「『標』」,《標》、〈標〉。'; Han(d).renderHanging().renderJiya(); htmlEqual(d.innerHTML, '<h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char><h-hangable><h-char unicode=300d class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable><h-char-group class=biaodian cjk portion><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char><h-char unicode=300e class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-hangable><h-char unicode=300f class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-char unicode=300d class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable><h-char-group class=biaodian cjk portion><h-char unicode=300a class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-hangable><h-char unicode=300b class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable><h-char-group class=biaodian cjk portion><h-char unicode=3008 class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-hangable><h-char unicode=3009 class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable>'); d.innerHTML = '<a href="#">《書名》</a>、「文字」、<strong>『重點』</strong>。'; Han(d).renderHanging().renderJiya(); htmlEqual(d.innerHTML, '<a href=#><h-char unicode=300a class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char>書名<h-hangable><h-char unicode=300b class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable></a><h-char-group class=biaodian cjk portion><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-char-group class=biaodian cjk portion><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group>文字<h-hangable><h-char unicode=300d class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable><strong><h-char-group class=biaodian cjk portion><h-char unicode=300e class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group>重點<h-hangable><h-char unicode=300f class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable></strong>'); d.innerHTML = '<a href="#">《書名》</a><em>「強調」</em><strong>『重點』</strong>。'; Han(d).renderHanging().renderJiya().renderElem(); support = Han.support.textemphasis; if (support) { htmlEqual(d.innerHTML, '<a href=#><h-char unicode=300a class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char>書名<h-hangable><h-char unicode=300b class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable></a><h-char-group class=biaodian cjk portion><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-char-group class=biaodian cjk portion><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><em><h-char-group class=biaodian cjk portion><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group>強調<h-hangable><h-char unicode=300d class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable></em><h-char-group class=biaodian cjk portion><h-char unicode=300e class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-char-group class=biaodian cjk portion><h-char unicode=300e class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><strong><h-char-group class=biaodian cjk portion><h-char unicode=300e class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group>重點<h-hangable><h-char unicode=300f class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable></strong>'); } else { htmlEqual(d.innerHTML, '<a href=#><h-char unicode=300a class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char>書名<h-hangable><h-char unicode=300b class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable></a><h-char-group class=biaodian cjk portion><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-char-group class=biaodian cjk portion><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><em><h-char-group class=biaodian cjk portion><h-char unicode=300c class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-char class=hanzi cjk></h-char><h-char class=hanzi cjk>調</h-char><h-hangable><h-char unicode=300d class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable></em><h-char-group class=biaodian cjk portion><h-char unicode=300e class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><h-char-group class=biaodian cjk portion><h-char unicode=300e class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group><strong><h-char-group class=biaodian cjk portion><h-char unicode=300e class=biaodian cjk bd-open><h-cs hidden=""> </h-cs><h-inner></h-inner></h-char></h-char-group>重點<h-hangable><h-char unicode=300f class=biaodian cjk bd-close bd-end><h-inner></h-inner><h-cs hidden=""> </h-cs></h-char><h-cs><h-inner hidden=""> </h-inner><h-char class=biaodian bd-close bd-end cjk></h-char></h-cs></h-hangable></strong>'); } }); }).call(this);