1
Fork 0

Feature: Change up the report a bug stuff.

This commit is contained in:
Bauke 2020-03-04 13:24:22 +01:00
parent 947ddfb224
commit ac847daf8b
Signed by: Bauke
GPG Key ID: C1C0F29952BCF558
4 changed files with 61 additions and 18 deletions

View File

@ -213,9 +213,10 @@
through the link at the bottom of this page or by through the link at the bottom of this page or by
<a href="https://tildes.net/user/Bauke/new_message">private <a href="https://tildes.net/user/Bauke/new_message">private
messaging Bauke</a> messaging Bauke</a>
on Tildes. If you're reporting a bug through a private message, on Tildes. If you're reporting a bug through, please use the links
please use the "Copy Bug Template" button below and fill out available in the footer. They will prefill a bug report
the template in your message. template with some system information and instructions that can help
tremendously with determining the problem.
</p> </p>
<form id="import-export"> <form id="import-export">
<input class="trx-hidden" accept="application/json" type="file" <input class="trx-hidden" accept="application/json" type="file"
@ -243,9 +244,12 @@
</div> </div>
</main> </main>
<footer id="footer"> <footer id="footer">
<a id="report-a-bug" target="_blank" rel="noopener"> <p>
Report A Bug Report a bug through
</a> <a class="report-a-bug-gitlab" target="_blank" rel="noopener">GitLab</a>
or
<a class="report-a-bug-tildes" target="_blank" rel="noopener">Tildes</a>.
</p>
</footer> </footer>
</div> </div>
<script src="../ts/options.ts"></script> <script src="../ts/options.ts"></script>

View File

@ -237,6 +237,10 @@ p > .red-re {
display: flex; display: flex;
justify-content: center; justify-content: center;
padding: 2rem 0; padding: 2rem 0;
p {
margin: 0;
}
} }
#copy-bug-template-button, #copy-bug-template-button,

View File

@ -14,7 +14,8 @@ import {
querySelector, querySelector,
setSettings, setSettings,
createElementFromString, createElementFromString,
flashMessage flashMessage,
querySelectorAll
} from './utilities'; } from './utilities';
window.addEventListener( window.addEventListener(
@ -30,14 +31,32 @@ window.addEventListener(
); );
versionSpan.textContent = `v${version}`; versionSpan.textContent = `v${version}`;
// Grab the "Report A Bug" anchor and add a prefilled GitLab issue URL to it. const gitlabReportTemplate: string = createReportTemplate('gitlab');
const reportAnchor: HTMLAnchorElement = querySelector('#report-a-bug'); const tildesReportTemplate: string = createReportTemplate('tildes');
reportAnchor.setAttribute( // Grab the "Report A Bug" anchors and add a prefilled template for them.
'href', const gitlabReportAnchors: HTMLAnchorElement[] = querySelectorAll(
encodeURI( '.report-a-bug-gitlab'
`https://gitlab.com/tildes-community/tildes-reextended/issues/new?issue[description]=${createReportTemplate()}`
)
); );
for (const element of gitlabReportAnchors) {
element.setAttribute(
'href',
encodeURI(
`https://gitlab.com/tildes-community/tildes-reextended/issues/new?issue[description]=${gitlabReportTemplate}`
)
);
}
const tildesReportAnchors: HTMLAnchorElement[] = querySelectorAll(
'.report-a-bug-tildes'
);
for (const element of tildesReportAnchors) {
element.setAttribute(
'href',
encodeURI(
`https://tildes.net/user/Bauke/new_message?subject=Tildes ReExtended Bug&message=${tildesReportTemplate}`
)
);
}
['comments', 'topics', 'own-comments', 'own-topics'].forEach( ['comments', 'topics', 'own-comments', 'own-topics'].forEach(
(val: string): void => { (val: string): void => {
@ -217,7 +236,7 @@ async function listItemClickHandler(event: MouseEvent): Promise<void> {
function copyBugTemplateHandler(event: MouseEvent): void { function copyBugTemplateHandler(event: MouseEvent): void {
event.preventDefault(); event.preventDefault();
const temporaryElement: HTMLTextAreaElement = createElementFromString( const temporaryElement: HTMLTextAreaElement = createElementFromString(
`<textarea>${createReportTemplate()}</textarea>` `<textarea>${createReportTemplate('tildes')}</textarea>`
); );
temporaryElement.classList.add('trx-offscreen'); temporaryElement.classList.add('trx-offscreen');
document.body.append(temporaryElement); document.body.append(temporaryElement);
@ -262,14 +281,21 @@ async function removeAllDataHandler(event: MouseEvent): Promise<void> {
}, 2500); }, 2500);
} }
function createReportTemplate(): string { function createReportTemplate(location: 'gitlab' | 'tildes'): string {
let introText =
"Thank you for taking the time to report a bug! Don't forget to fill in an\n appropriate title above, and make sure the information below is correct.";
if (location === 'tildes') {
introText =
'Thank you for taking the time to report a bug! Please make sure the\n information below is correct.';
}
// Set the headers using HTML tags, these can't be with #-style Markdown // Set the headers using HTML tags, these can't be with #-style Markdown
// headers as they'll be interpreted as an ID instead of Markdown content // headers as they'll be interpreted as an ID instead of Markdown content
// and so GitLab won't add it to the description. // and so GitLab won't add it to the description.
let reportTemplate = `<h2>Bug Report</h2> let reportTemplate = `<h2>Bug Report</h2>
<!-- <!--
Thank you for taking the time to report a bug! Don't forget to fill in an ${introText}
appropriate title above, and make sure the information below is correct.
--> -->
<h3>Info</h3>\n <h3>Info</h3>\n
| Type | Value | | Type | Value |

View File

@ -147,6 +147,15 @@ export function querySelector<T extends Element>(selector: string): T {
return document.querySelector<T>(selector)!; return document.querySelector<T>(selector)!;
} }
export function querySelectorAll<T extends Element>(selector: string): T[] {
const elements: T[] = [];
for (const element of document.querySelectorAll<T>(selector)) {
elements.push(element);
}
return elements;
}
export function createElementFromString<T extends Element>(input: string): T { export function createElementFromString<T extends Element>(input: string): T {
const template: HTMLTemplateElement = document.createElement('template'); const template: HTMLTemplateElement = document.createElement('template');
template.innerHTML = input.trim(); template.innerHTML = input.trim();