Skip to content

Conversation

christian-byrne
Copy link
Contributor

@christian-byrne christian-byrne commented Oct 11, 2025

Summary

Fixed Vue node opacity calculation to properly combine global opacity setting with muted/bypassed state opacity.

Root Cause: When global opacity setting was added as inline style (481aa82), it began overriding CSS opacity-50 classes due to higher specificity.

Solution: Modified nodeOpacity computed property to calculate effective opacity as globalOpacity * 0.5 for muted/bypassed states, removing conflicting CSS classes.

Changes

  • What: Fixed CSS specificity conflict where inline opacity style overrode opacity-50 classes for muted/bypassed nodes
  • Breaking: None - restores intended opacity behavior

Review Focus

Multiplicative opacity calculation ensuring muted/bypassed nodes apply 0.5 opacity on top of global opacity setting rather than being overridden by it.

┆Issue is synchronized with this Notion page by Unito

@dosubot dosubot bot added the size:S This PR changes 10-29 lines, ignoring generated files. label Oct 11, 2025
Copy link

github-actions bot commented Oct 11, 2025

🎭 Playwright Test Results

Some tests failed

⏰ Completed at: 10/12/2025, 02:20:54 AM UTC

📈 Summary

  • Total Tests: 492
  • Passed: 457 ✅
  • Failed: 2 ❌
  • Flaky: 3 ⚠️
  • Skipped: 30 ⏭️

📊 Test Reports by Browser

  • chromium: View Report • ✅ 448 / ❌ 2 / ⚠️ 3 / ⏭️ 30
  • chromium-2x: View Report • ✅ 2 / ❌ 0 / ⚠️ 0 / ⏭️ 0
  • chromium-0.5x: View Report • ✅ 1 / ❌ 0 / ⚠️ 0 / ⏭️ 0
  • mobile-chrome: View Report • ✅ 6 / ❌ 0 / ⚠️ 0 / ⏭️ 0

🎉 Click on the links above to view detailed test results for each browser configuration.

Copy link

github-actions bot commented Oct 11, 2025

🎨 Storybook Build Status

Build completed successfully!

⏰ Completed at: 10/12/2025, 02:04:51 AM UTC

🔗 Links


🎉 Your Storybook is ready for review!

@christian-byrne
Copy link
Contributor Author

Need to update the "muted" playwright tests to not rely on checking classnames. Can check style or just use a screenshot, I think the latter is better as it also ensures the css is working as expected.

@dosubot dosubot bot added size:M This PR changes 30-99 lines, ignoring generated files. and removed size:S This PR changes 10-29 lines, ignoring generated files. labels Oct 12, 2025
@christian-byrne christian-byrne added the New Browser Test Expectations New browser test screenshot should be set by github action label Oct 12, 2025
Copy link

Updating Playwright Expectations

@github-actions github-actions bot removed the New Browser Test Expectations New browser test screenshot should be set by github action label Oct 12, 2025
@christian-byrne christian-byrne merged commit ddb3a0b into main Oct 12, 2025
2 checks passed
@christian-byrne christian-byrne deleted the vue-node/fix-opacity branch October 12, 2025 04:36
@arjansingh arjansingh mentioned this pull request Oct 14, 2025
arjansingh added a commit that referenced this pull request Oct 14, 2025
## What's Changed

### 🚀 Features
- Add MediaAssetCard presentation components (#5878)
- Make Vue nodes' outputs/previews responsively sized and work with node
resizing (#5970)
- Allow connection to subgraphIOs in vue mode (#6016)
- Add distribution detection pattern (#6028)
- Make nodeData.widgets reactive (#6019)

### 🐛 Bug Fixes
- Fix FLOAT widget incrementing broken & disabled state styles on widget
number input (Vue) (#6036)
- Fix Vue node border styles in different states (executing, error,
selected) (#6018)
- Fix Vue node opacity conditions (user node opacity, bypass state,
muted state) (#6022)
- Fix: emit layout change for batch node bounds (#5939)
- Safer restoration of widgets_values on subgraph nodes (#6015)
- Fix(execution): reset progress state after runs to unfreeze tab
title/favicon (main) (#6026)
- Use type check instead of cast (#6041)

### 🎨 Style & Design
- [style] match widget border/outline styles with designs (#6021)
- [style] make Vue widget/slot/label width and spacing align with
designs (#6023)

### ♿ Accessibility
- Add aria labels on vue node widgets (#6032)

### 🔧 Maintenance
- [refactor] adjust Vue node fixtures to not be coupled to Litegraph
(#6033)
- [refactor] reorganize devtools test nodes into modules (#6020)

### 🧪 Testing
- [test] add browser test for control+a selection of Vue nodes (#6031)

### 🔄 CI/CD
- [ci] fix update locales workflow (#6017)

**Full Changelog**:
v1.29.1...v1.29.2

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6045-1-29-2-28c6d73d3650817a8c36fba944ce69a8)
by [Unito](https://www.unito.io)

---------

Co-authored-by: arjansingh <[email protected]>
Co-authored-by: github-actions <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area:nodes area:vue-migration size:M This PR changes 30-99 lines, ignoring generated files.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant