Skip to content

fix(react): refresh preview when autoReload: true #303

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

Merged
merged 1 commit into from
Sep 2, 2024

Conversation

AriPerkkio
Copy link
Member

The PreviewPanel is looking for iframe's inside #preview-panel, but they are actually outside it in the #preview-container. They are just presented there visually with CSS - this is also a serious accessibility issue as tab order doesn't match visual order but this PR doesn't fix that.

const previewPanel = document.getElementById('preview-panel');
if (previewPanel) {
const iframes = previewPanel.querySelectorAll('iframe');
for (const iframe of iframes) {
iframe.src = iframe.src;
}
}

Recordings of before vs after

Before:

tk-auto-reload-before.webm

After:

tk-auto-reload-after.webm

Copy link

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

Copy link
Member

@Nemikolh Nemikolh left a comment

Choose a reason for hiding this comment

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

Really nice! Love seeing those tests too! 😃

Good work on this!! 🥳 🎉

@Nemikolh Nemikolh merged commit 9754b26 into stackblitz:main Sep 2, 2024
10 checks passed
@AriPerkkio AriPerkkio deleted the fix/preview-reload-bug branch September 2, 2024 13:33
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