error when trying to remove css class from classList in js LWC

Question

I'm trying to implement slds tabs and in order to switch between tabs, I need to change the css classes. However, when I try to add or remove classes from the classList, it gives below error in console:

Refused to run the JavaScript URL because it violates the following Content Security Policy directive: "script-src 'self' 'nonce-3744c145-c1b2-ab4c-c4f2-225fd8e53422' chrome-extension: 'unsafe-inline' 'unsafe-eval' *.canary.lwc.dev *.visualforce.com https://ssl.gstatic.com/accessibility/ https://static.lightning.force.com". Note that 'unsafe-inline' is ignored if either a hash or nonce value is present in the source list.

Below is the code snippet:

changeSelectedTab(event){
        //remove class for already selected tab
        this.template.querySelector('.slds-is-active').classList.remove('.slds-is-active');
    }

I also tried,

`this.template.querySelector('.slds-is-active').className= '';

` Both of these approaches aren't working. Can someone please help me resolve this.

User6670 · Accepted Answer · 2020-07-23 11:52:14Z

1

we dont need "." when we remove or add the class "slds-is-active"

it should be

 this.template.querySelector('.slds-is-active').classList.remove('slds-is-active');

here is an example https://developer.salesforce.com/docs/component-library/tools/playground/ycqTBcTN/1/edit

answered Jul 23, 2020 at 11:52

User6670

3,0871 gold badge10 silver badges20 bronze badges

Add a comment |

Stack Exchange Network

error when trying to remove css class from classList in js LWC

1 Answer 1

You must log in to answer this question.

Hot Network Questions

error when trying to remove css class from classList in js LWC

1 Answer 1

You must log in to answer this question.

Related

Hot Network Questions