beautify-html-tests.js 38 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736
  1. /*global js_beautify: true */
  2. function run_html_tests(test_obj, Urlencoded, js_beautify, html_beautify, css_beautify)
  3. {
  4. var opts = {
  5. indent_size: 4,
  6. indent_char: ' ',
  7. preserve_newlines: true,
  8. jslint_happy: false,
  9. keep_array_indentation: false,
  10. brace_style: 'collapse',
  11. space_before_conditional: true,
  12. break_chained_methods: false,
  13. selector_separator: '\n',
  14. end_with_newline: false
  15. };
  16. function test_html_beautifier(input)
  17. {
  18. return html_beautify(input, opts);
  19. }
  20. var sanitytest;
  21. // test the input on beautifier with the current flag settings
  22. // does not check the indentation / surroundings as bt() does
  23. function test_fragment(input, expected)
  24. {
  25. expected = expected || expected === '' ? expected : input;
  26. sanitytest.expect(input, expected);
  27. // if the expected is different from input, run it again
  28. // expected output should be unchanged when run twice.
  29. if (expected !== input) {
  30. sanitytest.expect(expected, expected);
  31. }
  32. // Everywhere we do newlines, they should be replaced with opts.eol
  33. opts.eol = '\r\n';
  34. expected = expected.replace(/[\n]/g, '\r\n');
  35. sanitytest.expect(input, expected);
  36. input = input.replace(/[\n]/g, '\r\n');
  37. sanitytest.expect(input, expected);
  38. opts.eol = '\n';
  39. }
  40. // test html
  41. function bth(input, expectation)
  42. {
  43. var wrapped_input, wrapped_expectation, field_input, field_expectation;
  44. expectation = expectation || expectation === '' ? expectation : input;
  45. sanitytest.test_function(test_html_beautifier, 'html_beautify');
  46. test_fragment(input, expectation);
  47. if (opts.indent_size === 4 && input) {
  48. wrapped_input = '<div>\n' + input.replace(/^(.+)$/mg, ' $1') + '\n <span>inline</span>\n</div>';
  49. wrapped_expectation = '<div>\n' + expectation.replace(/^(.+)$/mg, ' $1') + '\n <span>inline</span>\n</div>';
  50. test_fragment(wrapped_input, wrapped_expectation);
  51. }
  52. }
  53. function unicode_char(value) {
  54. return String.fromCharCode(value)
  55. }
  56. function beautifier_tests()
  57. {
  58. sanitytest = test_obj;
  59. bth('');
  60. opts.indent_size = 4;
  61. opts.indent_char = ' ';
  62. opts.indent_with_tabs = false;
  63. opts.preserve_newlines = true;
  64. opts.jslint_happy = false;
  65. opts.keep_array_indentation = false;
  66. opts.brace_style = 'collapse';
  67. opts.extra_liners = ['html', 'head', '/html'];
  68. // End With Newline - (eof = "\n")
  69. opts.end_with_newline = true;
  70. test_fragment('', '\n');
  71. test_fragment('<div></div>', '<div></div>\n');
  72. test_fragment('\n');
  73. // End With Newline - (eof = "")
  74. opts.end_with_newline = false;
  75. test_fragment('');
  76. test_fragment('<div></div>');
  77. test_fragment('\n', '');
  78. // Custom Extra Liners (empty) - ()
  79. opts.extra_liners = [];
  80. test_fragment('<html><head><meta></head><body><div><p>x</p></div></body></html>', '<html>\n<head>\n <meta>\n</head>\n<body>\n <div>\n <p>x</p>\n </div>\n</body>\n</html>');
  81. // Custom Extra Liners (default) - ()
  82. opts.extra_liners = null;
  83. test_fragment('<html><head></head><body></body></html>', '<html>\n\n<head></head>\n\n<body></body>\n\n</html>');
  84. // Custom Extra Liners (p, string) - ()
  85. opts.extra_liners = 'p,/p';
  86. test_fragment('<html><head><meta></head><body><div><p>x</p></div></body></html>', '<html>\n<head>\n <meta>\n</head>\n<body>\n <div>\n\n <p>x\n\n </p>\n </div>\n</body>\n</html>');
  87. // Custom Extra Liners (p) - ()
  88. opts.extra_liners = ['p', '/p'];
  89. test_fragment('<html><head><meta></head><body><div><p>x</p></div></body></html>', '<html>\n<head>\n <meta>\n</head>\n<body>\n <div>\n\n <p>x\n\n </p>\n </div>\n</body>\n</html>');
  90. // Attribute Wrap - (eof = "\n", indent_attr = " ", over80 = "\n")
  91. opts.wrap_attributes = 'force';
  92. test_fragment('<div attr0 attr1="123" data-attr2="hello t here">This is some text</div>', '<div attr0\n attr1="123"\n data-attr2="hello t here">This is some text</div>');
  93. test_fragment('<div lookatthissuperduperlongattributenamewhoahcrazy0="true" attr0 attr1="123" data-attr2="hello t here" heymanimreallylongtoowhocomesupwiththesenames="false">This is some text</div>', '<div lookatthissuperduperlongattributenamewhoahcrazy0="true"\n attr0\n attr1="123"\n data-attr2="hello t here"\n heymanimreallylongtoowhocomesupwiththesenames="false">This is some text</div>');
  94. test_fragment('<img attr0 attr1="123" data-attr2="hello t here"/>', '<img attr0\n attr1="123"\n data-attr2="hello t here" />');
  95. // Attribute Wrap - (eof = "\n", indent_attr = " ", over80 = "\n")
  96. opts.wrap_attributes = 'force';
  97. opts.wrap_line_length = 80;
  98. test_fragment('<div attr0 attr1="123" data-attr2="hello t here">This is some text</div>', '<div attr0\n attr1="123"\n data-attr2="hello t here">This is some text</div>');
  99. test_fragment('<div lookatthissuperduperlongattributenamewhoahcrazy0="true" attr0 attr1="123" data-attr2="hello t here" heymanimreallylongtoowhocomesupwiththesenames="false">This is some text</div>', '<div lookatthissuperduperlongattributenamewhoahcrazy0="true"\n attr0\n attr1="123"\n data-attr2="hello t here"\n heymanimreallylongtoowhocomesupwiththesenames="false">This is some text</div>');
  100. test_fragment('<img attr0 attr1="123" data-attr2="hello t here"/>', '<img attr0\n attr1="123"\n data-attr2="hello t here" />');
  101. // Attribute Wrap - (eof = "\n", indent_attr = " ", over80 = "\n")
  102. opts.wrap_attributes = 'force';
  103. opts.wrap_attributes_indent_size = 8;
  104. test_fragment('<div attr0 attr1="123" data-attr2="hello t here">This is some text</div>', '<div attr0\n attr1="123"\n data-attr2="hello t here">This is some text</div>');
  105. test_fragment('<div lookatthissuperduperlongattributenamewhoahcrazy0="true" attr0 attr1="123" data-attr2="hello t here" heymanimreallylongtoowhocomesupwiththesenames="false">This is some text</div>', '<div lookatthissuperduperlongattributenamewhoahcrazy0="true"\n attr0\n attr1="123"\n data-attr2="hello t here"\n heymanimreallylongtoowhocomesupwiththesenames="false">This is some text</div>');
  106. test_fragment('<img attr0 attr1="123" data-attr2="hello t here"/>', '<img attr0\n attr1="123"\n data-attr2="hello t here" />');
  107. // Attribute Wrap - (eof = " ", indent_attr = "", over80 = "\n")
  108. opts.wrap_attributes = 'auto';
  109. opts.wrap_line_length = 80;
  110. test_fragment('<div attr0 attr1="123" data-attr2="hello t here">This is some text</div>');
  111. test_fragment('<div lookatthissuperduperlongattributenamewhoahcrazy0="true" attr0 attr1="123" data-attr2="hello t here" heymanimreallylongtoowhocomesupwiththesenames="false">This is some text</div>', '<div lookatthissuperduperlongattributenamewhoahcrazy0="true" attr0 attr1="123" data-attr2="hello t here"\nheymanimreallylongtoowhocomesupwiththesenames="false">This is some text</div>');
  112. test_fragment('<img attr0 attr1="123" data-attr2="hello t here"/>', '<img attr0 attr1="123" data-attr2="hello t here" />');
  113. // Attribute Wrap - (eof = " ", indent_attr = "", over80 = " ")
  114. opts.wrap_attributes = 'auto';
  115. opts.wrap_line_length = 0;
  116. test_fragment('<div attr0 attr1="123" data-attr2="hello t here">This is some text</div>');
  117. test_fragment('<div lookatthissuperduperlongattributenamewhoahcrazy0="true" attr0 attr1="123" data-attr2="hello t here" heymanimreallylongtoowhocomesupwiththesenames="false">This is some text</div>');
  118. test_fragment('<img attr0 attr1="123" data-attr2="hello t here"/>', '<img attr0 attr1="123" data-attr2="hello t here" />');
  119. // Handlebars Indenting Off
  120. opts.indent_handlebars = false;
  121. test_fragment(
  122. '{{#if 0}}\n <div>\n </div>\n{{/if}}',
  123. '{{#if 0}}\n<div>\n</div>\n{{/if}}');
  124. test_fragment(
  125. '<div>\n{{#each thing}}\n {{name}}\n{{/each}}\n</div>',
  126. '<div>\n {{#each thing}} {{name}} {{/each}}\n</div>');
  127. // Handlebars Indenting On - (content = "{{field}}")
  128. opts.indent_handlebars = true;
  129. test_fragment('{{page-title}}');
  130. test_fragment('{{#if 0}}{{/if}}');
  131. test_fragment('{{#if 0}}{{field}}{{/if}}');
  132. test_fragment('{{#if 0}}\n{{/if}}');
  133. test_fragment(
  134. '{{#if words}}{{/if}}',
  135. '{{#if words}}{{/if}}');
  136. test_fragment(
  137. '{{#if words}}{{field}}{{/if}}',
  138. '{{#if words}}{{field}}{{/if}}');
  139. test_fragment(
  140. '{{#if words}}{{field}}{{/if}}',
  141. '{{#if words}}{{field}}{{/if}}');
  142. test_fragment('{{#if 1}}\n <div>\n </div>\n{{/if}}');
  143. test_fragment(
  144. '{{#if 1}}\n<div>\n</div>\n{{/if}}',
  145. '{{#if 1}}\n <div>\n </div>\n{{/if}}');
  146. test_fragment('<div>\n {{#if 1}}\n {{/if}}\n</div>');
  147. test_fragment(
  148. '<div>\n{{#if 1}}\n{{/if}}\n</div>',
  149. '<div>\n {{#if 1}}\n {{/if}}\n</div>');
  150. test_fragment(
  151. '{{#if}}\n{{#each}}\n{{#if}}\n{{field}}\n{{/if}}\n{{#if}}\n{{field}}\n{{/if}}\n{{/each}}\n{{/if}}',
  152. '{{#if}}\n {{#each}}\n {{#if}}\n {{field}}\n {{/if}}\n {{#if}}\n {{field}}\n {{/if}}\n {{/each}}\n{{/if}}');
  153. test_fragment('{{#if 1}}\n <div>\n </div>\n{{/if}}');
  154. test_fragment(
  155. '{{#if 1}}\n {{field}}\n {{else}}\n {{field}}\n{{/if}}',
  156. '{{#if 1}}\n {{field}}\n{{else}}\n {{field}}\n{{/if}}');
  157. test_fragment(
  158. '{{#if 1}}\n {{else}}\n {{/if}}',
  159. '{{#if 1}}\n{{else}}\n{{/if}}');
  160. test_fragment(
  161. '{{#if thing}}\n{{#if otherthing}}\n {{field}}\n {{else}}\n{{field}}\n {{/if}}\n {{else}}\n{{field}}\n{{/if}}',
  162. '{{#if thing}}\n {{#if otherthing}}\n {{field}}\n {{else}}\n {{field}}\n {{/if}}\n{{else}}\n {{field}}\n{{/if}}');
  163. test_fragment(
  164. '<div{{somestyle}}></div>',
  165. '<div {{somestyle}}></div>');
  166. test_fragment(
  167. '<div{{#if test}}class="foo"{{/if}}>{{field}}</div>',
  168. '<div {{#if test}} class="foo" {{/if}}>{{field}}</div>');
  169. test_fragment(
  170. '<div{{#if thing}}{{somestyle}}class="{{class}}"{{else}}class="{{class2}}"{{/if}}>{{field}}</div>',
  171. '<div {{#if thing}} {{somestyle}} class="{{class}}" {{else}} class="{{class2}}" {{/if}}>{{field}}</div>');
  172. test_fragment(
  173. '<span{{#if condition}}class="foo"{{/if}}>{{field}}</span>',
  174. '<span {{#if condition}} class="foo" {{/if}}>{{field}}</span>');
  175. test_fragment('<div unformatted="{{#if}}{{field}}{{/if}}">{{field}}</div>');
  176. test_fragment('<div unformatted="{{#if }} {{field}}{{/if}}">{{field}}</div>');
  177. test_fragment('<div class="{{#if thingIs "value"}}{{field}}{{/if}}"></div>');
  178. test_fragment('<div class="{{#if thingIs \'value\'}}{{field}}{{/if}}"></div>');
  179. test_fragment('<div class=\'{{#if thingIs "value"}}{{field}}{{/if}}\'></div>');
  180. test_fragment('<div class=\'{{#if thingIs \'value\'}}{{field}}{{/if}}\'></div>');
  181. // Handlebars Indenting On - (content = "{{! comment}}")
  182. opts.indent_handlebars = true;
  183. test_fragment('{{page-title}}');
  184. test_fragment('{{#if 0}}{{/if}}');
  185. test_fragment('{{#if 0}}{{! comment}}{{/if}}');
  186. test_fragment('{{#if 0}}\n{{/if}}');
  187. test_fragment(
  188. '{{#if words}}{{/if}}',
  189. '{{#if words}}{{/if}}');
  190. test_fragment(
  191. '{{#if words}}{{! comment}}{{/if}}',
  192. '{{#if words}}{{! comment}}{{/if}}');
  193. test_fragment(
  194. '{{#if words}}{{! comment}}{{/if}}',
  195. '{{#if words}}{{! comment}}{{/if}}');
  196. test_fragment('{{#if 1}}\n <div>\n </div>\n{{/if}}');
  197. test_fragment(
  198. '{{#if 1}}\n<div>\n</div>\n{{/if}}',
  199. '{{#if 1}}\n <div>\n </div>\n{{/if}}');
  200. test_fragment('<div>\n {{#if 1}}\n {{/if}}\n</div>');
  201. test_fragment(
  202. '<div>\n{{#if 1}}\n{{/if}}\n</div>',
  203. '<div>\n {{#if 1}}\n {{/if}}\n</div>');
  204. test_fragment(
  205. '{{#if}}\n{{#each}}\n{{#if}}\n{{! comment}}\n{{/if}}\n{{#if}}\n{{! comment}}\n{{/if}}\n{{/each}}\n{{/if}}',
  206. '{{#if}}\n {{#each}}\n {{#if}}\n {{! comment}}\n {{/if}}\n {{#if}}\n {{! comment}}\n {{/if}}\n {{/each}}\n{{/if}}');
  207. test_fragment('{{#if 1}}\n <div>\n </div>\n{{/if}}');
  208. test_fragment(
  209. '{{#if 1}}\n {{! comment}}\n {{else}}\n {{! comment}}\n{{/if}}',
  210. '{{#if 1}}\n {{! comment}}\n{{else}}\n {{! comment}}\n{{/if}}');
  211. test_fragment(
  212. '{{#if 1}}\n {{else}}\n {{/if}}',
  213. '{{#if 1}}\n{{else}}\n{{/if}}');
  214. test_fragment(
  215. '{{#if thing}}\n{{#if otherthing}}\n {{! comment}}\n {{else}}\n{{! comment}}\n {{/if}}\n {{else}}\n{{! comment}}\n{{/if}}',
  216. '{{#if thing}}\n {{#if otherthing}}\n {{! comment}}\n {{else}}\n {{! comment}}\n {{/if}}\n{{else}}\n {{! comment}}\n{{/if}}');
  217. test_fragment(
  218. '<div{{somestyle}}></div>',
  219. '<div {{somestyle}}></div>');
  220. test_fragment(
  221. '<div{{#if test}}class="foo"{{/if}}>{{! comment}}</div>',
  222. '<div {{#if test}} class="foo" {{/if}}>{{! comment}}</div>');
  223. test_fragment(
  224. '<div{{#if thing}}{{somestyle}}class="{{class}}"{{else}}class="{{class2}}"{{/if}}>{{! comment}}</div>',
  225. '<div {{#if thing}} {{somestyle}} class="{{class}}" {{else}} class="{{class2}}" {{/if}}>{{! comment}}</div>');
  226. test_fragment(
  227. '<span{{#if condition}}class="foo"{{/if}}>{{! comment}}</span>',
  228. '<span {{#if condition}} class="foo" {{/if}}>{{! comment}}</span>');
  229. test_fragment('<div unformatted="{{#if}}{{! comment}}{{/if}}">{{! comment}}</div>');
  230. test_fragment('<div unformatted="{{#if }} {{! comment}}{{/if}}">{{! comment}}</div>');
  231. test_fragment('<div class="{{#if thingIs "value"}}{{! comment}}{{/if}}"></div>');
  232. test_fragment('<div class="{{#if thingIs \'value\'}}{{! comment}}{{/if}}"></div>');
  233. test_fragment('<div class=\'{{#if thingIs "value"}}{{! comment}}{{/if}}\'></div>');
  234. test_fragment('<div class=\'{{#if thingIs \'value\'}}{{! comment}}{{/if}}\'></div>');
  235. // Handlebars Indenting On - (content = "{pre{{field1}} {{field2}} {{field3}}post")
  236. opts.indent_handlebars = true;
  237. test_fragment('{{page-title}}');
  238. test_fragment('{{#if 0}}{{/if}}');
  239. test_fragment('{{#if 0}}{pre{{field1}} {{field2}} {{field3}}post{{/if}}');
  240. test_fragment('{{#if 0}}\n{{/if}}');
  241. test_fragment(
  242. '{{#if words}}{{/if}}',
  243. '{{#if words}}{{/if}}');
  244. test_fragment(
  245. '{{#if words}}{pre{{field1}} {{field2}} {{field3}}post{{/if}}',
  246. '{{#if words}}{pre{{field1}} {{field2}} {{field3}}post{{/if}}');
  247. test_fragment(
  248. '{{#if words}}{pre{{field1}} {{field2}} {{field3}}post{{/if}}',
  249. '{{#if words}}{pre{{field1}} {{field2}} {{field3}}post{{/if}}');
  250. test_fragment('{{#if 1}}\n <div>\n </div>\n{{/if}}');
  251. test_fragment(
  252. '{{#if 1}}\n<div>\n</div>\n{{/if}}',
  253. '{{#if 1}}\n <div>\n </div>\n{{/if}}');
  254. test_fragment('<div>\n {{#if 1}}\n {{/if}}\n</div>');
  255. test_fragment(
  256. '<div>\n{{#if 1}}\n{{/if}}\n</div>',
  257. '<div>\n {{#if 1}}\n {{/if}}\n</div>');
  258. test_fragment(
  259. '{{#if}}\n{{#each}}\n{{#if}}\n{pre{{field1}} {{field2}} {{field3}}post\n{{/if}}\n{{#if}}\n{pre{{field1}} {{field2}} {{field3}}post\n{{/if}}\n{{/each}}\n{{/if}}',
  260. '{{#if}}\n {{#each}}\n {{#if}}\n {pre{{field1}} {{field2}} {{field3}}post\n {{/if}}\n {{#if}}\n {pre{{field1}} {{field2}} {{field3}}post\n {{/if}}\n {{/each}}\n{{/if}}');
  261. test_fragment('{{#if 1}}\n <div>\n </div>\n{{/if}}');
  262. test_fragment(
  263. '{{#if 1}}\n {pre{{field1}} {{field2}} {{field3}}post\n {{else}}\n {pre{{field1}} {{field2}} {{field3}}post\n{{/if}}',
  264. '{{#if 1}}\n {pre{{field1}} {{field2}} {{field3}}post\n{{else}}\n {pre{{field1}} {{field2}} {{field3}}post\n{{/if}}');
  265. test_fragment(
  266. '{{#if 1}}\n {{else}}\n {{/if}}',
  267. '{{#if 1}}\n{{else}}\n{{/if}}');
  268. test_fragment(
  269. '{{#if thing}}\n{{#if otherthing}}\n {pre{{field1}} {{field2}} {{field3}}post\n {{else}}\n{pre{{field1}} {{field2}} {{field3}}post\n {{/if}}\n {{else}}\n{pre{{field1}} {{field2}} {{field3}}post\n{{/if}}',
  270. '{{#if thing}}\n {{#if otherthing}}\n {pre{{field1}} {{field2}} {{field3}}post\n {{else}}\n {pre{{field1}} {{field2}} {{field3}}post\n {{/if}}\n{{else}}\n {pre{{field1}} {{field2}} {{field3}}post\n{{/if}}');
  271. test_fragment(
  272. '<div{{somestyle}}></div>',
  273. '<div {{somestyle}}></div>');
  274. test_fragment(
  275. '<div{{#if test}}class="foo"{{/if}}>{pre{{field1}} {{field2}} {{field3}}post</div>',
  276. '<div {{#if test}} class="foo" {{/if}}>{pre{{field1}} {{field2}} {{field3}}post</div>');
  277. test_fragment(
  278. '<div{{#if thing}}{{somestyle}}class="{{class}}"{{else}}class="{{class2}}"{{/if}}>{pre{{field1}} {{field2}} {{field3}}post</div>',
  279. '<div {{#if thing}} {{somestyle}} class="{{class}}" {{else}} class="{{class2}}" {{/if}}>{pre{{field1}} {{field2}} {{field3}}post</div>');
  280. test_fragment(
  281. '<span{{#if condition}}class="foo"{{/if}}>{pre{{field1}} {{field2}} {{field3}}post</span>',
  282. '<span {{#if condition}} class="foo" {{/if}}>{pre{{field1}} {{field2}} {{field3}}post</span>');
  283. test_fragment('<div unformatted="{{#if}}{pre{{field1}} {{field2}} {{field3}}post{{/if}}">{pre{{field1}} {{field2}} {{field3}}post</div>');
  284. test_fragment('<div unformatted="{{#if }} {pre{{field1}} {{field2}} {{field3}}post{{/if}}">{pre{{field1}} {{field2}} {{field3}}post</div>');
  285. test_fragment('<div class="{{#if thingIs "value"}}{pre{{field1}} {{field2}} {{field3}}post{{/if}}"></div>');
  286. test_fragment('<div class="{{#if thingIs \'value\'}}{pre{{field1}} {{field2}} {{field3}}post{{/if}}"></div>');
  287. test_fragment('<div class=\'{{#if thingIs "value"}}{pre{{field1}} {{field2}} {{field3}}post{{/if}}\'></div>');
  288. test_fragment('<div class=\'{{#if thingIs \'value\'}}{pre{{field1}} {{field2}} {{field3}}post{{/if}}\'></div>');
  289. // Handlebars Indenting On - (content = "{{! \n mult-line\ncomment \n with spacing\n}}")
  290. opts.indent_handlebars = true;
  291. test_fragment('{{page-title}}');
  292. test_fragment('{{#if 0}}{{/if}}');
  293. test_fragment('{{#if 0}}{{! \n mult-line\ncomment \n with spacing\n}}{{/if}}');
  294. test_fragment('{{#if 0}}\n{{/if}}');
  295. test_fragment(
  296. '{{#if words}}{{/if}}',
  297. '{{#if words}}{{/if}}');
  298. test_fragment(
  299. '{{#if words}}{{! \n mult-line\ncomment \n with spacing\n}}{{/if}}',
  300. '{{#if words}}{{! \n mult-line\ncomment \n with spacing\n}}{{/if}}');
  301. test_fragment(
  302. '{{#if words}}{{! \n mult-line\ncomment \n with spacing\n}}{{/if}}',
  303. '{{#if words}}{{! \n mult-line\ncomment \n with spacing\n}}{{/if}}');
  304. test_fragment('{{#if 1}}\n <div>\n </div>\n{{/if}}');
  305. test_fragment(
  306. '{{#if 1}}\n<div>\n</div>\n{{/if}}',
  307. '{{#if 1}}\n <div>\n </div>\n{{/if}}');
  308. test_fragment('<div>\n {{#if 1}}\n {{/if}}\n</div>');
  309. test_fragment(
  310. '<div>\n{{#if 1}}\n{{/if}}\n</div>',
  311. '<div>\n {{#if 1}}\n {{/if}}\n</div>');
  312. test_fragment(
  313. '{{#if}}\n{{#each}}\n{{#if}}\n{{! \n mult-line\ncomment \n with spacing\n}}\n{{/if}}\n{{#if}}\n{{! \n mult-line\ncomment \n with spacing\n}}\n{{/if}}\n{{/each}}\n{{/if}}',
  314. '{{#if}}\n {{#each}}\n {{#if}}\n {{! \n mult-line\ncomment \n with spacing\n}}\n {{/if}}\n {{#if}}\n {{! \n mult-line\ncomment \n with spacing\n}}\n {{/if}}\n {{/each}}\n{{/if}}');
  315. test_fragment('{{#if 1}}\n <div>\n </div>\n{{/if}}');
  316. test_fragment(
  317. '{{#if 1}}\n {{! \n mult-line\ncomment \n with spacing\n}}\n {{else}}\n {{! \n mult-line\ncomment \n with spacing\n}}\n{{/if}}',
  318. '{{#if 1}}\n {{! \n mult-line\ncomment \n with spacing\n}}\n{{else}}\n {{! \n mult-line\ncomment \n with spacing\n}}\n{{/if}}');
  319. test_fragment(
  320. '{{#if 1}}\n {{else}}\n {{/if}}',
  321. '{{#if 1}}\n{{else}}\n{{/if}}');
  322. test_fragment(
  323. '{{#if thing}}\n{{#if otherthing}}\n {{! \n mult-line\ncomment \n with spacing\n}}\n {{else}}\n{{! \n mult-line\ncomment \n with spacing\n}}\n {{/if}}\n {{else}}\n{{! \n mult-line\ncomment \n with spacing\n}}\n{{/if}}',
  324. '{{#if thing}}\n {{#if otherthing}}\n {{! \n mult-line\ncomment \n with spacing\n}}\n {{else}}\n {{! \n mult-line\ncomment \n with spacing\n}}\n {{/if}}\n{{else}}\n {{! \n mult-line\ncomment \n with spacing\n}}\n{{/if}}');
  325. test_fragment(
  326. '<div{{somestyle}}></div>',
  327. '<div {{somestyle}}></div>');
  328. test_fragment(
  329. '<div{{#if test}}class="foo"{{/if}}>{{! \n mult-line\ncomment \n with spacing\n}}</div>',
  330. '<div {{#if test}} class="foo" {{/if}}>{{! \n mult-line\ncomment \n with spacing\n}}</div>');
  331. test_fragment(
  332. '<div{{#if thing}}{{somestyle}}class="{{class}}"{{else}}class="{{class2}}"{{/if}}>{{! \n mult-line\ncomment \n with spacing\n}}</div>',
  333. '<div {{#if thing}} {{somestyle}} class="{{class}}" {{else}} class="{{class2}}" {{/if}}>{{! \n mult-line\ncomment \n with spacing\n}}</div>');
  334. test_fragment(
  335. '<span{{#if condition}}class="foo"{{/if}}>{{! \n mult-line\ncomment \n with spacing\n}}</span>',
  336. '<span {{#if condition}} class="foo" {{/if}}>{{! \n mult-line\ncomment \n with spacing\n}}</span>');
  337. test_fragment('<div unformatted="{{#if}}{{! \n mult-line\ncomment \n with spacing\n}}{{/if}}">{{! \n mult-line\ncomment \n with spacing\n}}</div>');
  338. test_fragment('<div unformatted="{{#if }} {{! \n mult-line\ncomment \n with spacing\n}}{{/if}}">{{! \n mult-line\ncomment \n with spacing\n}}</div>');
  339. test_fragment('<div class="{{#if thingIs "value"}}{{! \n mult-line\ncomment \n with spacing\n}}{{/if}}"></div>');
  340. test_fragment('<div class="{{#if thingIs \'value\'}}{{! \n mult-line\ncomment \n with spacing\n}}{{/if}}"></div>');
  341. test_fragment('<div class=\'{{#if thingIs "value"}}{{! \n mult-line\ncomment \n with spacing\n}}{{/if}}\'></div>');
  342. test_fragment('<div class=\'{{#if thingIs \'value\'}}{{! \n mult-line\ncomment \n with spacing\n}}{{/if}}\'></div>');
  343. // Unclosed html elements
  344. test_fragment('<source>\n<source>');
  345. test_fragment('<br>\n<br>');
  346. test_fragment('<input>\n<input>');
  347. test_fragment('<meta>\n<meta>');
  348. test_fragment('<link>\n<link>');
  349. // Unformatted tags
  350. test_fragment('<ol>\n <li>b<pre>c</pre></li>\n</ol>');
  351. test_fragment('<ol>\n <li>b<code>c</code></li>\n</ol>');
  352. // Php formatting
  353. test_fragment('<h1 class="content-page-header"><?=$view["name"]; ?></h1>');
  354. test_fragment(
  355. '<?php\n' +
  356. 'for($i = 1; $i <= 100; $i++;) {\n' +
  357. ' #count to 100!\n' +
  358. ' echo($i . "</br>");\n' +
  359. '}\n' +
  360. '?>');
  361. // underscore.js formatting
  362. test_fragment(
  363. '<div class="col-sm-9">\n' +
  364. ' <textarea id="notes" class="form-control" rows="3">\n' +
  365. ' <%= notes %>\n' +
  366. ' </textarea>\n' +
  367. '</div>');
  368. // Indent with tabs
  369. opts.indent_with_tabs = true;
  370. test_fragment(
  371. '<div>\n<div>\n</div>\n</div>',
  372. '<div>\n\t<div>\n\t</div>\n</div>');
  373. // Indent without tabs
  374. opts.indent_with_tabs = false;
  375. test_fragment(
  376. '<div>\n<div>\n</div>\n</div>',
  377. '<div>\n <div>\n </div>\n</div>');
  378. // New Test Suite
  379. opts.end_with_newline = true;
  380. test_fragment('', '\n');
  381. test_fragment('<div></div>\n');
  382. test_fragment('<div></div>\n\n\n', '<div></div>\n');
  383. test_fragment('<head>\n' +
  384. ' <script>\n' +
  385. ' mocha.setup("bdd");\n' +
  386. '\n' +
  387. ' </script>\n' +
  388. '</head>\n');
  389. opts.end_with_newline = false;
  390. // error cases need love too
  391. bth('<img title="Bad food!" src="foo.jpg" alt="Evil" ">');
  392. bth("<!-- don't blow up if a comment is not complete"); // -->
  393. test_fragment(
  394. '<head>\n' +
  395. ' <script>\n' +
  396. ' mocha.setup("bdd");\n' +
  397. ' </script>\n' +
  398. '</head>');
  399. test_fragment('<div></div>\n', '<div></div>');
  400. bth('<div></div>');
  401. bth('<div>content</div>');
  402. bth('<div><div></div></div>',
  403. '<div>\n' +
  404. ' <div></div>\n' +
  405. '</div>');
  406. bth('<div><div>content</div></div>',
  407. '<div>\n' +
  408. ' <div>content</div>\n' +
  409. '</div>');
  410. bth('<div>\n' +
  411. ' <span>content</span>\n' +
  412. '</div>');
  413. bth('<div>\n' +
  414. '</div>');
  415. bth('<div>\n' +
  416. ' content\n' +
  417. '</div>');
  418. bth('<div>\n' +
  419. ' </div>',
  420. '<div>\n' +
  421. '</div>');
  422. bth(' <div>\n' +
  423. ' </div>',
  424. '<div>\n' +
  425. '</div>');
  426. bth('<div>\n' +
  427. '</div>\n' +
  428. ' <div>\n' +
  429. ' </div>',
  430. '<div>\n' +
  431. '</div>\n' +
  432. '<div>\n' +
  433. '</div>');
  434. bth(' <div>\n' +
  435. '</div>',
  436. '<div>\n' +
  437. '</div>');
  438. bth('<div >content</div>',
  439. '<div>content</div>');
  440. bth('<div thinger="preserve space here" ></div >',
  441. '<div thinger="preserve space here"></div>');
  442. bth('content\n' +
  443. ' <div>\n' +
  444. ' </div>\n' +
  445. 'content',
  446. 'content\n' +
  447. '<div>\n' +
  448. '</div>\n' +
  449. 'content');
  450. bth('<li>\n' +
  451. ' <div>\n' +
  452. ' </div>\n' +
  453. '</li>');
  454. bth('<li>\n' +
  455. '<div>\n' +
  456. '</div>\n' +
  457. '</li>',
  458. '<li>\n' +
  459. ' <div>\n' +
  460. ' </div>\n' +
  461. '</li>');
  462. bth('<li>\n' +
  463. ' content\n' +
  464. '</li>\n' +
  465. '<li>\n' +
  466. ' content\n' +
  467. '</li>');
  468. bth('<img>content');
  469. bth('<img> content');
  470. bth('<img> content', '<img> content');
  471. bth('<img><img>content');
  472. bth('<img> <img>content');
  473. bth('<img> <img>content', '<img> <img>content');
  474. bth('<img><b>content</b>');
  475. bth('<img> <b>content</b>');
  476. bth('<img> <b>content</b>', '<img> <b>content</b>');
  477. bth('<div>content<img>content</div>');
  478. bth('<div> content <img> content</div>');
  479. bth('<div> content <img> content </div>',
  480. '<div> content <img> content </div>');
  481. bth('Text <a href="#">Link</a> Text');
  482. // START tests for issue 453
  483. bth('<script type="text/unknown"><div></div></script>',
  484. '<script type="text/unknown">\n' +
  485. ' <div></div>\n' +
  486. '</script>');
  487. bth('<script type="text/javascript"><div></div></script>',
  488. '<script type="text/javascript">\n' +
  489. ' < div > < /div>\n' +
  490. '</script>');
  491. bth('<script><div></div></script>',
  492. '<script>\n' +
  493. ' < div > < /div>\n' +
  494. '</script>');
  495. bth('<script type="text/javascript">var foo = "bar";</script>',
  496. '<script type="text/javascript">\n' +
  497. ' var foo = "bar";\n' +
  498. '</script>');
  499. bth('<script type="application/javascript">var foo = "bar";</script>',
  500. '<script type="application/javascript">\n' +
  501. ' var foo = "bar";\n' +
  502. '</script>');
  503. bth('<script type="application/javascript;version=1.8">var foo = "bar";</script>',
  504. '<script type="application/javascript;version=1.8">\n' +
  505. ' var foo = "bar";\n' +
  506. '</script>');
  507. bth('<script type="application/x-javascript">var foo = "bar";</script>',
  508. '<script type="application/x-javascript">\n' +
  509. ' var foo = "bar";\n' +
  510. '</script>');
  511. bth('<script type="application/ecmascript">var foo = "bar";</script>',
  512. '<script type="application/ecmascript">\n' +
  513. ' var foo = "bar";\n' +
  514. '</script>');
  515. bth('<script type="text/javascript1.5">var foo = "bar";</script>',
  516. '<script type="text/javascript1.5">\n' +
  517. ' var foo = "bar";\n' +
  518. '</script>');
  519. bth('<script>var foo = "bar";</script>',
  520. '<script>\n' +
  521. ' var foo = "bar";\n' +
  522. '</script>');
  523. bth('<style type="text/unknown"><tag></tag></style>',
  524. '<style type="text/unknown">\n' +
  525. ' <tag></tag>\n' +
  526. '</style>');
  527. bth('<style type="text/css"><tag></tag></style>',
  528. '<style type="text/css">\n' +
  529. ' <tag></tag>\n' +
  530. '</style>');
  531. bth('<style><tag></tag></style>',
  532. '<style>\n' +
  533. ' <tag></tag>\n' +
  534. '</style>');
  535. bth('<style type="text/css">.selector {font-size:12px;}</style>',
  536. '<style type="text/css">\n' +
  537. ' .selector {\n' +
  538. ' font-size: 12px;\n' +
  539. ' }\n'+
  540. '</style>');
  541. bth('<style>.selector {font-size:12px;}</style>',
  542. '<style>\n' +
  543. ' .selector {\n' +
  544. ' font-size: 12px;\n' +
  545. ' }\n'+
  546. '</style>');
  547. // END tests for issue 453
  548. var unformatted = opts.unformatted;
  549. opts.unformatted = ['script', 'style'];
  550. bth('<script id="javascriptTemplate" type="text/x-kendo-template">\n' +
  551. ' <ul>\n' +
  552. ' # for (var i = 0; i < data.length; i++) { #\n' +
  553. ' <li>#= data[i] #</li>\n' +
  554. ' # } #\n' +
  555. ' </ul>\n' +
  556. '</script>');
  557. bth('<style>\n' +
  558. ' body {background-color:lightgrey}\n' +
  559. ' h1 {color:blue}\n' +
  560. '</style>');
  561. opts.unformatted = unformatted;
  562. unformatted = opts.unformatted;
  563. opts.unformatted = ['custom-element'];
  564. test_fragment('<div>should <custom-element>not</custom-element>' +
  565. ' insert newlines</div>',
  566. '<div>should <custom-element>not</custom-element>' +
  567. ' insert newlines</div>');
  568. opts.unformatted = unformatted;
  569. // Tests that don't pass, but probably should.
  570. // bth('<div><span>content</span></div>');
  571. // Handlebars tests
  572. // Without the indent option on, handlebars are treated as content.
  573. opts.wrap_line_length = 0;
  574. //...---------1---------2---------3---------4---------5---------6---------7
  575. //...1234567890123456789012345678901234567890123456789012345678901234567890
  576. bth('<div>Some text that should not wrap at all.</div>',
  577. /* expected */
  578. '<div>Some text that should not wrap at all.</div>');
  579. // A value of 0 means no max line length, and should not wrap.
  580. //...---------1---------2---------3---------4---------5---------6---------7---------8---------9--------10--------11--------12--------13--------14--------15--------16--------17--------18--------19--------20--------21--------22--------23--------24--------25--------26--------27--------28--------29
  581. //...12345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890
  582. bth('<div>Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all.</div>',
  583. /* expected */
  584. '<div>Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all.</div>');
  585. opts.wrap_line_length = "0";
  586. //...---------1---------2---------3---------4---------5---------6---------7
  587. //...1234567890123456789012345678901234567890123456789012345678901234567890
  588. bth('<div>Some text that should not wrap at all.</div>',
  589. /* expected */
  590. '<div>Some text that should not wrap at all.</div>');
  591. // A value of "0" means no max line length, and should not wrap
  592. //...---------1---------2---------3---------4---------5---------6---------7---------8---------9--------10--------11--------12--------13--------14--------15--------16--------17--------18--------19--------20--------21--------22--------23--------24--------25--------26--------27--------28--------29
  593. //...12345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890
  594. bth('<div>Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all.</div>',
  595. /* expected */
  596. '<div>Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all. Some text that should not wrap at all.</div>');
  597. //BUGBUG: This should wrap before 40 not after.
  598. opts.wrap_line_length = 40;
  599. //...---------1---------2---------3---------4---------5---------6---------7
  600. //...1234567890123456789012345678901234567890123456789012345678901234567890
  601. bth('<div>Some test text that should wrap_inside_this section here.</div>',
  602. /* expected */
  603. '<div>Some test text that should wrap_inside_this\n' +
  604. ' section here.</div>');
  605. opts.wrap_line_length = "40";
  606. //...---------1---------2---------3---------4---------5---------6---------7
  607. //...1234567890123456789012345678901234567890123456789012345678901234567890
  608. bth('<div>Some test text that should wrap_inside_this section here.</div>',
  609. /* expected */
  610. '<div>Some test text that should wrap_inside_this\n' +
  611. ' section here.</div>');
  612. opts.indent_size = 1;
  613. opts.indent_char = '\t';
  614. opts.preserve_newlines = false;
  615. bth('<div>\n\tfoo\n</div>', '<div> foo </div>');
  616. opts.preserve_newlines = true;
  617. bth('<div>\n\tfoo\n</div>');
  618. // test preserve_newlines and max_preserve_newlines
  619. opts.preserve_newlines = false;
  620. bth('<div>Should not</div>\n\n\n' +
  621. '<div>preserve newlines</div>',
  622. '<div>Should not</div>\n' +
  623. '<div>preserve newlines</div>');
  624. opts.preserve_newlines = true;
  625. opts.max_preserve_newlines = 0;
  626. bth('<div>Should</div>\n\n\n' +
  627. '<div>preserve zero newlines</div>',
  628. '<div>Should</div>\n' +
  629. '<div>preserve zero newlines</div>');
  630. opts.max_preserve_newlines = 1;
  631. bth('<div>Should</div>\n\n\n' +
  632. '<div>preserve one newline</div>',
  633. '<div>Should</div>\n\n' +
  634. '<div>preserve one newline</div>');
  635. opts.max_preserve_newlines = null;
  636. bth('<div>Should</div>\n\n\n' +
  637. '<div>preserve one newline</div>',
  638. '<div>Should</div>\n\n\n' +
  639. '<div>preserve one newline</div>');
  640. }
  641. beautifier_tests();
  642. }
  643. if (typeof exports !== "undefined") {
  644. exports.run_html_tests = run_html_tests;
  645. }