Description
Code of conduct
- I agree to follow this project's code of conduct.
Impacted component(s)
Theme
Expected behavior
In UXP, importing themes from @spectrum-web-components/theme
should add stylesheets to the document for CSS variable references by SWC components.
Note: I am aware that the <sp-theme>
component is not officially supported in UXP (see documentation here), but prior versions had been loading styles correctly. I will be using version 0.42.5 as an example.
Actual behavior
Importing themes and using <sp-theme>
provider does not add stylesheets to the document. As a result, components that rely on Adobe styling do not render with correct styles.
Screenshots
UXP Plugin with version 0.42.5 dependencies:
UXP Plugin with version 1.1.1 dependencies:
What browsers are you seeing the problem in?
No response
How can we reproduce this issue?
For simple testing, I used this Adobe example starter project. These steps for reproduction outline a comparison between versions 0.42.5 and 1.1.1 to emphasize the difference in behaviors between a version known to work in UXP (0.42.5) and the latest (1.1.1).
For reference, this bug was observed in Adobe Photoshop 2024, running on macOS Sonoma 14.1.1.
- Update the dependencies in the
package.json
file by running the following commands:
npm install @spectrum-web-components/[email protected]
npm install @swc-react/[email protected]
npm install @swc-react/[email protected]
- Build with
npm run build
- Open Photoshop and load the project in Adobe UXP Developer Tools by selecting "Add Plugin" and selecting
dist/manifest.json
and pressing "Load" - Observe that styles for the Menu are loaded properly (e.g. blue checkmark icon for selected option, correct spacing)
- Now, update the dependencies to version 1.1.1:
npm install @spectrum-web-components/[email protected]
npm install @swc-react/[email protected]
npm install @swc-react/[email protected]
- Repeat Steps 2 and 3 to load the plugin with updated version
- Observe that styles for the Menu are no longer loaded properly (e.g. no blue checkmark, small font size, incorrect spacing)
Sample code or abstract reproduction which illustrates the problem
No response
Severity
SEV 2
Logs taken while reproducing problem
No response