fix: fetch assets in dynamic content (#1369, #1587, #1630, #1936, #2064)

[mskec]

Reopening PR https://github.com/diegomura/react-pdf/pull/2240

This PR fixes crashes with images inside dynamic content.

From looking at it, the problem was that assets weren't loaded for images inside dynamic content because resolveAssets was executed before resolvePagination. To resolve this, I've added resolveAssets as a step in relayout which forced me to add a bunch of async/await all over resolvePagination.

fixes: https://github.com/diegomura/react-pdf/issues/1369, https://github.com/diegomura/react-pdf/issues/1587, https://github.com/diegomura/react-pdf/issues/1630, https://github.com/diegomura/react-pdf/issues/1936, https://github.com/diegomura/react-pdf/issues/2064

[changeset-bot[bot]]

⚠️ No Changeset found

Latest commit: 8c32948a058f4cd829498b2ccb19aaeab095817f

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[takethefake]

thanks for the contribution @mskec - looks promising! What needs to be done so this could be released @diegomura ? We also experienced this issue and are working with a nasty workaround. This fix would help us a lot!

[jkergal]

thanks for the contribution @mskec - looks promising! What needs to be done so this could be released @diegomura ? We also experienced this issue and are working with a nasty workaround. This fix would help us a lot!

Hey, can you share your nasty workaround? Would be great! :)

[takethefake]

hej @jkergal I required to have a different header on page 1 vs page 2 and following. Instead of putting all content inside only one page element and leaving the page wraps to the page element I've added another page element.

Therefore I need to separate my content between both page elements to apply different headers.

[mskec]

You could try to use patch-package and apply the fix. I see there's some conflict now. I will try to resolve it and update the PR.

@diegomura can you please give us some comment on this. Do you see a better way to fix this bug?

[takethefake]

hey @mskec maybe add a changeset and rebase to its main to make it easier for @diegomura to add this change.

[mskec]

After rebasing with the latest master changes, I'm seeing errors in resolvePagination. I will need more time to check why is it failing.

Error: Worker terminated due to reaching memory limit: JS heap out of memory
 ❯ new NodeError node:internal/errors:405:5
 ❯ [kOnExit] node:internal/worker:287:26
 ❯ Worker.<computed>.onexit node:internal/worker:209:20

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
Serialized Error: { code: 'ERR_WORKER_OUT_OF_MEMORY' }

[deanwyns]

It seems that you're missing an 'await' in the paginate function (line 263) causing it to infinitely loop until it runs out of memory: https://github.com/diegomura/react-pdf/blob/fadf37f7d6a4b51426d372bbf26600422940910e/packages/layout/src/steps/resolvePagination.js#L263

[mskec]

Good catch @deanwyns, thank you :)

[ishak14]

also waiting for this fixed. just updated to 7.7.1 and noticed that my PDF was not working. problem occurs when loading images dynamically

[mskec]

Hi @diegomura, can you give us some comment on this fix? Do you have concerns about the way this is fixed?

I created the same PR https://github.com/diegomura/react-pdf/pull/2240 in March 2023 and never received any feedback from you.

[hect1c]

I tried to patch the changes in my file but after doing so I get the following error

error TypeError: Cannot read properties of undefined (reading 'width')
    at resolvePageStyles (index.js:1328:40)
    at Array.map (<anonymous>)
    at resolveStyles (index.js:1354:32)
    at _callee$ (index.js:89:23)
    at tryCatch (regeneratorRuntime.js:50:16)
    at Generator.eval (regeneratorRuntime.js:138:17)
    at Generator.eval [as next] (regeneratorRuntime.js:79:21)
    at asyncGeneratorStep (asyncToGenerator.js:7:24)
    at _next (asyncToGenerator.js:26:9)

Did anyone get the same issue?

[jalalmanafi]

I have same issue, any solution?

[jalalmanafi]

I tried to patch the changes in my file but after doing so I get the following error

error TypeError: Cannot read properties of undefined (reading 'width')
    at resolvePageStyles (index.js:1328:40)
    at Array.map (<anonymous>)
    at resolveStyles (index.js:1354:32)
    at _callee$ (index.js:89:23)
    at tryCatch (regeneratorRuntime.js:50:16)
    at Generator.eval (regeneratorRuntime.js:138:17)
    at Generator.eval [as next] (regeneratorRuntime.js:79:21)
    at asyncGeneratorStep (asyncToGenerator.js:7:24)
    at _next (asyncToGenerator.js:26:9)

Did anyone get the same issue?

I found issue on my code, check your content if it comes from API you have to check field you use in PDF file

{data?.field ? <Text>{data?.field}</Text> : null }