Page Builder Slice Preview Error

Greetings Prismic People!

I am currently writing a post for my own site. Yes, every once in a while we get to do our own stuff, right?

I've noticed that the slice previews in the page builder appear to function for a brief moment before they go blank. Then after a little while, they say "error" in them.

Looking good :point_down:
Screenshot 2024-02-18 180343

:sob: :point_down:
Screenshot 2024-02-18 180743

Am I the only one experiencing this? Some relevant details:

Browser: Edge
Version: 121.0.2277.128
Console Errors:
Screenshot 2024-02-18 181016

Update to this "conundrum."

I just published the post. The instant I hit publish, the slice previews appeared and stayed rather than going blank and then erroring.

Second update.
I've noticed now that when I edit a document and the slice previews work in the page builder, this is what causes them to stop working.

  1. Hit Preview the Page.
  2. Select your preview environment.
  3. Page preview opens in a new tab and sets cookies.
  4. Return to page builder (slice previews are still working).
  5. Navigate back to your document list.
  6. Return to the document to resume editing.
  7. The slice previews load, flash to white, and then error.

If I use the Prismic preview toolbar to close the preview and wait for a second for the 404 page to load, I then can refresh the page builder, and the slice previews work again.

I've made the team aware of this issue. I'm not sure it's related to the other preview error you linked though.

Thank you. I agree that these two threads started out differently. I am noticing a theme through a few different threads that does come back to the page builder previews and cookies from page previews. I appreciate you passing it on.

1 Like

I've made a bug report that you can follow :slight_smile:
https://prismic.atlassian.net/browse/BT-64

Hello, I am experiencing the same error with all the slices in the page builder.

[Context]
I have setup the Prismic repo and website and left it there for our marketing team to use for around a year now and have not touched a thing. Recently they reported that previews stopped working. I fixed that by reconfiguring the preview, but the slices area in page builder shows this error label. I have upgraded to the new slice machine and that has still not fixed the error.

** I can see the page is trying to fetch the url ```mydomain.com/mypagename/slice-simulator but the only url I have configured for the slice simulator is on the root mydomain.com/slice-simulator`

Is there anything else you would recommend trying, am I missing some configuration?

This is happening on existing content and when I try to create new content.

Any help would be appreciated. Cheers

image

image

Hi @bioscout ,

It is strange that you're seeing requests to domain/slug/slice-simulator

Seeing that, I'm wondering if your route resolver might have something to do with this (though I am doubtful this is the cause).

I am often experiencing weird things with the page builder slice previews. My "errors" at the moment are 500 errors for the sitemap.xml. I'm not sure why I get that error in the page builder though.

Hi @bioscout, sorry to see you're having issues. Would you mind sharing with me the name of the repo so I can take a closer look?

Best,
Guy

Thanks for your reply.

The repository name is bioscout.

Thanks, @bioscout . The team is investigating. I'll post an update here when I have an update.

I thought I'd post here the solution for the error I was experiencing.

Apparently the url for live editing was defaulting to the slug of the page. I just had to update this and the slice preview started working normally,

1 Like

I'm having this same issue with my local development project. None of my slices are showing the screenshot and just display's Error. I checked my URL for live editing and it's the same as @bioscout 's last post

@matt8 Are you using previews (not the pagebuilder previews but the preview button in the bottom left of the page builder)? This, for me, has be the cause of the errors in my pagebuilder previews. If so, try this for me and let me know if it works. Click your preview button and select your preview option. This will open a new tab and your preview will load. The toolbar should appear in the bottom left of the preview. Click the X to close the preview toolbar. This should clear the cookie for the preview. Then go back to your page builder and refresh the page. This has succeeded for me in the past when I got nothing but red PB preview errors.

@nf_mastroianni further investigation, this was because my live preview was set to my vercel project url. localhost will show the screenshots. However slice-simulator is throwing 500 errors when I deploy to vercel - I researched this on this forum and there are a lot of conflicting answers - I'm running next.js 14.

Might this have anything to do with your API folder being inside a group?

Consider moving API back into app and see if that impacts anything maybe?

I'd like to suggest something to the Prismic team.

Ever since the old Prismic user interface was retired in favor of the sidebar-centric slice simulator setup, our legacy projects now display an error in the sidebar, since legacy slices weren't built using the slice simulator. This has resulted in our users wondering how either they or we broke Prismic's functionality. This is an ongoing issue with the new dashboard's presentation on legacy projects.

Legacy slices could already be paired with a static preview screenshot, which is still used when selecting a slice from the 'All Slices' list.

Why not use these preview screenshots in the sidebar as a fallback if the slice preview isn't available? They're already being fed in, and it might be a nicer way to display legacy slices instead of immediately resorting to the nasty-looking error message.


I am having the same issue. It did work at the start, now I am just getting an error message. My project is setup as NX mono repro. In order to get to work I added nested package.json to the application folder but I had to remove the yarn.lock as this would cause issues with Netlify deployment.

I verified that the slicemaschine is running.

I do get an error under network panel from Clerk authentication, not sure if this releated:

(failed)

net::ERR_TOO_MANY_REDIRECTS

I see you resolved your issue on Github, so I'm posting it here: