Sometimes can't fetch pages with builder.get('page', { userAttributes: { urlPath } })

Bugs
,
1

The system was working perfectly, until suddenly we started getting inconsistent errors on some pages.

This is our code (NextJS):

builder.init(config.BUILDER_API_KEY);

export async function getStaticProps({ params }) {
  const page = await builder
    .get('page', {
      userAttributes: {
        urlPath: '/' + (params?.page?.join('/') || ''),
      },
    })
    .toPromise();

Sometimes it returns undefined, even though the page url is defined well. If we make a very small irrelevant change like change the page name, or just wait a while - then it suddenly works out and returns the page.

For example here:

We have “@builder.io/react”: “^2.1.0”,
But also failed with 3.0.1

2

Hi @adam, Welcome to Builder.io Forum!

We’re sorry for any inconvenience. We are trying to reproduce the issue and will keep you updated!

3

@adam, Unfortunately, I’m able to reproduce the issue on my end. Could you please help us with sharing a couple of page URLs where you’re seeing undefined errors or would be great if you can share a screen recording for further investigation?

4

Thanks,
As I said the problem is inconsistent. I believe it happens with unpublished pages, as I published the latter and it started working.

You can see it here for example:

We get an error TypeError: Cannot read properties of null (reading 'data') - and this is because the page returns as undefined and we access page.data.url

5

@adam, I opened the shared content which shows Unexpected Error: Something went wrong within the editor. Before proceeding further with debugging, just wanted to confirm if is this because of an undefined value or something else from your end?

6

Yes it’s because of that. You can open the second link (the preview one) and see the error in the console:

image.png
image.png3258Ă—1994 710 KB

7

Thanks for confirming. I’m on it and will keep you updated!

1 Like
8

@adam, We looked into this and made a loom: Loom | Free Screen & Video Recording Software | Loom, please check this out and let me know if I miss on anything!

9

Hi Garima,
Thanks for investigating. Please see the original message, it fails on page.data.url because the page is not found, which is the source of the problem we are trying to solve.

Actually, I managed to reproduce it in a CodeSandbox.
It’s very strange. If I fetch just the problematic page first (/product), and then another page (/pricing-plan) - both are returned as undefined.
But if I first fetch the pricing page, and then the product page - they are both returned successfully!
This is definitely a problem with the builder/react library. You can see it here:

10

Could you please share your CodeSandbox link?

11

Actually I think it’s 2 different bugs:

  1. Product page is not found (main bug that we want to solve)
  2. Calling builder.get in parallel returns the same page for both calls instead of treating them separately
12

Sure:
https://codesandbox.io/s/zen-cache-9zttq1?file=/src/App.js

13

Hi Garima,
Any updates on this?

It’s been getting quite difficult to edit pages currently, we want to edit them without publishing. Thanks

14

Hi @adam,

We’re sorry for the delayed resolution on this and wanted to let you know that we have not forgotten about this. We are still working on the cause but no luck yet.

I will be sure to keep you updated. In the meantime, please reach out if I can help with anything else.

15

Thanks for the response.

Is this something specific to our account, or general? Any way you think we can bypass this until it’s resolved?
If it’s an issue with more customers then I think it should be escalated because it’s the basic functionality of working with the platform

Thanks

16

@adam, First, thank you for the code sandbox link and further details on your concern, I was able to understand your use case properly and would say it’s general.

  • The call you’re making seems you want to fetch content like fetch pages basically which are with specific URL paths on your product page.
  • This can only happen when content is published.
  • When you finish editing pages, we press publish and then that’s what goes live into your staging or production or wherever environment you are hosting that web.
  • When you are in the draft mode, no matter how much content you add here, will be only viewable inside the builder editor.
  • Hence, once the publish happens, then all the calls which are supposed to get the content, like, get all, get contained on, they start working and then the data starts showing up.

Workaround:-
Including includeUnpublished: true as options in API will also fetch unpublished content. I’ve updated the code here great-saha-26gfgq - CodeSandbox.

Appreciate your patience and hope this makes sense, let me know if you’ve further questions!

17

Thanks for the response.
I don’t quite understand this, then how do I show the draft page in preview mode but hide it in the regular URL before it’s published?

18

@adam, no worries. To summarize, by default Builder API only fetches published content, to get unpublish content also, you need to include extra query param i.e. includeUnpublished: true .

If you check the returned data, there’s a field called published which indicates the current status of the page. So you can put this in if condition to display and hide content accordingly.

image

19

OK, thanks a lot, got it to work.
I think this should be part of the official getting started docs BTW

All the best

20

@adam, Sure I’ll forward this feedback to our doc team as well!