More tests

js/markdown.js

 	/** @var {String[]} */
 	cssClasses = [];
 	/** @var {String|null} */
-	id = null;
+	cssId = null;
 	/** @var {Object} */
 	attributes = {};
 
 		if (this.cssClasses.length > 0) {
 			html += ` class="${this.cssClasses.join(' ')}"`;
 		}
-		if (this.id !== null) {
-			html += ` id="${this.id}"`;
+		if (this.cssId !== null) {
+			html += ` id="${this.cssId}"`;
 		}
 		for (const name in this.attributes) {
 			let value = this.attributes[name];
 }
 
 class _MDReferencedLinkSpan extends _MDLinkSpan {
-	/** @var {String} id */
-	id;
+	/** @var {String} */
+	ref;
 
-	constructor(id, content) {
+	constructor(ref, content) {
 		super(null, content);
-		this.id = id;
+		this.ref = ref;
 	}
 
 	/**
 	 */
 	toHTML(state) {
 		if (!this.link) {
-			let url = state.urls[this.id.toLowerCase()];
-			let title = state.urlTitles[this.id.toLowerCase()];
+			let url = state.urls[this.ref.toLowerCase()];
+			let title = state.urlTitles[this.ref.toLowerCase()];
 			this.link = url;
 			this.title = title || this.title;
 		}
 			return super.toHTML(state);
 		} else {
 			let contentHTML = this.content.toHTML(state);
-			return `[${contentHTML}][${this.id}]`;
+			return `[${contentHTML}][${this.ref}]`;
 		}
 	}
 }
 
 class _MDReferencedImageSpan extends _MDImageSpan {
 	/** @var {String} */
-	id;
+	ref;
 
 	/**
-	 * @param {String} id
+	 * @param {String} ref
+	 * @param {String|null} alt
 	 */
-	constructor(id, alt) {
+	constructor(ref, alt) {
 		super(null, alt);
-		this.id = id;
+		this.ref = ref;
 	}
 
 	toHTML(state) {
 		if (!this.source) {
-			let url = state.urls[this.id.toLowerCase()];
-			let title = state.urlTitles[this.id.toLowerCase()];
+			let url = state.urls[this.ref.toLowerCase()];
+			let title = state.urlTitles[this.ref.toLowerCase()];
 			this.source = url;
 			this.title = title || this.title;
 		}
 		if (this.source) {
 			return super.toHTML(state);
 		} else {
-			return `![${_MDUtils.escapeHTML(this.alt)}][${_MDUtils.escapeHTML(this.id)}]`;
+			return `![${_MDUtils.escapeHTML(this.alt)}][${_MDUtils.escapeHTML(this.ref)}]`;
 		}
 	}
 }
 	/** @var {String[]} */
 	cssClasses = [];
 	/** @var {String|null} */
-	id = null;
+	cssId = null;
 	/** @var {Object} */
 	attributes = {};
 
 		if (this.cssClasses.length > 0) {
 			html += ` class="${this.cssClasses.join(' ')}"`;
 		}
-		if (this.id !== null) {
-			html += ` id="${this.id}"`;
+		if (this.cssId !== null) {
+			html += ` id="${this.cssId}"`;
 		}
 		for (const name in this.attributes) {
 			let value = this.attributes[name];
 	/** @var {String[]} */
 	cssClasses = [];
 	/** @var {String|null} */
-	id = null;
+	cssId = null;
 	/** @var {Object} */
 	attributes = {};
 
 	applyTo(elem) {
 		if (elem instanceof _MDBlock || elem instanceof _MDSpan) {
 			elem.cssClasses = elem.cssClasses.concat(this.cssClasses);
-			if (this.id) elem.id = this.id;
+			if (this.cssId) elem.cssId = this.cssId;
 			for (const name in this.attributes) {
 				elem.attributes[name] = this.attributes[name];
 			}
 			if (groups = this.#classRegex.exec(token)) {
 				mod.cssClasses.push(groups[1]);
 			} else if (groups = this.#idRegex.exec(token)) {
-				mod.id = groups[1];
+				mod.cssId = groups[1];
 			} else if (groups = this.#attributeRegex.exec(token)) {
 				mod.attributes[groups[1]] = groups[2];
 			} else {

testjs.html

 			:root {
 				font-family: sans-serif;
 			}
-			.testcase {
+			.testclass {
 				border: 1px solid black;
 				padding: 0.5em 1em;
 				margin-bottom: 1em;
-				max-width: 70em;
+				max-width: 50em;
+			}
+			.testclassname {
+				font-weight: bold;
+				font-size: 1.25rem;
+				padding-bottom: 0.25em;
+			}
+			.testcase {
+				padding: 0.2em 0;
+				margin-left: 2em;
+			}
+			.testcase {
+				border-top: 1px solid #888;
 			}
 			.testcasename {
 				font-size: 115%;
 				}
 				toHTML() {
 					var html = `<div class="testcase" id="${this.#cssId}">`;
-					html += `<div class="testcasename"><span class="testcaseclass">${this.className}</span>.<span class="testcasemethod">${this.methodName}</span></div>`;
+					html += `<div class="testcasename"><span class="testcasemethod">${this.methodName}</span></div>`;
 					switch (this.result) {
 						case ResultType.untested:
 							html += '<div class="testcasestatus result-untested">Waiting to test</div>';
 					this.assertEqual(actual, expected);
 				}
 
+				test_link_ref() {
+					let markdown = "Lorem [ipsum][ref] dolor\n\n[ref]: https://example.com";
+					let expected = '<p>Lorem <a href="https://example.com">ipsum</a> dolor</p>';
+					let actual = normalizeWhitespace(Markdown.toHTML(markdown));
+					this.assertEqual(actual, expected);
+				}
+
 				test_link_email() {
 					let markdown = 'Lorem [ipsum](user@example.com) dolor';
 					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>';
 					let actual = normalizeWhitespace(Markdown.toHTML(markdown));
 					this.assertEqual(actual, expected);
 				}
+
+				test_orderedList() {
+					let markdown = "1. Lorem\n1. Ipsum\n5. Dolor";
+					let expected = '<ol start="1"> <li>Lorem</li> <li>Ipsum</li> <li>Dolor</li> </ol>';
+					let actual = normalizeWhitespace(Markdown.toHTML(markdown));
+					this.assertEqual(actual, expected);
+				}
+
+				test_orderedList_numbering() {
+					let markdown = "4. Lorem\n1. Ipsum\n9. Dolor";
+					let expected = '<ol start="4"> <li>Lorem</li> <li>Ipsum</li> <li>Dolor</li> </ol>';
+					let actual = normalizeWhitespace(Markdown.toHTML(markdown));
+					this.assertEqual(actual, expected);
+				}
+
+				test_blockquote() {
+					let markdown = '> Lorem ipsum dolor';
+					let expected = '<blockquote> <p>Lorem ipsum dolor</p> </blockquote>';
+					let actual = normalizeWhitespace(Markdown.toHTML(markdown));
+					this.assertEqual(actual, expected);
+				}
 			}
 
 			document.addEventListener('DOMContentLoaded', onLoad);