1

With the BEM Notation change being enforced in Summer 21, what's the best way to search the code base for any references requiring updating?

I've tried to use class=".*--.*" and .*--.* while searching within VSCodebut these return no results, yet I know there are items such as:

padding-bottom: var(--lwc-spacingMedium,1rem);
.THIS .slds-box--xxx-small
class="slds-size--small"

I am misunderstanding what needs to be updated, or searching incorrectly?

The SLDS validator doesn't seem to work for me and I was hoping for something that could scan the code base...

1 Answer 1

1

I'd search-and-replace:

slds-([a-z0-9-]+?)--

With:

slds-$1_

Make sure you enable the RegExp search mode (the far-right icon in the search box).

But you'll still need to do a manual review to make sure you don't accidentally get anything you didn't mean to.

3
  • Because the "-" is at the end of the character group there's no need to escape it. Also, there's no call, that I can see, for the "?" either.
    – Phil W
    Jan 26, 2021 at 17:49
  • @PhilW you're right on the first count, but the ? Is actually in case you have multiple CSS styles in the same line of code. It's probably superfluous, but would save search time by being "not greedy".
    – sfdcfox
    Jan 26, 2021 at 18:05
  • In the case of multiple old-style BEM classes you would find whitespace between them so the match would not actually cross the divide... :D
    – Phil W
    Jan 26, 2021 at 18:29

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .