Escaping of ' is missing in the Developer tools, leading to wrong syntax highlighting

[RubenKelevra]

Checklist

• [X] I have updated to the latest available Home Assistant version.
• [X] I have cleared the cache of my browser.
• [X] I have tried a different browser to see if it is related to my browser.

Describe the issue you are experiencing

This minor bug affects the proper syntax highlighting of entries in Set State's "State attributes"-view.

If a friendly name contains a ' (this friendly name was created by the official HA android app) it isn't properly escaped and thus will mess up the syntax highlighting in this view.

Describe the behavior you expected

Escaping with "" at the beginning/end of the string to get proper syntax highlighting

Steps to reproduce the issue

1. open developer tools
2. select an entry with a friendly name containing an '
3. observe wrong syntax highlighting

What version of Home Assistant Core has the issue?

core-2022.2.2

What was the last working version of Home Assistant Core?

unknown

In which browser are you experiencing the issue with?

Chromium: 98.0.4758.87 / Firefox 95.0.2

Which operating system are you using to run this browser?

Windows 11

State of relevant entities

No response

Problem-relevant frontend configuration

No response

Javascript errors shown in your browser console/inspector

No response

Additional information

No response

[github-actions[bot]]

There hasn't been any activity on this issue recently. Due to the high number of incoming GitHub notifications, we have to clean some of the old issues, as many of them have already been resolved with the latest updates. Please make sure to update to the latest Home Assistant version and check if that solves the issue. Let us know if that works for you by adding a comment 👍 This issue has now been marked as stale and will be closed if no further activity occurs. Thank you for your contributions.

[bdr99]

This is still an issue in 2022.5.

[github-actions[bot]]

There hasn't been any activity on this issue recently. Due to the high number of incoming GitHub notifications, we have to clean some of the old issues, as many of them have already been resolved with the latest updates. Please make sure to update to the latest Home Assistant version and check if that solves the issue. Let us know if that works for you by adding a comment 👍 This issue has now been marked as stale and will be closed if no further activity occurs. Thank you for your contributions.

[bdr99]

Still an issue in 2022.8.

[github-actions[bot]]

There hasn't been any activity on this issue recently. Due to the high number of incoming GitHub notifications, we have to clean some of the old issues, as many of them have already been resolved with the latest updates. Please make sure to update to the latest Home Assistant version and check if that solves the issue. Let us know if that works for you by adding a comment 👍 This issue has now been marked as stale and will be closed if no further activity occurs. Thank you for your contributions.

[bdr99]

This should not have been closed, the problem still exists in 2022.11. Can this issue be reopened?

[github-actions[bot]]

There hasn't been any activity on this issue recently. Due to the high number of incoming GitHub notifications, we have to clean some of the old issues, as many of them have already been resolved with the latest updates. Please make sure to update to the latest Home Assistant version and check if that solves the issue. Let us know if that works for you by adding a comment 👍 This issue has now been marked as stale and will be closed if no further activity occurs. Thank you for your contributions.

[bdr99]

Still an issue in 2024.2.1.

[karwosts]

~I think this is something that would need to be fixed in codemirror, looks like if I just play with their examples this is their behavior.~

~If you're interested maybe you can open an issue in their repo and link it back here. https://codemirror.net/~

Hmm actually I can't tell for certain. It might be that we're not correctly setting up the yaml language, but I can't figure it out. If I setup a yaml language parser in their examples it doesn't seem to suffer this problem.

[bdr99]

Yeah, I also noticed that their examples doesn't have this problem. That's why I think it might be an HA bug.

For future reference, this is how I tested it:

1. Go to https://codemirror.net/try/
2. Enter this code on the left side:

import { basicSetup, EditorView } from "codemirror";
import { yaml } from "@codemirror/lang-yaml";

new EditorView({
  doc: "key: value'value'",
  extensions: [basicSetup, yaml()],
  parent: document.body
});

3. Click "Run"
4. Observe result (syntax highlighting works correctly):