VariantManagement : Adding Variant name with quotes causes error.

[NandithaRamesh]

Describe the bug

1. Click on Variant dropdown and click on Save As button.
2. Enter name with double quotes (e.g:"1234") and click on Save.
3. Click on Variant dropdown again and click on Manage button.
4. Click on save and an error is shown which reads
   Error: Failed to execute 'querySelector' on 'Element': 'ui5-li[data-children=""1234""]' is not a valid selector.
   at Array.map ())
   at /ui5-webcomponents-react/v2/assets/VariantItem-DmKK-s3c.js:11:14396
   at Su (/ui5-webcomponents-react/v2/assets/react-18-CYWbi7Zg.js:24:44617))
   at On (/ui5-webcomponents-react/v2/assets/react-18-CYWbi7Zg.js:24:45470))
   at ke (/ui5-webcomponents-react/v2/assets/react-18-CYWbi7Zg.js:24:44657))
   at Object.useState (/ui5-webcomponents-react/v2/assets/react-18-CYWbi7Zg.js:24:56003))
   at J.o.useState (/ui5-webcomponents-react/v2/assets/index-C--kS4iy.js:9:7260))
   at /ui5-webcomponents-react/v2/assets/VariantItem-DmKK-s3c.js:11:13460
   at An (/ui5-webcomponents-react/v2/assets/react-18-CYWbi7Zg.js:24:42337))

Isolated Example

No response

Reproduction steps

1.Click on Variant dropdown and click on Save As button.
2. Enter name with double quotes (e.g:"1234") and click on Save.
3. Click on Variant dropdown again and click on Manage button.
4. Click on save and an error is shown which reads
Error: Failed to execute 'querySelector' on 'Element': 'ui5-li[data-children=""1234""]' is not a valid selector.
at Array.map ())
at /ui5-webcomponents-react/v2/assets/VariantItem-DmKK-s3c.js:11:14396
at Su (/ui5-webcomponents-react/v2/assets/react-18-CYWbi7Zg.js:24:44617))
at On (/ui5-webcomponents-react/v2/assets/react-18-CYWbi7Zg.js:24:45470))
at ke (/ui5-webcomponents-react/v2/assets/react-18-CYWbi7Zg.js:24:44657))
at Object.useState (/ui5-webcomponents-react/v2/assets/react-18-CYWbi7Zg.js:24:56003))
at J.o.useState (/ui5-webcomponents-react/v2/assets/index-C--kS4iy.js:9:7260))
at /ui5-webcomponents-react/v2/assets/VariantItem-DmKK-s3c.js:11:13460
at An (/ui5-webcomponents-react/v2/assets/react-18-CYWbi7Zg.js:24:42337))

Expected Behaviour

The variant title should have been accepted as a valid title.

Screenshots or Videos

VariantManagementIssue.mp4

UI5 Web Components for React Version

1.28.4

UI5 Web Components Version

1.24.3

Browser

Chrome

Operating System

No response

Additional Context

The issue is reproducible in both versions 1 and 2 of webcomponents and we require the fix in both versions as well since we still work on version 1.

Relevant log output

Organization

No response

Declaration

• I’m not disclosing any internal or sensitive information.