enablePreview does not call all fetch hooks

[mdoesburg]

Versions

• nuxt: 2.15.8
• node: 14.17.3

Reproduction

• https://github.com/mdoesburg/nuxt-static-fetch-with-preview

Steps to reproduce

1. git clone git@github.com:mdoesburg/nuxt-static-fetch-with-preview.git
2. cd nuxt-static-fetch-with-preview
3. yarn install
4. yarn generate
5. yarn start
6. Open http://localhost:3000/
7. Follow instructions on page

What is Expected?

I expect fetch to be called right away (initial load) if preview mode is enabled, not only on a page component but also on a regular component.

What is actually happening?

The page component's fetch is correctly called right away when preview mode is enabled, but the component fetch is only called when navigating.

The Nuxt docs say:

The preview mode will automatically refresh the page data as it uses $nuxt.refresh under the hood and therefore calls nuxtServerInit, asyncData and fetch on the client side.

Is "page data" in the docs implicitly suggesting that component data does not or should not work with preview mode? If so, it doesn't make sense to me that it does work after navigating to a page that contains a component with fetch in preview mode.

Related issues

• enablePreview not triggering component fetch #8172

[mdoesburg]

Did some digging, and found that if you have fetch on a page it doesn't call fetch on any components on that page:

https://github.com/nuxt/nuxt.js/blob/dev/packages/vue-app/template/App.js#L185-L192

In addition to skipping fetch calls on components if the page already has fetch, if you have a component with fetch and that component has sub components/children with fetch, the fetch methods for those children also wont be called:

https://github.com/nuxt/nuxt.js/blob/dev/packages/vue-app/template/utils.js#L61

@Atinux First off, thanks for the great work! Just wanted to ask if the above behavior is intended, because I would be willing to open a PR to fix it. I got it to work how I wanted locally, but still unsure what is meant by this comment: https://github.com/nuxt/nuxt.js/blob/dev/packages/vue-app/template/utils.js#L61 One of my changes includes removing the continue statement, so it would be great if you could shine some light on what is meant here so I can prevent a breaking change.

[Atinux]

It should indeed re-call the sub-components fetch normally since it should re-render the components.

[mdoesburg]

@Atinux Ok great, thanks for the info! I went and opened a PR: #10489

I know you guys are probably busy with Nuxt 3, but would you, or one of the Nuxt team members be able to look at my PR in the coming week? Would love to be able to refactor/improve/fix it if needed and get a patch released if possible.