search

Jesperpaulsen / sanity-mobile-preview

An NPM package written in React used to preview mobile devices. Especially helpful when used in combination with a CMS like Sanity.
https://jesperpaulsen.github.io/sanity-mobile-preview/
MIT License
28 stars 3 forks source link

ReferenceError: IFrameMobilePreview is not defined #1

Closed ajmalafif closed 3 years ago

ajmalafif commented 3 years ago

Hi there,

I believe I follow the README properly and thoroughly but couldn‘t figure out what I did wrong. I keep getting this error on my Sanity Studio:

afif_dev_–_Sanity

Here‘s the branch which I attempted to install sanity-mobile-preview

Appreciate any pointers so I can make it work. Thanks!

Jesperpaulsen commented 3 years ago

Hi @ajmalafif 😄

Thanks for submitting the issue!

Took a quick look at your code, and at line 34 you're referencing IFrameMobilePreview with capital F, while you import it as IframeMobilePreview at line 9, without capital F. Can you try to change it, and see if that works? 🙂

https://github.com/ajmalafif/afif.dev/blob/sanity-mobile-preview/studio/src/structure/deskStructure.js#L34

Looked at the Readme, and I see that I'm not consequent with the lower/upper case on IFrame vs Iframe. I will make sure to update the Readme 🤠

ajmalafif commented 3 years ago

Hi @Jesperpaulsen!

No THANK YOU SO MUCH for the swift reply and sharp eyes. That fixes it!

Jesperpaulsen commented 3 years ago

@ajmalafif I'm glad I could help. Let me know if you run into any other problems or have suggestions to improve the plugin!

ajmalafif commented 3 years ago

Definitely!

I reckon should I create new issue or just comment here?

As a designer first, I noticed small details like the scroll bar doesn't reflect the scroll bar on mobile browsers so curious if that's more of stylistic changes or there's some settings need to be changed to reflect that.

Jesperpaulsen commented 3 years ago

I guess you can open a new issue, so it will be easier for others to see them as well!

When it comes to the styling of the scrollbar, I absolutely agree. At the moment the scrollbar that is shown is using the same scrollbar as the browser you're viewing it in. It will take a bit more logic to override the appearance from the plugin, as it at the moment doesn't handle the actual iFrame. So in the meantime, I guess you could try to style the appearance of the iFrame directly 🙂 The iFrame can be styled in the same way as regular HTML Elements, as shown here. Let me know if you try it out and if it works, we can try to add your design to the plugin 😃

ajmalafif commented 3 years ago

Got it. I'll probably tinker around and see if there is actual progress and improvement I could contribute. Will share my findings. Thanks again for the package and help!