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 16KB

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