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.

Sign up for GitHub

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

Jump to bottom

Inertia page in an iframe through srcdoc attribute #1008

Closed
tech-codivores opened this issue Dec 13, 2021 · 4 comments
Closed

Inertia page in an iframe through srcdoc attribute #1008

tech-codivores opened this issue Dec 13, 2021 · 4 comments
Labels
bug Something isn't working vue 3 Related to the vue 3 adapter

Comments

@tech-codivores
Copy link

Versions:

  • @inertiajs/inertia version: 0.10.1
  • @inertiajs/inertia-vue3 version: 0.5.2
  • vue version: 3.2.26
  • vite version: 2.7.2

Describe the problem:

Rendering an Inertia page in an iframe through srcdoc attribute triggers an error in the hrefToUrl function. As the location is about:srcdoc, it fails building a valid URL object when Inertia creates a visit.

image

I know it is a really specific usecase that should not be recommended, but we use Laravel with Twill package (CMS with admin interface) that offers a preview feature using iframe with srcdoc.

Steps to reproduce:

  1. Create a standard HTML page
  2. Include an iframe with Inertia page content as srcdoc attribute
<iframe srcdoc="<!DOCTYPE html>
<html>
<head>
    <meta charset=&quot;utf-8&quot;>
    <meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0, maximum-scale=1.0&quot; />
    <script type=&quot;module&quot; src=&quot;http://domain.test:3030/@vite/client&quot;></script>
    <script type=&quot;module&quot; src=&quot;http://domain.test:3030/resources/js/app.ts&quot;></script>
</head>

<body class=&quot;bg-grisUnilever-100&quot;>
    <div id=&quot;app&quot; data-page=&quot;{&amp;quot;component&amp;quot;:&amp;quot;Test&amp;quot;,&amp;quot;props&amp;quot;:{&amp;quot;errors&amp;quot;:{}},&amp;quot;url&amp;quot;:&amp;quot;\/administration\/content\/blog\/blogs\/preview\/126&amp;quot;,&amp;quot;version&amp;quot;:&amp;quot;&amp;quot;}&quot;></div>
</body>

</html>" frameborder="0" style="width: 1280px;"></iframe>
@ajnsn
Copy link

ajnsn commented Dec 15, 2021 •
edited

Hey @tech-codivores
As far as I understand the srcdoc is not providing a proper window.location as per spec this about:srcdocseems to be unresolveable. It seems not be a bug.

As you said that is really specific usecase. This could be a challenge to resolve as alone inside router.ts I find 10 occurences of window.location.

@tech-codivores
Copy link
Author

Hi @ajnsn, and thank you for your reply.
The discussion started on the Inertia Discord with @RobertBoes and @claudiodekker who asked me to open an issue.
Would this be acceptable if I let them decide the follow up to this question?

@claudiodekker
Copy link
Member

claudiodekker commented Dec 22, 2021 •
edited

Hey @tech-codivores,

Thanks again for opening this issue! As mentioned previously / for reference of others, we're going to leave this one for later, as it is technically bug (but doesn't have the highest priority right now given how rare it is to use Inertia this way)

@claudiodekker claudiodekker added bug Something isn't working todo labels Dec 22, 2021
@claudiodekker claudiodekker added vue 3 Related to the vue 3 adapter and removed todo labels Jan 4, 2022
@reinink
Copy link
Member

reinink commented Jul 28, 2023

Hey! Thanks so much for your interest in Inertia.js and for sharing this issue/suggestion.

In an attempt to get on top of the issues and pull requests on this project I am going through all the older issues and PRs and closing them, as there's a decent chance that they have since been resolved or are simply not relevant any longer. My hope is that with a "clean slate" me and the other project maintainers will be able to better keep on top of issues and PRs moving forward.

Of course there's a chance that this issue is still relevant, and if that's the case feel free to simply submit a new issue. The only thing I ask is that you please include a super minimal reproduction of the issue as a Git repo. This makes it much easier for us to reproduce things on our end and ultimately fix it.

Really not trying to be dismissive here, I just need to find a way to get this project back into a state that I am able to maintain it. Hope that makes sense! ❤️

@reinink reinink closed this as completed Jul 28, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working vue 3 Related to the vue 3 adapter
Projects
Inertia.js
Status: Closed 🚪
Milestone
No milestone
Development

No branches or pull requests
4 participants
@reinink @claudiodekker @ajnsn @tech-codivores