From ba243b5bba94cde0d0e19d281fac8bdbf898b8e5 Mon Sep 17 00:00:00 2001
From: Bhsd <55071315+bhsd-harry@users.noreply.github.com>
Date: Fri, 17 Jan 2025 15:21:43 +0800
Subject: [PATCH] fix(test-page): hide `#done` button by default
---
extensions/compare.css | 3 +++
extensions/compare.ts | 14 +++++++-------
extensions/dist/compare.js | 12 +++++-------
extensions/dist/{parserTests.js => test-page.js} | 7 ++++---
extensions/test-page.css | 3 ++-
extensions/{parserTests.ts => test-page.ts} | 7 ++++---
tests.html | 4 ++--
7 files changed, 27 insertions(+), 23 deletions(-)
rename extensions/dist/{parserTests.js => test-page.js} (95%)
rename extensions/{parserTests.ts => test-page.ts} (96%)
diff --git a/extensions/compare.css b/extensions/compare.css
index f3f242a8..deeb9ffe 100644
--- a/extensions/compare.css
+++ b/extensions/compare.css
@@ -9,4 +9,7 @@ iframe {
margin: 0;
column-count: 3;
}
+ iframe {
+ display: block;
+ }
}
diff --git a/extensions/compare.ts b/extensions/compare.ts
index 2b642b5c..5ba9b1d3 100644
--- a/extensions/compare.ts
+++ b/extensions/compare.ts
@@ -2,7 +2,7 @@
const iframes = top!.document.getElementsByTagName('iframe'); // eslint-disable-line no-restricted-globals
iframes[0]!.addEventListener('load', () => {
const {contentWindow, contentDocument} = iframes[0]!;
- contentWindow!.addEventListener('hashchange', () => {
+ contentWindow!.addEventListener('casechange', () => {
for (let i = 1; i < iframes.length; i++) {
iframes[i]!.contentWindow!.location.hash = contentWindow!.location.hash;
}
@@ -15,13 +15,13 @@
}
});
});
- for (const iframe of iframes as unknown as Iterable<HTMLIFrameElement>) {
- iframe.addEventListener('load', () => {
- const {contentDocument} = iframe,
+ for (let i = 0; i < iframes.length; i++) {
+ iframes[i]!.addEventListener('load', () => {
+ const {contentDocument} = iframes[i]!,
style = contentDocument!.createElement('style');
- style.textContent = 'body{background:#fff}'
- + 'main{margin:0;box-shadow:none}'
- + '#compare>:last-child{display:none}';
+ style.textContent = `body{background:#fff}main{margin:0;box-shadow:none}${
+ i === 0 ? '' : '.field{min-height:0}select,'
+ }#compare>:last-child{display:none}`;
contentDocument!.head.append(style);
});
}
diff --git a/extensions/dist/compare.js b/extensions/dist/compare.js
index bd42397c..cd9024e7 100644
--- a/extensions/dist/compare.js
+++ b/extensions/dist/compare.js
@@ -4,7 +4,7 @@
const iframes = top.document.getElementsByTagName('iframe');
iframes[0].addEventListener('load', () => {
const { contentWindow, contentDocument } = iframes[0];
- contentWindow.addEventListener('hashchange', () => {
+ contentWindow.addEventListener('casechange', () => {
for (let i = 1; i < iframes.length; i++) {
iframes[i].contentWindow.location.hash = contentWindow.location.hash;
}
@@ -17,12 +17,10 @@
}
});
});
- for (const iframe of iframes) {
- iframe.addEventListener('load', () => {
- const { contentDocument } = iframe, style = contentDocument.createElement('style');
- style.textContent = 'body{background:#fff}'
- + 'main{margin:0;box-shadow:none}'
- + '#compare>:last-child{display:none}';
+ for (let i = 0; i < iframes.length; i++) {
+ iframes[i].addEventListener('load', () => {
+ const { contentDocument } = iframes[i], style = contentDocument.createElement('style');
+ style.textContent = `body{background:#fff}main{margin:0;box-shadow:none}${i === 0 ? '' : '.field{min-height:0}select,'}#compare>:last-child{display:none}`;
contentDocument.head.append(style);
});
}
diff --git a/extensions/dist/parserTests.js b/extensions/dist/test-page.js
similarity index 95%
rename from extensions/dist/parserTests.js
rename to extensions/dist/test-page.js
index d79b06f4..67e9841e 100644
--- a/extensions/dist/parserTests.js
+++ b/extensions/dist/test-page.js
@@ -9,8 +9,8 @@
};
wikiparse.highlight(pre, false, true);
btn.disabled = !select.value;
- if (isGH) {
- btn.style.display = 'none';
+ if (!isGH) {
+ btn.style.display = '';
}
let optgroup;
for (const [i, { desc, wikitext, html }] of tests.entries()) {
@@ -42,7 +42,8 @@
wikiparse.highlight(pre, false, true);
select.selectedOptions[0].disabled = true;
btn.disabled = false;
- location.hash = `#${encodeURIComponent(desc)}`;
+ history.replaceState(null, '', `#${encodeURIComponent(desc)}`);
+ dispatchEvent(new Event('casechange'));
});
btn.addEventListener('click', () => {
dones.add(tests[Number(select.value)].desc);
diff --git a/extensions/test-page.css b/extensions/test-page.css
index ed935d3c..eab08c0a 100644
--- a/extensions/test-page.css
+++ b/extensions/test-page.css
@@ -489,10 +489,11 @@ pre {
@media screen and (min-width: 1200px) {
#frame {
column-count: 2;
+ padding-top: 1rem;
}
.frame:not(:empty) {
- display: inline-block;
width: calc(100% - 27px);
+ margin-top: 0;
}
#frame[data-source] > .frame:not(:empty) {
width: calc(100% - 3px);
diff --git a/extensions/parserTests.ts b/extensions/test-page.ts
similarity index 96%
rename from extensions/parserTests.ts
rename to extensions/test-page.ts
index dad0bf8c..5be18aec 100644
--- a/extensions/parserTests.ts
+++ b/extensions/test-page.ts
@@ -25,8 +25,8 @@ declare interface Test {
};
wikiparse.highlight!(pre, false, true);
btn.disabled = !select.value;
- if (isGH) {
- btn.style.display = 'none';
+ if (!isGH) {
+ btn.style.display = '';
}
let optgroup: HTMLOptGroupElement;
for (const [i, {desc, wikitext, html}] of tests.entries()) {
@@ -57,7 +57,8 @@ declare interface Test {
wikiparse.highlight!(pre, false, true);
select.selectedOptions[0]!.disabled = true;
btn.disabled = false;
- location.hash = `#${encodeURIComponent(desc)}`;
+ history.replaceState(null, '', `#${encodeURIComponent(desc)}`);
+ dispatchEvent(new Event('casechange'));
});
btn.addEventListener('click', () => {
dones.add(tests[Number(select.value)]!.desc);
diff --git a/tests.html b/tests.html
index 11f545ae..bd52259d 100644
--- a/tests.html
+++ b/tests.html
@@ -10,7 +10,7 @@
<script defer="" src="extensions/dist/base.js"></script>
<script defer="" src="extensions/dist/highlight.js"></script>
<script defer="" src="bundle/bundle.min.js"></script>
- <script defer="" src="extensions/dist/parserTests.js"></script>
+ <script defer="" src="extensions/dist/test-page.js"></script>
<script src="https://testingcf.jsdelivr.net/combine/npm/prismjs/components/prism-core.min.js,npm/prismjs/components/prism-markup.min.js"></script>
</head>
<body>
@@ -27,7 +27,7 @@
<div id="frame2" class="frame"></div>
</div>
<div id="buttons">
- <button id="done">Done</button>
+ <button id="done" style="display: none">Done</button>
</div>
</article>
</main>