feat(react): add button to reload a preview #305
Conversation
|
|
| testId?: string; | ||
| } | ||
|
|
||
| export function ButtonWriteToFile({ filePath, newContent, testId = 'write-to-file' }: Props) { |
There was a problem hiding this comment.
Nice! I can imagine this utility component being useful in other future tests as well. It's good to have it accepting props like this. 🎉
Co-authored-by: Ari Perkkiö <[email protected]>
Deploying tutorialkit-demo-page with
|
| Latest commit: |
3214499
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://c763c9a6.tutorialkit-demo-page.pages.dev |
| Branch Preview URL: | https://joan-reload-preview.tutorialkit-demo-page.pages.dev |
|
The duotone icon looks strange to me too, https://icones.js.org/collection/ph?s=arrow&icon=ph:arrow-clockwise could be used instead, along with a |
|
@henrikvilhelmberglund I'll change it to the |
There was a problem hiding this comment.
Documentation for the new localization key should be added in docs/tutorialkit.dev/src/content/docs/reference/configuration.mdx. Once that's done, this is good to go!
We should create separate follow-up issue for updating the background of the old icon-buttons too.
@AriPerkkio Oh do you mean updating all the |
Yep, at least the reset button looks similarly weird now that I've seen how clear the refresh button looks after the change. 😄 Or maybe this in intentional?
|
|
@AriPerkkio It was, but we can also change them I think. It was not my choice 🤷♂️ Tbqh, I've always felt that, at the very least, they should be customizable. I'll open a ticket for that and another one to change them to their non-duotone versions. EDIT: Created #311 |
This PR replaces the globe icon with a reload button, to reload a preview. It uses the new
reloadPreviewfunction from@webcontainer/api/utils.Closes #248
Note that this is best effort. Meaning that if the learner navigates within the preview to a location that does not render HTML (like an image or JSON), pressing the reload icon won't work as it will reset the iframe to its initial location. This can only be fixed at the WebContainer level.