Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(plugin-nuxt): mock useNuxtApp #750

Open
wants to merge 13 commits into
base: main
Choose a base branch
from

Conversation

filiphazardous
Copy link
Contributor

Description

This PR introduces the ability to mock, keeping, or exclude parts of the nuxtApp object, as returned from the useNuxtApp composable.

Additional context

A number of tools used in Nuxt components rely on data passed through the nuxtApp object. Among them are @nuxtjs/i18n and @nuxtjs/apollo. For the i18n scenario, current versions of the module do not work at all with Histoire and the HstNuxt plugin. For the apollo scenario, common mocking strategies depend on apollo actually trying to fetch - so the fetch can be intercepted. This doesn't work either.

Instead of taking the big bang approach, and just letting everything through - this approach is an attempt to give the developer a choice of what to include, exclude or mock.

This introduces options for HstNuxt, so the developer can pick and choose.

This fixes #703 (and provides an example for Histoire + Nuxt3 + @nuxtjs/i18n - as well as tests for same).

There is another PR that solves some of the same problems (#710). However, for design system uses - I find that the addition of mocking is useful.


What is the purpose of this pull request?

  • Bug fix
  • New Feature
  • Documentation update
  • Other

Before submitting the PR, please make sure you do the following

  • If it's a new feature, provide a convincing reason to add it. Ideally, you should open a suggestion issue first and have it approved before working on it.
  • Read the Contributing Guidelines.
  • Read the Pull Request Guidelines and follow the Commit Convention.
  • Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
  • Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
  • Ideally, include relevant tests that fail without this PR but pass with it.

Copy link

codesandbox bot commented Aug 2, 2024

Review or Edit in CodeSandbox

Open the branch in Web EditorVS CodeInsiders

Open Preview

Copy link

stackblitz bot commented Aug 2, 2024

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

Copy link

netlify bot commented Aug 2, 2024

Deploy Preview for histoire-controls ready!

Name Link
🔨 Latest commit 183e5a1
🔍 Latest deploy log https://app.netlify.com/sites/histoire-controls/deploys/66b0e462ef7fa10008a207fa
😎 Deploy Preview https://deploy-preview-750--histoire-controls.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Aug 2, 2024

Deploy Preview for histoire-site ready!

Name Link
🔨 Latest commit 183e5a1
🔍 Latest deploy log https://app.netlify.com/sites/histoire-site/deploys/66b0e4622f162d0008e2acd5
😎 Deploy Preview https://deploy-preview-750--histoire-site.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Aug 2, 2024

Deploy Preview for histoire-examples-vue3 ready!

Name Link
🔨 Latest commit 183e5a1
🔍 Latest deploy log https://app.netlify.com/sites/histoire-examples-vue3/deploys/66b0e4624551310008ec9385
😎 Deploy Preview https://deploy-preview-750--histoire-examples-vue3.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Aug 2, 2024

Deploy Preview for histoire-examples-svelte3 ready!

Name Link
🔨 Latest commit 183e5a1
🔍 Latest deploy log https://app.netlify.com/sites/histoire-examples-svelte3/deploys/66b0e46273551f0008ff6362
😎 Deploy Preview https://deploy-preview-750--histoire-examples-svelte3.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@filiphazardous filiphazardous changed the title Feature/mock use nuxt app Feature: mock useNuxtApp Aug 2, 2024
@filiphazardous filiphazardous changed the title Feature: mock useNuxtApp feat: mock useNuxtApp Aug 2, 2024
@filiphazardous filiphazardous changed the title feat: mock useNuxtApp feat(plugin-nuxt): mock useNuxtApp Aug 2, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Bug with i18n and translation in component
1 participant