refactor: Use typescript for (almost) all main site javascript #489
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
You can use the non-null assertion operation |
| @@ -46,25 +43,28 @@ | |||
| array.forEach(rule => { | |||
| const item = document.createElement("option") | |||
|
|
|||
| item.innerHTML = rule[0] | |||
| item.value = rule[1] | |||
| item.innerHTML = rule[0].toString() | |||
Check warning
Code scanning / CodeQL
DOM text reinterpreted as HTML Medium
Show autofix suggestion
Hide autofix suggestion
Copilot Autofix AI 16 days ago
To fix the problem, we need to ensure that any text content extracted from the DOM and reinserted as HTML is properly escaped to prevent XSS attacks. The best way to do this is to use a method that sets the text content safely without interpreting it as HTML.
- Replace the use of
innerHTMLwithtextContentto ensure that the text is treated as plain text and not HTML. - This change should be made on line 46 in the
createRulesfunction.
Suggested changeset
1
app/javascript/src/difference-viewer.ts
| @@ -45,3 +45,3 @@ | ||
|
|
||
| item.innerHTML = rule[0].toString() | ||
| item.textContent = rule[0].toString() | ||
| item.value = rule[1].toString() |
Copilot is powered by AI and may make mistakes. Always verify output.
refactor: Use ts for linter and related files
refactor: Use Typescript for editor compiler
refactor: Use typescript for editor utils
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
I was going to implement Typescript specifically for the editor, but I decided to get it started for the main site javascript first. I did everything in one big go, which may have been a mistake. There were quite a few files and I didn't spend super long on any of them, as a result I probably took some shortcuts I shouldn't have, but at least we now have type safety.
I skipped the markdown editor scripts as they are pretty complex and I want to take care of them separately.
In the end I'm not entirely sure it's really worth it, these utils aren't very complex and a lot of the type safety here doesn't do much. I've had to put in a lot of early returns in case of missing elements, but in reality these elements will never be missing.
I don't expect anyone to review this, as it's a rather nasty PR. I will early merge it soon-ish or use it as a base PR when tackling the editor compiler. Svelte components will have to wait until the Svelte 5 upgrade.