Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: mismatched scoped / light slots / data #5131

Merged
merged 3 commits into from
Jan 13, 2025

Conversation

jhefferman-sfdc
Copy link
Contributor

Details

Does this pull request introduce a breaking change?

  • 😮‍💨 No, it does not introduce a breaking change.

Does this pull request introduce an observable change?

  • 🤞 No, it does not introduce an observable change.

GUS work item

W-17555947

@jhefferman-sfdc jhefferman-sfdc requested a review from a team as a code owner January 13, 2025 15:05
const slotName = ${/* slotName */ is.expression};
const lightGenerators = lightSlottedContent?.[slotName ?? ""];
const scopedGenerators = scopedSlottedContent?.[slotName ?? ""];
const mismatchedSlots = (isScopedSlot && lightGenerators) || (!isScopedSlot && scopedGenerators);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For mismatched slot case an error is logged in v1 / client (we don't throw). Error is logged non-production only. There was no precedence in v2 for this so do we need to do anything? Throwing would be too much, it needs to recover.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Logged errors are essentially meaningless, so I don't think we need to do anything here. It would be nice to have error logging somewhere in v2, but also not a big deal, since presumably folks can see the same logged error in their browser DevTools.

(As an aside, it should probably be a console.warn too! #3692)

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
const mismatchedSlots = (isScopedSlot && lightGenerators) || (!isScopedSlot && scopedGenerators);
const mismatchedSlots = isScopedSlot ? lightGenerators : scopedGenerators;

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, that is more elegant

@jhefferman-sfdc jhefferman-sfdc changed the title fix: mismatched (un)scoped slot data / slots fix: mismatched scoped / light slots / data Jan 13, 2025
Copy link
Collaborator

@nolanlawson nolanlawson left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks reasonable to me, and it's definitely a huge improvement. (4 tests fixed!) I'm a little concerned though that I don't understand why these fixes worked. Figuring out exactly why engine-dom/engine-server behave the way they do and then adding thorough comments would be super helpful.

const slotName = ${/* slotName */ is.expression};
const lightGenerators = lightSlottedContent?.[slotName ?? ""];
const scopedGenerators = scopedSlottedContent?.[slotName ?? ""];
const mismatchedSlots = (isScopedSlot && lightGenerators) || (!isScopedSlot && scopedGenerators);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Logged errors are essentially meaningless, so I don't think we need to do anything here. It would be nice to have error logging somewhere in v2, but also not a big deal, since presumably folks can see the same logged error in their browser DevTools.

(As an aside, it should probably be a console.warn too! #3692)

if (isScopedSlot && i < generators.length - 1) {
yield '<!---->';
yield '<!---->';
}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is really bizarre behavior! I wonder what explains it.

Copy link
Collaborator

@nolanlawson nolanlawson Jan 13, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh wait I think I see – it's because of the double bookend? So the double bookend logic for the start/end is handled elsewhere?

It might be good to add a comment explaining this!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yep exactly. Added a note to explain that!

const slotName = ${/* slotName */ is.expression};
const lightGenerators = lightSlottedContent?.[slotName ?? ""];
const scopedGenerators = scopedSlottedContent?.[slotName ?? ""];
const mismatchedSlots = (isScopedSlot && lightGenerators) || (!isScopedSlot && scopedGenerators);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
const mismatchedSlots = (isScopedSlot && lightGenerators) || (!isScopedSlot && scopedGenerators);
const mismatchedSlots = isScopedSlot ? lightGenerators : scopedGenerators;

}
} else {
// If there were mismatched slots, do not fallback to the default
} else if (!mismatchedSlots) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd love to understand why mismatched slots have any impact here.

Copy link
Contributor Author

@jhefferman-sfdc jhefferman-sfdc Jan 13, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added a comment here to explain: This is required for parity with engine-core which resets children to an empty array when there are children (mismatched or not). Because the child nodes are reset, the default slotted content is not rendered in the mismatched slot case. See here. I'm guessing this is a sort-of-bug but fixing it would mean a v1/client behavior change and I don't think it's worth it....

@jhefferman-sfdc
Copy link
Contributor Author

This looks reasonable to me, and it's definitely a huge improvement. (4 tests fixed!) I'm a little concerned though that I don't understand why these fixes worked. Figuring out exactly why engine-dom/engine-server behave the way they do and then adding thorough comments would be super helpful.

Thank you for reviewing! I added some additional clarification comments and made the ternary simplification for the mismatchedSlot condition.

@jhefferman-sfdc jhefferman-sfdc merged commit 2b678bb into master Jan 13, 2025
11 checks passed
@jhefferman-sfdc jhefferman-sfdc deleted the jhefferman/mismatched-scoped-slots-fix branch January 13, 2025 21:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants