PHP and Javascript implementations of a simple markdown parser
Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.

testjs.html 17KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Markdown Unit Tests</title>
  6. <link rel="icon" href="data:;base64,iVBORw0KGgo=">
  7. <style type="text/css">
  8. :root {
  9. font-family: sans-serif;
  10. }
  11. .testclass {
  12. border: 1px solid black;
  13. padding: 0.5em 1em;
  14. margin-bottom: 1em;
  15. max-width: 50em;
  16. }
  17. .testclassname {
  18. font-weight: bold;
  19. font-size: 1.25rem;
  20. padding-bottom: 0.25em;
  21. }
  22. .testcase {
  23. padding: 0.2em 0;
  24. margin-left: 2em;
  25. }
  26. .testcase {
  27. border-top: 1px solid #888;
  28. }
  29. .testcasename {
  30. font-size: 115%;
  31. font-weight: bold;
  32. }
  33. .testcasestatus {
  34. font-weight: bold;
  35. }
  36. .result-untested {
  37. color: #888;
  38. }
  39. .result-testing {
  40. color: black;
  41. }
  42. .result-passed {
  43. color: #090;
  44. }
  45. .result-failed {
  46. color: #a00;
  47. }
  48. .result-errored {
  49. color: #a80;
  50. }
  51. </style>
  52. <script src="js/markdown.js"></script>
  53. <script>
  54. function onLoad() {
  55. let testClasses = [
  56. InlineTests,
  57. BlockTests,
  58. ];
  59. TestClassRunner.runAll(testClasses);
  60. }
  61. /**
  62. * @param {String} text
  63. * @returns {String}
  64. */
  65. function escapeHTML(text) {
  66. return text.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
  67. }
  68. class ResultType {
  69. static untested = new ResultType('untested');
  70. static testing = new ResultType('testing');
  71. static passed = new ResultType('passed');
  72. static failed = new ResultType('failed');
  73. static errored = new ResultType('errored');
  74. #name;
  75. constructor(name) {
  76. this.#name = name;
  77. }
  78. toString() {
  79. return `${this.constructor.name}.${this.#name}`;
  80. }
  81. }
  82. class FailureError extends Error {
  83. constructor(message=null) {
  84. super(message);
  85. }
  86. }
  87. class BaseTest {
  88. setUp() {}
  89. tearDown() {}
  90. /** @var {TestCaseRunner|null} */
  91. currentRunner = null;
  92. fail(failMessage=null) {
  93. throw new FailureError(failMessage || 'failed');
  94. }
  95. assertTrue(test, failMessage=null) {
  96. if (!test) this.fail(failMessage || `expected true, got ${test}`);
  97. }
  98. assertFalse(test, failMessage=null) {
  99. if (test) this.fail(failMessage || `expected false, got ${test}`);
  100. }
  101. assertEqual(a, b, failMessage=null) {
  102. if (a != b) this.fail(failMessage || `equality failed: ${a} != ${b}`);
  103. }
  104. expectError(e=true) {
  105. if (this.currentRunner) this.currentRunner.expectedError = e;
  106. }
  107. /**
  108. * @param {number} maxTime maximum time in seconds
  109. * @param {function} timedCode code to run and time
  110. */
  111. profile(maxTime, timedCode) {
  112. const startTime = performance.now();
  113. const result = timedCode();
  114. const endTime = performance.now();
  115. const seconds = (endTime - startTime) / 1000.0;
  116. if (seconds > maxTime) {
  117. this.fail(`Expected <= ${maxTime}s execution time, actual ${seconds}s.`);
  118. }
  119. return result;
  120. }
  121. }
  122. /**
  123. * Manages the running and results of a single test method on a test
  124. * class.
  125. */
  126. class TestCaseRunner {
  127. /** @var {number} */
  128. static #nextUniqueId = 1;
  129. /** @var {number} */
  130. uniqueId = 0;
  131. /** @var {BaseTest} */
  132. #objectUnderTest;
  133. /** @var {method} */
  134. #method;
  135. /** @var {ResultType} */
  136. result = ResultType.untested;
  137. /** @var {String|null} */
  138. message = null;
  139. expectedError = null;
  140. /** @var {String} */
  141. get className() { return this.#objectUnderTest.constructor.name; }
  142. /** @var {String} */
  143. get methodName() { return this.#method.name; }
  144. /**
  145. * @param {BaseTest} objectUnderTest
  146. * @param {method} method
  147. */
  148. constructor(objectUnderTest, method) {
  149. this.#objectUnderTest = objectUnderTest;
  150. this.#method = method;
  151. this.uniqueId = TestCaseRunner.#nextUniqueId++;
  152. }
  153. run() {
  154. try {
  155. this.expectedError = null;
  156. this.#objectUnderTest.currentRunner = this;
  157. this.#objectUnderTest.setUp();
  158. this.#method.bind(this.#objectUnderTest)();
  159. this.result = ResultType.passed;
  160. this.message = null;
  161. } catch (e) {
  162. if (e instanceof FailureError) {
  163. this.result = ResultType.failed;
  164. this.message = e.message;
  165. } else if (this.#isExpectedError(e)) {
  166. this.result = ResultType.passed;
  167. this.message = null;
  168. } else {
  169. this.result = ResultType.errored;
  170. this.message = e.message;
  171. }
  172. } finally {
  173. this.expectedError = null;
  174. try {
  175. this.#objectUnderTest.tearDown();
  176. this.#objectUnderTest.currentRunner = null;
  177. } catch (e0) {
  178. console.error(`Failed to run ${this.className}.tearDown() - ${e0.message}`);
  179. this.result = ResultType.errored;
  180. this.message = e0.message;
  181. }
  182. }
  183. }
  184. get #cssId() { return `testcase${this.uniqueId}`; }
  185. #isExpectedError(e) {
  186. if (this.expectedError === null) return false;
  187. if (this.expectedError === true) return true;
  188. // TODO: Have a way to specify details about what kind of error is expected. Maybe a prototype instance and/or a testing lambda.
  189. return false;
  190. }
  191. toHTML() {
  192. var html = `<div class="testcase" id="${this.#cssId}">`;
  193. html += `<div class="testcasename"><span class="testcasemethod">${this.methodName}</span></div>`;
  194. switch (this.result) {
  195. case ResultType.untested:
  196. html += '<div class="testcasestatus result-untested">Waiting to test</div>';
  197. break;
  198. case ResultType.testing:
  199. html += '<div class="testcasestatus result-tesitng">Testing...</div>';
  200. break;
  201. case ResultType.passed:
  202. html += '<div class="testcasestatus result-passed">Passed</div>';
  203. break;
  204. case ResultType.failed:
  205. html += '<div class="testcasestatus result-failed">Failed</div>';
  206. html += `<div class="testcasemessage">${escapeHTML(this.message)}</div>`;
  207. break;
  208. case ResultType.errored:
  209. html += '<div class="testcasestatus result-errored">Errored</div>';
  210. html += `<div class="testcasemessage">${escapeHTML(this.message)}</div>`;
  211. break;
  212. }
  213. html += `</div>`;
  214. return html;
  215. }
  216. /**
  217. * Updates the HTML node in-place with the current status, or
  218. * adds it if it does not exist yet.
  219. */
  220. updateHTML() {
  221. let existing = document.getElementById(this.#cssId);
  222. if (existing) {
  223. existing.outerHTML = this.toHTML();
  224. } else {
  225. document.getElementById('results').innerHTML += this.toHTML();
  226. }
  227. }
  228. /**
  229. * @param {object} objectUnderTest
  230. * @returns {TestCaseRunner[]}
  231. */
  232. static findTestCases(objectUnderTest) {
  233. if (!(objectUnderTest instanceof BaseTest)) return [];
  234. var members = [];
  235. var obj = objectUnderTest;
  236. do {
  237. members.push(...Object.getOwnPropertyNames(obj));
  238. } while (obj = Object.getPrototypeOf(obj));
  239. return members.sort().filter((e, i, arr) => {
  240. if (e != arr[i + 1] && typeof objectUnderTest[e] == 'function' && e.startsWith('test')) return true;
  241. }).map((name) => {
  242. return new TestCaseRunner(objectUnderTest, objectUnderTest[name]);
  243. });
  244. }
  245. }
  246. class TestClassRunner {
  247. static #nextUniqueId = 1;
  248. #uniqueId = 0;
  249. #theClass;
  250. #instance;
  251. #testCases;
  252. get testCases() { return this.#testCases; }
  253. constructor(theClass) {
  254. this.#theClass = theClass;
  255. this.#instance = new theClass();
  256. this.#testCases = TestCaseRunner.findTestCases(this.#instance);
  257. this.#uniqueId = TestClassRunner.#nextUniqueId++;
  258. }
  259. get #cssId() { return `testclass${this.#uniqueId}`; }
  260. toHTML() {
  261. var html = '';
  262. html += `<div class="testclass" id="${this.#cssId}">`;
  263. html += `<div class="testclassname">${this.#theClass.name}</div>`;
  264. for (const testCase of this.#testCases) {
  265. html += testCase.toHTML();
  266. }
  267. html += '</div>';
  268. return html;
  269. }
  270. updateHTML() {
  271. var existing = document.getElementById(this.#cssId);
  272. if (!existing) {
  273. document.getElementById('results').innerHTML += this.toHTML();
  274. }
  275. }
  276. static runAll(testClasses) {
  277. var tests = []; // tuples of TestClassRunner and TestCaseRunner
  278. for (const testClass of testClasses) {
  279. const classRunner = new TestClassRunner(testClass);
  280. classRunner.updateHTML();
  281. tests.push(...classRunner.testCases.map(function(test) { return [ classRunner, test ] }));
  282. }
  283. var testInterval = setInterval(function() {
  284. if (tests.length == 0) {
  285. clearInterval(testInterval);
  286. testInterval = null;
  287. return;
  288. }
  289. var classRunner;
  290. var testCase;
  291. [ classRunner, testCase ] = tests[0];
  292. if (testCase.result == ResultType.untested) {
  293. testCase.result = ResultType.testing;
  294. testCase.updateHTML();
  295. classRunner.updateHTML();
  296. } else if (testCase.result == ResultType.testing) {
  297. tests.splice(0, 1);
  298. testCase.run();
  299. testCase.updateHTML();
  300. classRunner.updateHTML();
  301. }
  302. }, 1);
  303. }
  304. }
  305. // ---------------------------------------------------------------
  306. function normalizeWhitespace(str) {
  307. return str.replace(/\s+/g, ' ').replace(/(?:^\s+|\s+$)/g, '');
  308. }
  309. class InlineTests extends BaseTest {
  310. test_simpleSingleParagraph() {
  311. let markdown = 'Lorem ipsum';
  312. let expected = '<p>Lorem ipsum</p>';
  313. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  314. this.assertEqual(actual, expected);
  315. }
  316. test_strong() {
  317. let markdown = 'Lorem **ipsum** dolor **sit**';
  318. let expected = '<p>Lorem <strong>ipsum</strong> dolor <strong>sit</strong></p>';
  319. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  320. this.assertEqual(actual, expected);
  321. }
  322. test_emphasis() {
  323. let markdown = 'Lorem _ipsum_ dolor _sit_';
  324. let expected = '<p>Lorem <em>ipsum</em> dolor <em>sit</em></p>';
  325. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  326. this.assertEqual(actual, expected);
  327. }
  328. test_strongEmphasis_easy() {
  329. let markdown = 'Lorem **ipsum *dolor* sit** amet';
  330. let expected = '<p>Lorem <strong>ipsum <em>dolor</em> sit</strong> amet</p>';
  331. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  332. this.assertEqual(actual, expected);
  333. }
  334. test_strongEmphasis_medium() {
  335. let markdown = 'Lorem ***ipsum*** dolor';
  336. let expected1 = '<p>Lorem <strong><em>ipsum</em></strong> dolor</p>';
  337. let expected2 = '<p>Lorem <em><strong>ipsum</strong></em> dolor</p>';
  338. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  339. this.assertTrue(actual == expected1 || actual == expected2);
  340. }
  341. test_strongEmphasis_hard1() {
  342. let markdown = 'Lorem ***ipsum* dolor** sit';
  343. let expected = '<p>Lorem <strong><em>ipsum</em> dolor</strong> sit</p>';
  344. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  345. this.assertEqual(actual, expected);
  346. }
  347. test_strongEmphasis_hard2() {
  348. let markdown = 'Lorem ***ipsum** dolor* sit';
  349. let expected = '<p>Lorem <em><strong>ipsum</strong> dolor</em> sit</p>';
  350. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  351. this.assertEqual(actual, expected);
  352. }
  353. test_inlineCode() {
  354. let markdown = 'Lorem `ipsum` dolor';
  355. let expected = '<p>Lorem <code>ipsum</code> dolor</p>';
  356. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  357. this.assertEqual(actual, expected);
  358. }
  359. test_inlineCode_withInnerBacktick() {
  360. let markdown = 'Lorem ``ip`su`m`` dolor';
  361. let expected = '<p>Lorem <code>ip`su`m</code> dolor</p>';
  362. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  363. this.assertEqual(actual, expected);
  364. }
  365. test_strikethrough_single() {
  366. let markdown = 'Lorem ~ipsum~ dolor';
  367. let expected = '<p>Lorem <strike>ipsum</strike> dolor</p>';
  368. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  369. this.assertEqual(actual, expected);
  370. }
  371. test_strikethrough_double() {
  372. let markdown = 'Lorem ~~ipsum~~ dolor';
  373. let expected = '<p>Lorem <strike>ipsum</strike> dolor</p>';
  374. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  375. this.assertEqual(actual, expected);
  376. }
  377. test_link_fullyQualified() {
  378. let markdown = 'Lorem [ipsum](https://example.com/path/page.html) dolor';
  379. let expected = '<p>Lorem <a href="https://example.com/path/page.html">ipsum</a> dolor</p>';
  380. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  381. this.assertEqual(actual, expected);
  382. }
  383. test_link_relative() {
  384. let markdown = 'Lorem [ipsum](page.html) dolor';
  385. let expected = '<p>Lorem <a href="page.html">ipsum</a> dolor</p>';
  386. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  387. this.assertEqual(actual, expected);
  388. }
  389. test_link_title() {
  390. let markdown = 'Lorem [ipsum](page.html "link title") dolor';
  391. let expected = '<p>Lorem <a href="page.html" title="link title">ipsum</a> dolor</p>';
  392. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  393. this.assertEqual(actual, expected);
  394. }
  395. test_link_literal() {
  396. let markdown = 'Lorem <https://example.com> dolor';
  397. let expected = '<p>Lorem <a href="https://example.com">https://example.com</a> dolor</p>';
  398. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  399. this.assertEqual(actual, expected);
  400. }
  401. test_link_ref() {
  402. let markdown = "Lorem [ipsum][ref] dolor\n\n[ref]: https://example.com";
  403. let expected = '<p>Lorem <a href="https://example.com">ipsum</a> dolor</p>';
  404. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  405. this.assertEqual(actual, expected);
  406. }
  407. test_link_email() {
  408. let markdown = 'Lorem [ipsum](user@example.com) dolor';
  409. let expected = '<p>Lorem <a href="mailto:&#117;&#115;&#101;&#114;&#64;&#101;&#120;&#97;&#109;&#112;&#108;&#101;&#46;&#99;&#111;&#109;">ipsum</a> dolor</p>';
  410. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  411. this.assertEqual(actual, expected);
  412. }
  413. test_link_email_withTitle() {
  414. let markdown = 'Lorem [ipsum](user@example.com "title") dolor';
  415. let expected = '<p>Lorem <a href="mailto:&#117;&#115;&#101;&#114;&#64;&#101;&#120;&#97;&#109;&#112;&#108;&#101;&#46;&#99;&#111;&#109;" title="title">ipsum</a> dolor</p>';
  416. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  417. this.assertEqual(actual, expected);
  418. }
  419. test_link_literalEmail() {
  420. let markdown = 'Lorem <user@example.com> dolor';
  421. let expected = '<p>Lorem <a href="mailto:&#117;&#115;&#101;&#114;&#64;&#101;&#120;&#97;&#109;&#112;&#108;&#101;&#46;&#99;&#111;&#109;">&#117;&#115;&#101;&#114;&#64;&#101;&#120;&#97;&#109;&#112;&#108;&#101;&#46;&#99;&#111;&#109;</a> dolor</p>';
  422. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  423. this.assertEqual(actual, expected);
  424. }
  425. test_image() {
  426. let markdown = 'Lorem ![alt text](image.jpg) dolor';
  427. let expected = '<p>Lorem <img src="image.jpg" alt="alt text"> dolor</p>';
  428. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  429. this.assertEqual(actual, expected);
  430. }
  431. test_image_noAlt() {
  432. let markdown = 'Lorem ![](image.jpg) dolor';
  433. let expected = '<p>Lorem <img src="image.jpg"> dolor</p>';
  434. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  435. this.assertEqual(actual, expected);
  436. }
  437. test_image_withTitle() {
  438. let markdown = 'Lorem ![alt text](image.jpg "image title") dolor';
  439. let expected = '<p>Lorem <img src="image.jpg" alt="alt text" title="image title"> dolor</p>';
  440. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  441. this.assertEqual(actual, expected);
  442. }
  443. }
  444. class BlockTests extends BaseTest {
  445. test_paragraphs() {
  446. let markdown = "Lorem ipsum\n\nDolor sit amet";
  447. let expected = "<p>Lorem ipsum</p> <p>Dolor sit amet</p>";
  448. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  449. this.assertEqual(actual, expected);
  450. }
  451. test_paragraph_lineGrouping() {
  452. let markdown = "Lorem ipsum\ndolor sit amet";
  453. let expected = "<p>Lorem ipsum dolor sit amet</p>";
  454. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  455. this.assertEqual(actual, expected);
  456. }
  457. test_unorderedList() {
  458. let markdown = "* Lorem\n* Ipsum\n* Dolor";
  459. let expected = '<ul> <li>Lorem</li> <li>Ipsum</li> <li>Dolor</li> </ul>';
  460. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  461. this.assertEqual(actual, expected);
  462. }
  463. test_orderedList() {
  464. let markdown = "1. Lorem\n1. Ipsum\n5. Dolor";
  465. let expected = '<ol start="1"> <li>Lorem</li> <li>Ipsum</li> <li>Dolor</li> </ol>';
  466. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  467. this.assertEqual(actual, expected);
  468. }
  469. test_orderedList_numbering() {
  470. let markdown = "4. Lorem\n1. Ipsum\n9. Dolor";
  471. let expected = '<ol start="4"> <li>Lorem</li> <li>Ipsum</li> <li>Dolor</li> </ol>';
  472. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  473. this.assertEqual(actual, expected);
  474. }
  475. test_blockquote() {
  476. let markdown = '> Lorem ipsum dolor';
  477. let expected = '<blockquote> <p>Lorem ipsum dolor</p> </blockquote>';
  478. let actual = normalizeWhitespace(Markdown.toHTML(markdown));
  479. this.assertEqual(actual, expected);
  480. }
  481. }
  482. document.addEventListener('DOMContentLoaded', onLoad);
  483. </script>
  484. </head>
  485. <body>
  486. <div id="results"></div>
  487. </body>
  488. </html>