Be Aware of the !-- script Bug

Lets say you have this string in a variable (case insensitive):

`etc etc etc<!-- etc etc<scRipT> etc`

This will break any html tag after it.

Or lets say you divided that into some variables:

const first = `etc etc etc <!--`;
const second = `anything`;
const third = `<script>`

This will also break the html page.

Therefore please carefully assign any string that contains

`<!--<script>` 

or similar into a variable, if it is inside <script> tag.

codepen example

Edit: The original title is changed

Feel free to ask any question related to this in the comments :)

Comments

[Jay Jeckel]

Something here seems to have messed up the article's feed card. The estimated read time and the save button are missing and instead there is a link to the article with weird text, the word "in" prefixed with a back tick, a quote character, and a space.

I don't know how you did it, but Bobby Tables would be proud.

EDIT: Ah, I see it now. Having the commented script tag in the title is the issue and the extra link's weird text is the title's text between the script tags. Someone should definitely file an issue about this.

[Labnan]

wow! I did not think it would create issue in this website.

For me it looks ok though.

Edit:
I found it!

[GrahamTheDev]

I can't replicate this, is it device specific or is it a particular part of the site (specific feed item)?

[Labnan]

I changed the title, since it was causing an issue
The issue could be seen at dev.to/latest

This event was an accident though. I was just telling people about about handling input strings that are shown in a page and the title bugged.

[GrahamTheDev]

Can't replicate it, how strange!

[Labnan]

I have internet shortage right now so I can not test locally.

I will try replicating it locally and let you know exact steps when the internet problem is fixed, if you want. :)

I have never worked with forem repo before. It will be fun!

[Kavindu Santhusa]

That's how browsers parse HTML. Otherwise writing HTML parsers would be a headache.

[Labnan]

mhm.. but it does break the page!

[Labnan]

xD

[Labnan]

true! people hardly assigns like that.. the problem arises when someone is taking input from an api :)

[Labnan]

yup! it's safe as long as the string is not showing in the html that client receives.

So, if someone needs to show the string received from an api they have to be careful