GAUD-8850: Remove select.scss by EdwinACL831 · Pull Request #7155 · BrightspaceUI/core

EdwinACL831 · 2026-07-02T17:40:27Z

Jira

Adds feature flag to wrap the logic to always return the :focus-visible css pseudo-class

- Adds feature flag to wrap the logic to always return the :focus-visible css pseudo-class

github-actions · 2026-07-02T17:41:33Z

Thanks for the PR! 🎉

We've deployed an automatic preview for this PR - you can see your changes here:

URL	https://live.d2l.dev/prs/BrightspaceUI/core/pr-7155/

Note

The build needs to finish before your changes are deployed.
Changes to the PR will automatically update the instance.

…essage to getFocusPseudoClass

…ponent

…ones

EdwinACL831 · 2026-07-02T19:37:27Z

I added back the code in the vdiffs just to make sure they are still looking as expected. Here is the report. this will be reverted once we are happy (get some thumbs up) with the changes and their results

Looks good!

Actually, give me a bit longer to review this before reverting.

EdwinACL831 · 2026-07-02T19:39:27Z

+			outline: 2px solid var(--d2l-theme-border-color-focus);
+			outline-offset: -2px;
+		}`),
+		ariaInvalid: getFocusVisibleStyles(ariaInvalidSelector, (selector) => css`${selector} {


This rule is being used both inside and outside the media query, so just added it once

EdwinACL831 · 2026-07-03T13:50:15Z

I had to also update these styles in order to use the _getFocusVisibleStyles and replace the getFocusPseudoClass cause this file is imported in at the beginning of the input-select-styles.js and generating the styles in BSI would also had the same issue.

Note: This file is being imported in input-select-styles.js because the --d2l-input-invalid-image css variable is being used there, so we need to register it too.

I just realized that @GZolla is working on this same file ang giving a more complete solution in this PR. I will revert these changes and wait for his pr to be merged

dlockhart · 2026-07-06T13:57:08Z

 	</svg>`
 );

+function _getSelectFocusStyles(selector) {


I'm personally finding the addition of this helper really confusing to follow the before & after, vs. just calling into getFocusVisibleStyles directly from _generateSelectStyles right inline.

imo i think should be pretty straight forward. what I did was only to group styles and selectors into this function, and then use the returned object there. I decided to created this helper function to encapsulate the logic that replaces the getPseudoClass from above

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

dlockhart · 2026-07-07T19:04:41Z

-		{ name: 'sass-rtl-overflow', template: sassOverflowFixture, rtl: true },
-		{ name: 'sass-rtl-overflow-focus', template: sassOverflowFixture, rtl: true, focus: true },
-		{ name: 'sass-rtl-invalid', template: sassInvalidFixture, rtl: true },
-		{ name: 'sass-rtl-invalid-focus', template: sassInvalidFixture, rtl: true, focus: true },


Ok so the plan is to merge this PR, then update BSI to use the new generate function and merge that, then come back here and remove the Sass entirely?

If we need to do it in 2 phases anyway, I think I'd suggest:

Introduce the generator function in core and update the Sass tests to use it (should have little to no vdiff changes) & merge & release that

Update BSI to use the generator

Come back and remove the Sass tests

OK, regarding the BSI step I already have the PR for review. I will put back the sass tests and make them to use the generated styles.

WDYM by introduce the generator function in core? if you mean to use that, I think it is currently being used to generate the selectStyles in this line

I meant more for future changes like this to do it in the 3 phases I listed.

This reverts commit 965c997.

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

d2l-github-release-tokens · 2026-07-08T17:54:57Z

🎉 This PR is included in version 3.268.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

GAUD-8850: Remove select.scss

0b77aad

- Adds feature flag to wrap the logic to always return the :focus-visible css pseudo-class

Edwin Collazos added 3 commits July 2, 2026 14:58

Removes the code related to the feature flag, and adds a deprecated m…

7c63fc8

…essage to getFocusPseudoClass

Implements function to encapsulate the focus styles of the select com…

a281487

…ponent

Uses the _generateSelectFocusStyles and replace the css to use those …

21ea095

…ones

EdwinACL831 force-pushed the ecollazos/GAUD-8850_remove_select_scss branch from 29eb27f to 21ea095 Compare July 2, 2026 19:15

Edwin Collazos added 2 commits July 2, 2026 15:17

Removes the getFlag import now that is not needed

41f07fd

Enables vdiff tests to use the generated styles

a1b7f07

github-actions Bot mentioned this pull request Jul 2, 2026

Updating vdiff goldens for PR 7155 #7157

Merged

EdwinACL831 commented Jul 2, 2026

View reviewed changes

EdwinACL831 marked this pull request as ready for review July 2, 2026 19:38

EdwinACL831 requested a review from a team as a code owner July 2, 2026 19:38

EdwinACL831 commented Jul 2, 2026

View reviewed changes

EdwinACL831 commented Jul 3, 2026

View reviewed changes

EdwinACL831 force-pushed the ecollazos/GAUD-8850_remove_select_scss branch from 01f5b44 to a1b7f07 Compare July 3, 2026 14:15

Edwin Collazos added 3 commits July 3, 2026 10:20

Merge branch 'main' into ecollazos/GAUD-8850_remove_select_scss

92ee5bf

Groups styles selectors when generating the focus pseudoclasses styles

abaf9fa

Merge branch 'main' into ecollazos/GAUD-8850_remove_select_scss

1251a94

dlockhart reviewed Jul 6, 2026

View reviewed changes

Edwin Collazos added 2 commits July 6, 2026 11:35

Adds parameter to accept extra styles under the media-query

3bfff70

Refactors to use the getFocusRingStyles

d9008b4

EdwinACL831 force-pushed the ecollazos/GAUD-8850_remove_select_scss branch from a172bca to d9008b4 Compare July 6, 2026 16:04

Edwin Collazos added 2 commits July 6, 2026 12:18

Fixes lint error custom-property-empty-line-before

6e4cfbf

Removes sass vdiff tests

965c997

dlockhart reviewed Jul 6, 2026

View reviewed changes

Comment thread components/inputs/input-select-styles.js

Improves variable naming to make it clearer

612d1f3

EdwinACL831 force-pushed the ecollazos/GAUD-8850_remove_select_scss branch from 8979095 to 612d1f3 Compare July 6, 2026 18:53

github-actions Bot and others added 2 commits July 6, 2026 16:04

Updating vdiff goldens (#7157)

03b9ae6

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

Adds unit test at node-imports-test-js

71d1cf8

EdwinACL831 requested a review from dlockhart July 7, 2026 18:19

dlockhart reviewed Jul 7, 2026

View reviewed changes

Edwin Collazos added 2 commits July 8, 2026 09:30

Merge branch 'main' into ecollazos/GAUD-8850_remove_select_scss

7f3956f

Revert "Removes sass vdiff tests"

3f5012c

This reverts commit 965c997.

github-actions Bot mentioned this pull request Jul 8, 2026

Updating vdiff goldens for PR 7155 #7173

Merged

Updating vdiff goldens (#7173)

d282cfa

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

github-actions Bot mentioned this pull request Jul 8, 2026

Updating vdiff goldens for PR 7155 #7174

Closed

dlockhart approved these changes Jul 8, 2026

View reviewed changes

EdwinACL831 merged commit 7aa1e02 into main Jul 8, 2026
8 of 9 checks passed

EdwinACL831 deleted the ecollazos/GAUD-8850_remove_select_scss branch July 8, 2026 17:53

d2l-github-release-tokens Bot added the released label Jul 8, 2026

Uh oh!

Conversation

EdwinACL831 commented Jul 2, 2026 • edited by atlassian Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Jira

Uh oh!

github-actions Bot commented Jul 2, 2026

Uh oh!

EdwinACL831 Jul 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

EdwinACL831 Jul 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

d2l-github-release-tokens Bot commented Jul 8, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

EdwinACL831 commented Jul 2, 2026 •

edited by atlassian Bot

Loading

EdwinACL831 Jul 2, 2026 •

edited

Loading

EdwinACL831 Jul 3, 2026 •

edited

Loading