When previewing the content on tablet and phone modes, styles and images aren't being loaded.
These modes uses IFrames and it seems that links not using a full URL doesn't work.
For example, an image src with /sites/default/files/inline-images/image.jpeg won't work inside the frame but it works if set to a full url like https://mysite.dev/sites/default/files/inline-images/image.jpeg. The same goes for stylesheets.

Comments

marcofernandes created an issue. See original summary.

marcofernandes’s picture

marcofernandes commented

This issue occurs because when using a blob as a source for a iframe, the browser will process relative urls based on the blob url. The workaround is to use base in the Iframe head.
This need to be addressed on core Gutenberg (Block Editor package). A pull request was made: https://github.com/WordPress/gutenberg/pull/56533
Meanwhile we'll use a patch.

  • marcofernandes committed b592ac20 on 3.0.x 
    Issue #3404152 by marcofernandes: Add observer to add extra classes to...

  • marcofernandes committed 5f26b0fc on 3.0.x 
    Issue #3404152 by marcofernandes: es-lint ignore for generated script...

  • marcofernandes committed c9efcd6e on 3.0.x 
    Issue #3404152 by marcofernandes: Add Block Editor package patch to add...
marcofernandes’s picture

marcofernandes commented
Status: Active » Fixed

  • marcofernandes committed f65323d1 on 3.0.x 
    Issue #3404152 by marcofernandes: Avoid preprocess on some css files so...

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.