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(#693): update modules to use @nuxt/kit #697

Open
wants to merge 22 commits into
base: develop
Choose a base branch
from

Conversation

Decipher
Copy link
Member

@Decipher Decipher commented Aug 8, 2024

Types of changes

  • Bug fix (a non-breaking change which fixes an issue)
  • New feature (a non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)

Description

  • All core Druxt modules updated to use @nuxt/kit
  • Node version v18 required
  • Druxt development tools template creator temporarily disabled
  • @nuxt/storybook integration temporarily disabled
    • @nuxt/storybook integration disrupted, it doesn't appear that @nuxt/storybook installs @nuxt/kit based modules.
  • Modules need to be installed as [MODULE_NAME]/nuxt instead of [MODULE_NAME in nuxt.config.js

Checklist:

  • My change requires a change to the documentation.
  • I have updated the documentation accordingly. (PR: #)
  • I have added tests to cover my changes (if not applicable, please state why)
  • All new and existing tests are passing.

Screenshots/Media:

Copy link

changeset-bot bot commented Aug 8, 2024

🦋 Changeset detected

Latest commit: 34ada4d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 10 packages
Name Type
druxt-breadcrumb Minor
druxt-blocks Minor
druxt-entity Minor
druxt-router Minor
druxt-schema Minor
druxt Minor
druxt-views Minor
druxt-menu Minor
druxt-site Minor
druxt-test-utils Major

Not sure what this means? Click here to learn what changesets are.

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

Copy link

coderabbitai bot commented Aug 8, 2024

Walkthrough

This update introduces several new Nuxt.js modules across various packages within the Druxt framework, enhancing integration with Vue.js components and improving configuration management. Key changes include the adoption of the defineNuxtModule approach for defining modules, the addition of default options for various functionalities, and improved integration with Nuxt Storybook for component development. Each module now provides a structured way to configure options like baseUrl and endpoint, ensuring a cohesive setup process for developers.

Changes

File(s) Change Summary
packages/blocks/src/index.js Introduced DruxtBlocksNuxtModule for integrating Vue.js components with configuration options.
packages/breadcrumb/src/nuxt/index.js Added druxt-breadcrumb module for breadcrumb navigation with customizable settings.
packages/druxt/src/nuxt/index.js Transitioned DruxtNuxtModule to use defineNuxtModule for improved configuration management.
packages/entity/src/nuxt/index.js Defined DruxtEntityNuxtModule for integrating DruxtJS with Nuxt application.
packages/menu/src/nuxt/index.js Created DruxtMenuNuxtModule for menu system integration with configuration options.
packages/router/src/nuxt/index.js Updated DruxtRouterNuxtModule to use defineNuxtModule, enhancing routing functionality.
packages/site/src/nuxt/index.js Introduced DruxtSiteNuxtModule for integrating DruxtJS framework with essential configurations.
packages/views/src/nuxt/index.js Modernized DruxtViewsNuxtModule definition using defineNuxtModule for better lifecycle integration.
packages/entity/test/nuxt/index.test.js Added tests for DruxtEntityNuxtModule to validate functionality within a Nuxt.js environment.

Possibly related PRs

Poem

🐇 In the meadow, changes bloom,
A hop and a skip, dispelling gloom.
New paths to tread, with joy we cheer,
With every update, the future is clear!
So let’s dance and sing, oh what a delight,
For Druxt is shining, oh so bright! 🌼✨


Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL

Commits

Files that changed from the base of the PR and between 0828671 and 34ada4d.

Files selected for processing (1)
  • packages/entity/test/nuxt/index.test.js (1 hunks)
Files skipped from review as they are similar to previous changes (1)
  • packages/entity/test/nuxt/index.test.js

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share
Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    -- I pushed a fix in commit <commit_id>, please review it.
    -- Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    -- @coderabbitai generate unit testing code for this file.
    -- @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    -- @coderabbitai generate interesting stats about this repository and render them as a table.
    -- @coderabbitai read src/utils.ts and generate unit testing code.
    -- @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    -- @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

Copy link

codecov bot commented Aug 13, 2024

Codecov Report

Attention: Patch coverage is 97.94344% with 8 lines in your changes missing coverage. Please review.

Project coverage is 96.62%. Comparing base (2600447) to head (34ada4d).

Files with missing lines Patch % Lines
packages/druxt/src/nuxt/index.js 92.64% 5 Missing ⚠️
packages/router/src/nuxt/index.js 89.65% 3 Missing ⚠️
Additional details and impacted files
@@             Coverage Diff             @@
##           develop     #697      +/-   ##
===========================================
- Coverage    96.72%   96.62%   -0.11%     
===========================================
  Files           91       97       +6     
  Lines         2291     2428     +137     
  Branches       511      522      +11     
===========================================
+ Hits          2216     2346     +130     
- Misses          60       67       +7     
  Partials        15       15              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@Decipher Decipher force-pushed the feature/693-nuxt_kit branch 5 times, most recently from 415f8da to 2a0fb42 Compare August 20, 2024 01:03
@Decipher Decipher force-pushed the feature/693-nuxt_kit branch 10 times, most recently from aeb593b to b06a2e2 Compare August 27, 2024 04:12
@Decipher Decipher force-pushed the feature/693-nuxt_kit branch 3 times, most recently from 6993208 to f727731 Compare August 29, 2024 05:35
@Decipher Decipher marked this pull request as ready for review September 2, 2024 04:36
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 9

Outside diff range, codebase verification and nitpick comments (13)
packages/menu/test/index.test.js (1)

1-5: LGTM!

The test case is correctly implemented and follows the best practices.

Consider removing the async keyword from the test case for clarity, as there are no async operations being performed:

-test('Default function', async () => {
+test('Default function', () => {
  expect(() => Default()).toThrow("DruxtMenu Nuxt module must be installed as 'druxt-menu/nuxt'")
})
packages/router/test/index.test.js (1)

1-5: LGTM! The test case is well-structured and tests the error scenario.

The test case follows the AAA (Arrange, Act, Assert) pattern and tests the error scenario, which is a good practice. The error message is clear and informative. The test case is self-contained and doesn't depend on any external state.

Consider removing the async keyword from the test case as there are no asynchronous operations in the test case.

-test('Default function', async () => {
+test('Default function', () => {
  expect(() => Default()).toThrow("DruxtRouter Nuxt module must be installed as 'druxt-router/nuxt'")
})
packages/breadcrumb/src/index.js (1)

15-17: Enforce proper module installation.

The change to the default export is necessary to enforce proper module installation due to breaking changes in the @nuxt/kit update. The error message provides clear instructions on how to install the module correctly.

Consider adding documentation comments to clarify the module's intended use, as the previous documentation comments have been removed. For example:

/**
 * The DruxtBreadcrumb Nuxt module.
 *
 * This module provides breadcrumb functionality for Druxt.
 * It must be installed as 'druxt-breadcrumb/nuxt'.
 *
 * @throws {Error} If the module is not installed correctly.
 */
export default () => {
  throw new Error("DruxtBreadcrumb Nuxt module must be installed as 'druxt-breadcrumb/nuxt'")
}
packages/blocks/test/nuxt/index.test.js (1)

20-25: Improve the test case by adding assertions and covering more scenarios.

The current test case for the Nuxt module setup can be improved in the following ways:

  1. Add assertions to verify the behavior of the setup function. For example, you can assert that the expected hooks are called with the correct arguments.

  2. Cover different scenarios and edge cases to ensure the robustness of the module. For example, you can test scenarios where the druxt options are not provided or have different values.

  3. Provide a more complete representation of the Nuxt module in the mocked nuxtMock object. For example, you can include other relevant properties and methods that are used by the module.

Here's an example of how you can improve the test case:

test('Nuxt module', async () => {
  const mockHook = jest.fn()
  nuxtMock.hook.mockImplementation((hook, fn) => {
    if (hook === 'components:dirs') {
      fn([])
    }
    mockHook(hook)
  })

  nuxtMock.options = {
    druxt: {
      // Add relevant options for testing
    }
  }

  await DruxtBlocksNuxtModule.setup({}, nuxtMock)

  expect(mockHook).toHaveBeenCalledWith('components:dirs')
  // Add more assertions for other hooks and behaviors
})

In this example:

  • The mockHook function is used to track the calls to the hook function and execute the callback with the expected arguments.
  • The druxt options are populated with relevant values for testing.
  • Assertions are added to verify that the expected hooks are called.

By improving the test case, you can ensure that the Nuxt module is properly tested and catch potential issues early in the development process.

packages/breadcrumb/test/nuxt/index.test.js (1)

19-25: LGTM, but consider adding assertions to the test.

The code changes are approved, but the test is not making any assertions. Consider adding some assertions to ensure that the setup method is working as expected.

packages/views/src/index.js (1)

30-32: Update or remove references to the old module DruxtViewsNuxtModule.

The codebase still contains references to the old module DruxtViewsNuxtModule, which may lead to inconsistencies. Ensure that all references are updated to use the new module export or confirm if the old module is needed for backward compatibility testing.

  • packages/views/test/nuxt/index.test.js: Contains imports and usage of DruxtViewsNuxtModule.
  • packages/views/src/nuxt/index.js: Defines and exports DruxtViewsNuxtModule.
Analysis chain

Breaking change: Explicit error handling for incorrect module installation.

The change aligns with the PR objective of integrating the core Druxt modules with the @nuxt/kit package and introduces explicit error handling for incorrect module installation.

Verify the impact of this breaking change on the codebase by running the following script:

Update the documentation and release notes to communicate this breaking change and provide instructions for the correct module installation.

Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: 
# - Verify if the module is imported correctly as 'druxt-views/nuxt' in the codebase.
# - Check if there are any imports of the old 'DruxtViewsNuxtModule'.

# Test 1: Search for correct module import. Expect: At least one occurrence.
rg --type js -g '!*node_modules*' -g '!*dist*' $'\'druxt-views/nuxt\''

# Test 2: Search for old module import. Expect: No occurrences.
rg --type js -g '!*node_modules*' -g '!*dist*' $'DruxtViewsNuxtModule'

Length of output: 775

packages/site/test/nuxt/index.test.js (1)

1-39: LGTM! Consider adding more test cases.

The code changes are approved. The file structure and the test setup look good.

The current test is only checking if the correct number of modules are installed. Consider adding more test cases to check the functionality of the installed modules.

packages/site/README.md (1)

28-28: Inconsistent module path change detected.

The module path change from 'druxt-site' to 'druxt-site/nuxt' has not been fully applied across the codebase and documentation. The old module path is still present in several files, which could lead to confusion or errors. Please update the following files to ensure consistency:

  • JavaScript files:

    • packages/site/templates/druxt-site.stories.js
    • packages/site/src/index.js
    • packages/site/src/nuxt/index.js
    • packages/site/src/mixins/site.js
    • packages/site/src/mixins/index.js
    • packages/site/src/components/DruxtSite.vue
    • examples/_deprecated/router-modes/nuxt.config.js
  • Markdown documentation files:

    • packages/site/CHANGELOG.md
    • docs/nuxt/content/modules/site/README.md
    • docs/nuxt/content/modules/site/getting-started.md
    • docs/nuxt/content/guide/getting-started.md
Analysis chain

Verify the impact of the module path change.

The module path has been updated from 'druxt-site' to 'druxt-site/nuxt'. This change is consistent with the PR summary and the list of alterations.

Please verify the impact of this change on the codebase and documentation by running the following script:

If the tests fail, please update the codebase and documentation accordingly.

Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the impact of the module path change on the codebase and documentation.

# Test 1: Search for the old module path in the codebase. 
# Expect: No occurrences of the old module path.
rg --type js $'\'druxt-site\''

# Test 2: Search for the new module path in the codebase.
# Expect: Occurrences of the new module path in the relevant files.
rg --type js $'\'druxt-site/nuxt\''

# Test 3: Search for the old module path in the documentation.
# Expect: No occurrences of the old module path.
rg --type md $'\'druxt-site\''

# Test 4: Search for the new module path in the documentation.
# Expect: Occurrences of the new module path in the relevant files.
rg --type md $'\'druxt-site/nuxt\''

Length of output: 1328

packages/breadcrumb/README.md (1)

26-26: Inconsistency in module path documentation.

The module path has been updated to 'druxt-breadcrumb/nuxt' in packages/breadcrumb/README.md, but the old path 'druxt-breadcrumb' is still present in other documentation files. Please update the following locations to ensure consistency:

  • docs/nuxt/content/modules/breadcrumb/README.md: Update the module path to 'druxt-breadcrumb/nuxt'.

The presence of the old path in CHANGELOG.md may be acceptable if it refers to historical changes, but ensure that all current documentation reflects the new module path for accurate user guidance.

Analysis chain

Update to the module path in the configuration example.

The module path has been changed from 'druxt-breadcrumb' to 'druxt-breadcrumb/nuxt'. This change suggests a more specific import path for the module, likely indicating that the module has been restructured or that the intended usage now requires this more explicit reference.

Please note that this change may affect how users configure the module in their nuxt.config.js, potentially impacting the module's integration within Nuxt.js applications.

Verify if the documentation is up-to-date with this change. Run the following script to check for any inconsistencies:

Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the documentation is up-to-date with the module path change.

# Test 1: Search for the old module path. Expect: No occurrences.
rg --type markdown $'\'druxt-breadcrumb\''

# Test 2: Search for the new module path. Expect: Only occurrences in relevant sections.
rg --type markdown $'\'druxt-breadcrumb/nuxt\''

Length of output: 338

packages/menu/src/nuxt/index.js (1)

29-79: LGTM!

The code changes are approved.

Please remember to uncomment the Nuxt Storybook integration (lines 75-77) once the compatibility issues between @nuxt/kit and @nuxt/storybook are resolved.

packages/schema/src/nuxt/index.js (1)

41-99: Remove the async keyword from the setup function.

The setup function is marked as async, but it doesn't use await anywhere. This can be misleading.

Apply this diff to remove the async keyword:

-  async setup(moduleOptions, nuxt) {
+  setup(moduleOptions, nuxt) {
packages/router/src/nuxt/index.js (1)

86-86: Suggestion: Optional chaining.

The static analysis tool suggests changing the code at line 86 to use optional chaining. However, the current code using the logical OR operator to check for the existence of the href property and provide a fallback empty object is valid and does not introduce any errors or issues.

Changing to optional chaining is a matter of personal preference and coding style. The current code is acceptable, and the suggestion can be considered a nitpick.

Tools
Biome

[error] 86-86: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

packages/druxt/test/nuxt/index.test.js (1)

137-137: Consider using an undefined assignment instead of the delete operator.

The static analysis tool has flagged the use of the delete operator as a potential performance issue. While it may not have a significant impact in a test environment, it is still a good practice to follow the recommendation.

Apply this diff to use an undefined assignment instead of the delete operator:

-delete nuxtMock.options.proxy
+nuxtMock.options.proxy = undefined
Tools
Biome

[error] 137-137: Avoid the delete operator which can impact performance.

Unsafe fix: Use an undefined assignment instead.

(lint/performance/noDelete)

Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

Commits

Files that changed from the base of the PR and between 2600447 and 6e2cd96.

Files ignored due to path filters (3)
  • examples/druxt-site/yarn.lock is excluded by !**/yarn.lock, !**/*.lock
  • packages/site/test/nuxt/__snapshots__/storybook.test.js.snap is excluded by !**/*.snap
  • yarn.lock is excluded by !**/yarn.lock, !**/*.lock
Files selected for processing (80)
  • .changeset/forty-jeans-attack.md (1 hunks)
  • .circleci/config.yml (2 hunks)
  • .nvmrc (1 hunks)
  • docs/nuxt/.nvmrc (1 hunks)
  • examples/druxt-site/nuxt.config.js (1 hunks)
  • examples/druxt-site/package.json (1 hunks)
  • package.json (2 hunks)
  • packages/blocks/README.md (1 hunks)
  • packages/blocks/package.json (1 hunks)
  • packages/blocks/src/components/DruxtBlock.vue (4 hunks)
  • packages/blocks/src/components/DruxtBlockRegion.vue (3 hunks)
  • packages/blocks/src/index.js (2 hunks)
  • packages/blocks/src/nuxt/index.js (1 hunks)
  • packages/blocks/src/nuxt/storybook.js (2 hunks)
  • packages/blocks/test/index.test.js (1 hunks)
  • packages/blocks/test/nuxt/index.test.js (1 hunks)
  • packages/blocks/test/nuxt/storybook.test.js (1 hunks)
  • packages/breadcrumb/README.md (1 hunks)
  • packages/breadcrumb/package.json (1 hunks)
  • packages/breadcrumb/src/components/DruxtBreadcrumb.vue (2 hunks)
  • packages/breadcrumb/src/index.js (2 hunks)
  • packages/breadcrumb/src/nuxt/index.js (1 hunks)
  • packages/breadcrumb/test/index.test.js (1 hunks)
  • packages/breadcrumb/test/nuxt/index.test.js (1 hunks)
  • packages/druxt/package.json (2 hunks)
  • packages/druxt/src/components/Druxt.vue (1 hunks)
  • packages/druxt/src/components/DruxtDevelTemplate.vue (2 hunks)
  • packages/druxt/src/components/DruxtModule.vue (12 hunks)
  • packages/druxt/src/index.js (3 hunks)
  • packages/druxt/src/nuxt/index.js (2 hunks)
  • packages/druxt/test/index.test.js (1 hunks)
  • packages/druxt/test/nuxt/index.test.js (4 hunks)
  • packages/entity/README.md (1 hunks)
  • packages/entity/package.json (1 hunks)
  • packages/entity/src/index.js (2 hunks)
  • packages/entity/src/nuxt/index.js (1 hunks)
  • packages/entity/src/nuxt/storybook.js (2 hunks)
  • packages/entity/test/index.test.js (1 hunks)
  • packages/entity/test/nuxt/index.test.js (1 hunks)
  • packages/entity/test/nuxt/storybook.test.js (1 hunks)
  • packages/menu/README.md (1 hunks)
  • packages/menu/package.json (1 hunks)
  • packages/menu/src/components/DruxtMenu.vue (1 hunks)
  • packages/menu/src/index.js (3 hunks)
  • packages/menu/src/nuxt/index.js (1 hunks)
  • packages/menu/src/nuxt/storybook.js (2 hunks)
  • packages/menu/test/index.test.js (1 hunks)
  • packages/menu/test/nuxt/index.test.js (1 hunks)
  • packages/menu/test/nuxt/storybook.test.js (1 hunks)
  • packages/router/package.json (1 hunks)
  • packages/router/src/components/DruxtRouter.vue (3 hunks)
  • packages/router/src/index.js (1 hunks)
  • packages/router/src/nuxt/index.js (2 hunks)
  • packages/router/src/router.js (1 hunks)
  • packages/router/test/index.test.js (1 hunks)
  • packages/router/test/nuxt/index.test.js (1 hunks)
  • packages/schema/README.md (1 hunks)
  • packages/schema/package.json (1 hunks)
  • packages/schema/src/index.js (2 hunks)
  • packages/schema/src/nuxt/index.js (1 hunks)
  • packages/schema/test/index.test.js (1 hunks)
  • packages/schema/test/nuxt/index.test.js (1 hunks)
  • packages/site/README.md (1 hunks)
  • packages/site/package.json (1 hunks)
  • packages/site/src/components/DruxtSite.vue (3 hunks)
  • packages/site/src/index.js (2 hunks)
  • packages/site/src/nuxt/index.js (1 hunks)
  • packages/site/src/nuxt/storybook.js (2 hunks)
  • packages/site/test/index.test.js (1 hunks)
  • packages/site/test/nuxt/index.test.js (1 hunks)
  • packages/site/test/nuxt/storybook.test.js (1 hunks)
  • packages/views/README.md (1 hunks)
  • packages/views/package.json (1 hunks)
  • packages/views/src/components/DruxtView.vue (7 hunks)
  • packages/views/src/index.js (2 hunks)
  • packages/views/src/nuxt/index.js (2 hunks)
  • packages/views/src/nuxt/storybook.js (1 hunks)
  • packages/views/test/index.test.js (1 hunks)
  • packages/views/test/nuxt/index.test.js (1 hunks)
  • packages/views/test/nuxt/storybook.test.js (1 hunks)
Files skipped from review due to trivial changes (5)
  • packages/entity/README.md
  • packages/entity/src/nuxt/storybook.js
  • packages/menu/src/nuxt/storybook.js
  • packages/schema/README.md
  • packages/views/README.md
Additional context used
GitHub Check: codecov/patch
packages/blocks/src/nuxt/index.js

[warning] 63-63: packages/blocks/src/nuxt/index.js#L63
Added line #L63 was not covered by tests

packages/entity/src/nuxt/index.js

[warning] 68-68: packages/entity/src/nuxt/index.js#L68
Added line #L68 was not covered by tests

packages/router/src/nuxt/index.js

[warning] 80-81: packages/router/src/nuxt/index.js#L80-L81
Added lines #L80 - L81 were not covered by tests


[warning] 89-89: packages/router/src/nuxt/index.js#L89
Added line #L89 was not covered by tests

packages/druxt/src/nuxt/index.js

[warning] 143-143: packages/druxt/src/nuxt/index.js#L143
Added line #L143 was not covered by tests


[warning] 153-154: packages/druxt/src/nuxt/index.js#L153-L154
Added lines #L153 - L154 were not covered by tests


[warning] 158-159: packages/druxt/src/nuxt/index.js#L158-L159
Added lines #L158 - L159 were not covered by tests


[warning] 163-163: packages/druxt/src/nuxt/index.js#L163
Added line #L163 was not covered by tests

Biome
packages/router/src/nuxt/index.js

[error] 66-66: The assignment should not be in an expression.

The use of assignments in expressions is confusing.
Expressions are often considered as side-effect free.

(lint/suspicious/noAssignInExpressions)


[error] 86-86: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

packages/druxt/test/nuxt/index.test.js

[error] 137-137: Avoid the delete operator which can impact performance.

Unsafe fix: Use an undefined assignment instead.

(lint/performance/noDelete)

packages/druxt/src/nuxt/index.js

[error] 79-79: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 84-84: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

Additional comments not posted (173)
.nvmrc (1)

1-1: Verify the impact of upgrading the Node.js version on the project's dependencies.

Upgrading the Node.js version can introduce breaking changes and compatibility issues with dependencies.

Run the following script to verify the compatibility of the project's dependencies with the new Node.js version:

Please address any issues identified by the script and ensure the compatibility of the project's dependencies with the new Node.js version.

packages/druxt/test/index.test.js (1)

1-5: LGTM!

The test case is correctly implemented and follows the best practices for writing unit tests in Jest. It ensures that the module is correctly installed and used, and the error message is clear and informative.

packages/site/test/index.test.js (1)

1-5: LGTM!

The test case is correctly implemented and is ensuring that the default function throws an error when the module is not installed correctly.

packages/views/test/index.test.js (1)

1-5: LGTM!

The test case is well-written and follows the best practices for writing unit tests in Jest. It tests the error scenario, which is a good practice to ensure the module is used correctly. The test case is self-contained and has a clear and concise description that accurately describes the expected behavior.

packages/blocks/test/index.test.js (1)

1-5: LGTM!

The test case is correctly written and tests the expected behavior of the default export.

packages/entity/test/index.test.js (1)

1-5: LGTM!

The test case is correctly written and ensures that the module is not directly invoked and must be installed as a Nuxt module. The error message is clear and informative.

packages/schema/test/index.test.js (1)

3-5: LGTM!

The test case is correctly implemented and follows the best practices for writing unit tests in Jest. It tests the error scenario, which is a good practice to ensure the module is used correctly. The test case is small and focused, which makes it easy to understand and maintain.

packages/breadcrumb/test/index.test.js (1)

1-5: LGTM!

The test case is correctly implemented and tests the expected behavior of the default export.

Additional insights:

  • The test case expects the default export to throw an error with a specific message.
  • The error message in the test case indicates that the module must be installed as 'druxt-breadcrumb/nuxt'.
packages/views/test/nuxt/storybook.test.js (1)

5-7: LGTM!

The mock for the @nuxt/kit module is correctly implemented and follows the Jest mocking syntax. It enhances the test setup by improving isolation and control over the test scenarios.

packages/blocks/test/nuxt/storybook.test.js (2)

1-1: LGTM!

The import path change for the DruxtBlocksStorybook component is consistent with the file's location and the component's new location.


5-7: LGTM!

The mocking of the @nuxt/kit module and the addTemplate function is a valid approach to control the testing environment and isolate the component under test. The mocked implementation is sufficient for the purpose of this test file.

packages/entity/test/nuxt/storybook.test.js (2)

1-1: LGTM!

The import path for DruxtEntityStorybook has been correctly updated to match the new location of the storybook.js file.


5-7: LGTM!

The mocking of the @nuxt/kit module has been correctly implemented, allowing for more controlled testing of components that depend on @nuxt/kit.

packages/menu/test/nuxt/storybook.test.js (2)

1-1: LGTM!

The updated import path for DruxtMenuStorybook looks good.


5-7: LGTM!

Mocking the @nuxt/kit module with the addTemplate function is a good enhancement to the test setup. It allows for more controlled testing of components that depend on the @nuxt/kit functionalities.

packages/entity/src/index.js (1)

12-19: LGTM!

The code changes are approved for the following reasons:

  • The error message clearly communicates the issue and provides the correct way to install the module.
  • This change is necessary to handle the breaking changes introduced by @nuxt/kit.
  • The comments provide context for this change.
packages/site/test/nuxt/storybook.test.js (2)

2-2: LGTM!

The updated import path for the DruxtEntityStorybook component is consistent with the directory restructuring mentioned in the AI-generated summary.


6-8: LGTM!

The mocking of the @nuxt/kit module with the addTemplate function is consistent with the AI-generated summary and allows for more controlled testing of components that depend on the @nuxt/kit functionalities.

packages/breadcrumb/test/nuxt/index.test.js (2)

1-2: LGTM!

The code changes are approved.


3-17: LGTM!

The code changes are approved.

packages/entity/test/nuxt/index.test.js (3)

1-2: LGTM!

The code changes are approved.


3-4: LGTM!

The code changes are approved.


5-19: LGTM!

The code changes are approved.

.changeset/forty-jeans-attack.md (1)

1-26: LGTM!

The changeset file is well-structured and follows the changeset format. The file provides a clear description of the changes made in the PR and the semver bump type for each package.

examples/druxt-site/package.json (3)

15-15: Verify the impact of the Nuxt version change on the project.

The version of the nuxt dependency has been changed from "latest" to "2". This change may affect compatibility with other packages that rely on a specific version of Nuxt.

Run the following script to verify the impact of the version change:


19-19: Verify the impact of the @nuxtjs/storybook version change on the project.

The version of the @nuxtjs/storybook dependency has been changed from "latest" to "4". This change may include breaking changes or new features compared to the previous version.

Run the following script to verify the impact of the version change:


22-25: Verify the impact of the new resolutions section on the project.

The newly added resolutions section specifies exact versions for vue, vue-server-renderer, and vue-template-compiler, all set to "^2.7". This addition ensures that these packages will resolve to compatible versions, potentially addressing issues related to version mismatches in the dependency tree.

Run the following script to verify the impact of the new resolutions section:

packages/views/test/nuxt/index.test.js (5)

1-1: LGTM!

The simplified import statement for DruxtViewsNuxtModule aligns with the updated module structure and functionality.


5-9: LGTM!

The updated mocking strategy for @nuxt/kit aligns with the module's functionality and focuses on the required functions for the test case.


11-11: LGTM!

The import statement for addPluginTemplate and installModule aligns with the updated mocking strategy and their usage in the test case.


13-21: LGTM!

The nuxtMock object provides a streamlined mock structure for the test case, and the mocked hook method ensures that the test can simulate the required Nuxt hooks and their arguments.


25-27: LGTM!

The updated test case, which calls DruxtViewsNuxtModule.setup and checks the invocation of installModule and addPluginTemplate, aligns with the changes in the module's structure and functionality.

packages/site/src/index.js (1)

27-33: Breaking change: Default export updated to throw an error for incorrect module installation.

The default export has been updated to throw an error if the module is not installed correctly. This change is in response to updates in the Nuxt.js framework and enforces correct usage of the module.

Key points:

  • The error message provides clear instructions on how to correctly install the module as 'druxt-site/nuxt'.
  • The change alters the control flow by ensuring that any attempt to use the module without the correct setup will result in an immediate error, thereby preventing further execution and potential misconfiguration.
  • The comments provide additional context about the change being a part of the @nuxt/kit update and a breaking change.

This is a good change that improves the developer experience by providing clear feedback on incorrect usage and preventing potential issues.

packages/menu/src/index.js (1)

32-39: LGTM!

The code changes are approved for the following reasons:

  • The default export has been modified to throw an error if the module is not installed correctly, which enhances error handling.
  • The error message provides clear instructions on how to install the module correctly.
  • The documentation comments provide helpful context on the rationale for this change.
packages/druxt/src/components/DruxtDevelTemplate.vue (4)

23-23: LGTM!

The change to use optional chaining when accessing $parent.component.options improves the safety and readability of the code by preventing potential runtime errors if $parent.component is undefined.


25-25: LGTM!

The change to use optional chaining in the fallback logic for module ensures that if $parent.$parent is not defined, it will not throw an error. This improves the safety and readability of the code.


26-26: LGTM!

The change to use optional chaining when accessing module.component.options in the options computed property provides a more robust way to handle cases where module might not have the expected structure. This improves the safety and readability of the code.


45-45: LGTM!

The change to use optional chaining when accessing this.module.$options.druxt.template in the spread operator improves the resilience of the code against undefined values. This improves the safety and readability of the code.

packages/blocks/src/index.js (1)

32-39: Breaking change: Enforce correct module installation.

The new default export is a breaking change that enforces correct module installation by throwing an error if the module is not installed as 'druxt-blocks/nuxt'. This change is attributed to updates in the @nuxt/kit package.

The error message provides clear instructions for correct module installation, and the JSDoc comment provides sufficient context for this change.

Verify the impact of this change on the codebase by running the following script:

packages/druxt/src/index.js (1)

35-41: LGTM!

The change to the default export is a good improvement. It provides immediate feedback to the user if the module is not installed correctly and the error message provides clear instructions on how to correctly install the module.

The associated documentation comments provide helpful context for the change.

packages/schema/package.json (3)

33-34: LGTM!

The new entry for ./nuxt in the exports field is approved.


40-40: LGTM!

The addition of the nuxt directory to the files array is approved.


44-44: LGTM!

The addition of the @nuxt/kit dependency is approved.

packages/breadcrumb/package.json (4)

36-37: LGTM!

The new entry in the exports field enhances the module's functionality by allowing it to be utilized within a Nuxt.js environment.


43-43: LGTM!

Adding the nuxt directory to the files array ensures that the new Nuxt integration is packaged correctly when the module is distributed.


47-47: LGTM!

The @nuxt/kit dependency has been introduced with a version specification of ^3.12.2, which suggests that the module now relies on this package for its integration with Nuxt.js.


49-49: LGTM!

The version of druxt-blocks has been incremented from ^0.17.1 to ^0.17.2, indicating a minor update that may include bug fixes or new features.

packages/entity/package.json (4)

38-38: LGTM!

The code change is approved.


39-39: LGTM!

The code change is approved.


45-45: LGTM!

The code change is approved.


49-49: LGTM!

The code change is approved.

packages/blocks/package.json (3)

36-37: LGTM!

The code changes are approved. The addition of the "nuxt/*" path under the "exports" section enhances the package's modularity by explicitly defining the export of Nuxt components alongside existing component exports.


43-43: LGTM!

The code changes are approved. The addition of "nuxt" to the "files" array is consistent with the addition of the "nuxt/*" path under the "exports" section and ensures that the "nuxt" directory is included in the package's distribution.


47-47: LGTM!

The code changes are approved. The addition of the "@nuxt/kit" dependency with a specified version reflects an integration with Nuxt.js tooling and is consistent with the other changes related to Nuxt.js integration.

packages/menu/package.json (3)

36-37: LGTM!

The new entries in the exports field enhance the module's capabilities and clarify its structure for users.


43-43: LGTM!

The addition of "nuxt" to the files array is consistent with the new entry for "./nuxt" in the exports field.


47-47: Verify the usage of @nuxt/kit in the codebase.

The addition of "@nuxt/kit" as a dependency suggests an integration with Nuxt.js features or utilities. Please ensure that the package is being used correctly in the codebase.

Run the following script to verify the usage of @nuxt/kit:

Verification successful

The usage of @nuxt/kit is verified and consistent across the codebase.

The @nuxt/kit package is actively used in various parts of the codebase, including both implementation and test files. The functions imported from this package align with typical Nuxt.js usage patterns, confirming its appropriate integration.

  • Files where @nuxt/kit is used include:
    • packages/menu/src/nuxt/index.js
    • packages/menu/src/nuxt/storybook.js
    • packages/menu/test/nuxt/index.test.js
    • And several others across different packages.
Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the usage of `@nuxt/kit` in the codebase.

# Test: Search for the import statements of `@nuxt/kit`. Expect: At least one occurrence.
rg --type js $'from \'@nuxt/kit\''

Length of output: 2040

packages/menu/test/nuxt/index.test.js (1)

23-44: LGTM!

The test suite is well-structured and covers the important aspects of the Nuxt module. The mocks are set up correctly and the test cases are clear and concise.

packages/views/package.json (3)

35-36: LGTM!

The code changes are approved. The new entry for the ./nuxt path, linking it to ./nuxt/index.js, indicates an enhancement in the package's structure to include Nuxt.js support.


42-42: LGTM!

The code changes are approved. Adding "nuxt" to the files array suggests that the nuxt directory will now be part of the package distribution.


46-46: LGTM!

The code changes are approved. Adding a new dependency on @nuxt/kit with a specified version indicates that the package now relies on this library, likely for improved integration with Nuxt.js.

packages/schema/src/index.js (1)

51-53: LGTM!

The code changes are approved for the following reasons:

  • The error-throwing function serves as a safeguard to ensure that the module is installed correctly.
  • The comments provide sufficient context about the reason for the change, mentioning that it was added due to breaking changes in the @nuxt/kit update.
  • There are no apparent issues or inconsistencies in the code segment.
packages/site/package.json (4)

36-37: LGTM!

The code changes are approved.


37-37: LGTM!

The code changes are approved. The new export for the Nuxt module enhances the module's usability and integration with Nuxt.js applications.


43-43: LGTM!

The code changes are approved. Adding "nuxt" to the "files" array ensures that the Nuxt-related files are part of the package distribution, facilitating easier access for consumers of the package.


47-47: LGTM!

The code changes are approved.

  • The addition of "@nuxt/kit" as a new dependency likely provides essential tools or functionalities for working with Nuxt.js, enhancing the overall capabilities of the package.
  • The version update of "druxt-blocks" from "^0.17.1" to "^0.17.2" indicates a minor update that may include bug fixes or improvements.

Also applies to: 50-50

packages/site/src/nuxt/storybook.js (2)

1-1: LGTM!

The import statement change is approved. Importing addTemplate from @nuxt/kit package directly may improve clarity and maintainability.


1-1: LGTM!

The removal of addTemplate destructuring from this is approved. It is consistent with the change to import addTemplate directly from @nuxt/kit package and makes the control flow more explicit.

packages/schema/test/nuxt/index.test.js (2)

32-44: LGTM!

The "Default" test case is correctly implemented and tests the expected behavior of the Nuxt module.


46-52: LGTM!

The "No schemas" test case is correctly implemented and tests the expected behavior of the Nuxt module when no schemas are available.

packages/router/src/index.js (1)

66-68: LGTM!

The new default export function serves as a helpful safeguard against incorrect module installation. It provides a clear error message to guide users in installing the DruxtRouter Nuxt module correctly.

This change aligns with the goal of improving the user experience by providing informative feedback on misconfigurations. It enhances the robustness of the module without introducing any apparent issues or edge cases.

packages/druxt/package.json (3)

32-32: LGTM!

The code change is approved.


41-41: LGTM!

The code change is approved.


45-45: LGTM!

The code change is approved.

packages/router/test/nuxt/index.test.js (5)

1-1: LGTM!

The import path change for DruxtRouterNuxtModule is approved.


3-9: LGTM!

The changes to the mock functions for the @nuxt/kit module are approved.


11-11: LGTM!

The import statement for the mock functions is approved.


13-21: LGTM!

The nuxtMock object is approved.


23-54: LGTM!

The changes to the test suite are approved. The updates align with the new module structure and mocking strategy.

packages/breadcrumb/src/nuxt/index.js (4)

1-2: LGTM!

The code changes are approved.


4-24: LGTM!

The code changes are approved.


25-53: LGTM!

The code changes are approved.


67-67: LGTM!

The code changes are approved.

packages/blocks/src/nuxt/index.js (4)

27-35: Module definition and setup look good!

The module is correctly defined using defineNuxtModule from @nuxt/kit, with proper meta and default options specified.


45-53: Handling of module options and defaults is properly implemented.

The setup function correctly merges the module options with the Nuxt.js config options under the druxt key, providing flexibility in module configuration.


59-68: Registration of components is properly implemented. Storybook integration is temporarily disabled.

The module correctly registers component directories using the components:dirs hook.

The storybook integration is set up using the storybook:config hook, but it's currently disabled due to compatibility issues with @nuxt/kit and @nuxt/storybook. This is understandable given the circumstances.

Tools
GitHub Check: codecov/patch

[warning] 63-63: packages/blocks/src/nuxt/index.js#L63
Added line #L63 was not covered by tests


63-63: Lack of test coverage for line 63 is not a critical issue.

The static analysis hint indicates that line 63, which is the closing brace for the storybook:config hook callback function, is not covered by tests.

However, this is likely a false positive reported by the tool, as the lack of test coverage for the closing brace is not a critical issue in this context.

Tools
GitHub Check: codecov/patch

[warning] 63-63: packages/blocks/src/nuxt/index.js#L63
Added line #L63 was not covered by tests

packages/views/src/nuxt/index.js (4)

27-34: LGTM!

The code changes are approved. Using defineNuxtModule enhances the module's integration with Nuxt's module system. The meta and defaults properties provide module metadata and default options, which improves the module's configuration and setup.


36-45: LGTM!

The code changes are approved. Encapsulating the setup logic within an async setup function improves the clarity of the module's initialization process. Using optional chaining for handling options ensures that the code is more robust against undefined values.


48-59: LGTM!

The code changes are approved. The updated path for registering component directories reflects a new path structure, moving from a relative path to a distribution folder. Using installModule for adding dependent modules aligns with the new module definition style.


61-66: LGTM!

The code changes are approved. Using addPluginTemplate for adding the Vuex plugin aligns with the new module definition style.

packages/menu/src/nuxt/index.js (2)

1-3: LGTM!

The code changes are approved.


81-81: LGTM!

The code changes are approved.

packages/entity/src/nuxt/index.js (2)

29-39: LGTM!

The module options and defaults are correctly set.


41-77: LGTM!

The setup function is correctly implemented.

Tools
GitHub Check: codecov/patch

[warning] 68-68: packages/entity/src/nuxt/index.js#L68
Added line #L68 was not covered by tests

packages/views/src/nuxt/storybook.js (2)

8-8: The removal of addTemplate from the destructuring assignment is acceptable.

The change does not affect the functionality of the code, as addTemplate is still imported at the top of the file and used later in the function. The removal may have been done for consistency or readability purposes.


1-1: Verify the usage of addTemplate in the function.

Ensure that addTemplate is being used correctly after removing it from the destructuring assignment.

Run the following script to verify the usage of addTemplate:

Also applies to: 46-50, 60-64

Verification successful

Verification Successful: addTemplate is used correctly.

The addTemplate function is used appropriately in the packages/views/src/nuxt/storybook.js file. Both instances of its usage are correctly structured with the necessary parameters. No issues were found with its usage after the import statement.

  • Lines 46-50: addTemplate is used with druxt-views.stories.js.
  • Lines 60-64: addTemplate is used with druxt-views.instance.stories.js.
Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the usage of `addTemplate` in the function.

# Test: Search for the usage of `addTemplate`. Expect: Two occurrences in the correct locations.
rg --type js -A 5 $'addTemplate\(' packages/views/src/nuxt/storybook.js

Length of output: 551

packages/blocks/src/nuxt/storybook.js (1)

12-12: Verify the import and usage of addTemplate.

The destructuring assignment has been modified to remove addTemplate, but the function still relies on it being available in its scope.

Please verify that:

  1. addTemplate is still being imported correctly from the @nuxt/kit module.
  2. There are no unintended side effects of this change, such as addTemplate being undefined or the function behaving differently.

You can use the following script to search for the import statement and the usage of addTemplate:

Verification successful

Verification successful: addTemplate is correctly imported and used.

The addTemplate function is still being imported from @nuxt/kit and used within the packages/blocks/src/nuxt/storybook.js file. The removal from the destructuring assignment does not cause any issues. No unintended side effects were found.

  • addTemplate is imported correctly in packages/blocks/src/nuxt/storybook.js.
  • addTemplate is used multiple times within the file.
Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the import and usage of `addTemplate`.

# Test: Search for the import statement. Expect: A single import statement from `@nuxt/kit`.
rg --type js -A 1 $'import \{ addTemplate \} from \'@nuxt/kit\''

# Test: Search for the usage of `addTemplate`. Expect: Multiple occurrences within the function body.
rg --type js -A 5 $'addTemplate\('

Length of output: 10141

packages/site/src/nuxt/index.js (5)

1-4: LGTM!

The imports are correctly used in the file.


6-23: LGTM!

The JSDoc comment accurately describes the purpose of the Nuxt module, and the module is correctly defined using defineNuxtModule with appropriate metadata and default options.


25-80: The setup function looks good overall, but there are a few things to clarify.

  1. The comments about preventing the "FATAL: Cannot determine nuxt version!" and "FATAL: nuxt.options._layers is not iterable" errors are unclear. Please provide more context or links to the relevant issues to help future maintainers understand the purpose of these lines.

  2. The Storybook integration is commented out with a TODO comment indicating that @nuxt/kit and @nuxt/storybook are not compatible. Please provide more information about this issue and the plan to address it. Consider creating a GitHub issue to track this problem if one doesn't already exist.


83-83: LGTM!

The Nuxt module is correctly exported using export default.


85-90: The JSDoc comment looks good, but please verify the referenced typedef file.

The JSDoc comment correctly describes the ModuleOptions type, but the referenced typedef file (./typedefs/moduleOptions) is not provided in the review context. Please verify that this file exists and contains the correct type definition for ModuleOptions.

examples/druxt-site/nuxt.config.js (2)

8-8: LGTM!

The code change is approved. Providing more verbose output during compilation can indeed assist developers in debugging.


12-12: Verify the updated module path and the application's functionality.

Please ensure that:

  1. The updated module path 'druxt-site/nuxt' is correct.
  2. The application still functions as expected with this change.

Run the following script to verify the module path and the application's functionality:

packages/blocks/README.md (1)

28-28: Verify the impact of the module path change and update the documentation.

The module path for druxt-blocks has been changed from 'druxt-blocks' to 'druxt-blocks/nuxt' in the Nuxt.js configuration example.

Please verify the impact of this change on the application and ensure that the module is imported and utilized correctly with the new path.

Run the following script to verify the usage of the druxt-blocks module:

Also, ensure that the documentation is updated to reflect any changes in the usage or configuration of the module due to the new path.

packages/menu/README.md (1)

26-26: LGTM!

The code change updates the module path for druxt-menu to a more specific path druxt-menu/nuxt. This change is consistent with the PR summary and is unlikely to introduce any issues.

packages/schema/src/nuxt/index.js (1)

1-4: LGTM!

The code changes are approved.

packages/druxt/src/components/Druxt.vue (1)

132-132: LGTM!

The introduction of optional chaining (?.) to the this.module property is a good change that improves the resilience of the component's logic. It ensures that if this.module is null or undefined, the split method won't be called, thus preventing potential runtime errors.

Optional chaining is a relatively new JavaScript feature that allows safe access to nested object properties, even if an intermediate property doesn't exist. It's a concise and expressive way to handle potential null or undefined values in object property chains.

This change aligns with best practices for defensive programming and error handling.

package.json (3)

62-62: LGTM!

The addition of node-gyp to devDependencies is approved.


72-72: LGTM!

The addition of "packageManager": "yarn@3.8.5" is approved.


73-77: LGTM!

The addition of the "resolutions" section is approved.

.circleci/config.yml (2)

6-6: Verify codebase compatibility with Node.js v20.14.

Upgrading to a newer Node.js version can provide benefits such as performance improvements, new features, and security patches.

Ensure that the codebase is compatible with Node.js v20.14 by running the following script:


87-87: Verify testing dependencies and configurations compatibility with Ubuntu 22.04.

Upgrading to a newer Ubuntu version can enhance compatibility and performance for the testing processes.

Ensure that the testing dependencies and configurations are compatible with Ubuntu 22.04 by running the following script:

packages/router/src/nuxt/index.js (10)

31-31: LGTM!

The refactor to use defineNuxtModule from @nuxt/kit is a valid change and follows the best practices for defining Nuxt modules.


40-146: Refactor of the module setup.

The setup function has been refactored to use the new module definition syntax provided by @nuxt/kit. It performs various tasks to set up the Druxt router and integrate it with Nuxt.

Let's review the sub-tasks within the setup function in more detail.

Tools
Biome

[error] 66-66: The assignment should not be in an expression.

The use of assignments in expressions is confusing.
Expressions are often considered as side-effect free.

(lint/suspicious/noAssignInExpressions)


[error] 86-86: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

GitHub Check: codecov/patch

[warning] 80-81: packages/router/src/nuxt/index.js#L80-L81
Added lines #L80 - L81 were not covered by tests


[warning] 89-89: packages/router/src/nuxt/index.js#L89
Added line #L89 was not covered by tests


41-50: Setting default options.

The code correctly sets default options for the module by merging the module options with the Nuxt options and setting default values for baseUrl and endpoint.


53-54: Adding dependent modules.

The code correctly adds the druxt/nuxt module as a dependent module using the installModule function from @nuxt/kit.


56-59: Registering component directories.

The code correctly registers the component directory of the module using the components:dirs hook.


61-115: Setting up the Druxt router.

The code correctly sets up the Druxt router by adding a custom wildcard route. It checks the wildcard option and performs various tasks accordingly, such as fetching languages from the Drupal API and adding routes per language.

Let's investigate the potential issue reported by static analysis tools at line 66.

Tools
Biome

[error] 66-66: The assignment should not be in an expression.

The use of assignments in expressions is confusing.
Expressions are often considered as side-effect free.

(lint/suspicious/noAssignInExpressions)


[error] 86-86: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

GitHub Check: codecov/patch

[warning] 80-81: packages/router/src/nuxt/index.js#L80-L81
Added lines #L80 - L81 were not covered by tests


[warning] 89-89: packages/router/src/nuxt/index.js#L89
Added line #L89 was not covered by tests


66-66: False positive: Assignment in expression.

The static analysis tool reports an error for the assignment in the expression at line 66. However, assigning a function to nuxt.options.build.createRoutes is a valid way to customize the route creation in Nuxt. The assignment is intentionally used within an expression to conditionally modify the createRoutes option.

This static analysis hint can be dismissed as a false positive.

Tools
Biome

[error] 66-66: The assignment should not be in an expression.

The use of assignments in expressions is confusing.
Expressions are often considered as side-effect free.

(lint/suspicious/noAssignInExpressions)


117-122: Adding plugin template.

The code correctly adds the Druxt router plugin template using the addPluginTemplate function from @nuxt/kit.


124-134: Adding store plugin template and enabling Vuex store.

The code correctly adds the Druxt router store plugin template using the addPluginTemplate function from @nuxt/kit. It also enables the Vuex store by setting nuxt.options.store to true, which is necessary for the Druxt router to function properly.


136-145: Nuxt Storybook integration (commented out).

The code segment for setting up the Nuxt Storybook integration is currently commented out. The TODO note indicates that there are compatibility issues between @nuxt/kit and @nuxt/storybook that need to be addressed in the future.

Resolving the compatibility issues and enabling the Nuxt Storybook integration would be beneficial for the development and testing of the Druxt router components.

packages/druxt/test/nuxt/index.test.js (4)

3-4: LGTM!

The code changes are approved.


5-10: LGTM!

The code changes are approved.


18-29: LGTM!

The code changes are approved.


40-45: LGTM!

The code changes are approved.

Also applies to: 48-56, 63-65, 69-71, 77-89, 93-98, 103-120, 124-144, 148-186

packages/breadcrumb/src/components/DruxtBreadcrumb.vue (4)

78-78: LGTM!

The code change is approved.


79-79: LGTM!

The code change is approved.


106-106: LGTM!

The code change is approved.


108-108: LGTM!

The code change is approved.

packages/site/src/components/DruxtSite.vue (3)

71-71: LGTM!

The code change is approved.


132-132: LGTM!

The code change is approved.


142-142: LGTM!

The code change is approved.

packages/blocks/src/components/DruxtBlockRegion.vue (3)

175-175: LGTM!

The introduction of optional chaining improves the robustness of the code by handling potential null or undefined values of collection.


210-210: LGTM!

The introduction of optional chaining improves the robustness of the code by handling potential undefined value of this.blocks.


226-226: LGTM!

The introduction of optional chaining improves the robustness of the code by handling potential undefined value of this.blocks.

packages/router/src/components/DruxtRouter.vue (3)

70-70: LGTM!

The code change is approved.


202-202: LGTM!

The code change is approved.


262-262: LGTM!

The code change is approved.

packages/blocks/src/components/DruxtBlock.vue (5)

96-96: LGTM!

The change to use optional chaining for accessing resource.data is approved. It improves the safety and conciseness of the code.


159-159: LGTM!

The change to use optional chaining for accessing this.$druxt.settings.blocks.query.fields is approved. It improves the clarity of the code.


217-217: LGTM!

The change to use optional chaining for checking this.block.attributes is approved. It simplifies the conditional logic.


220-220: LGTM!

The change to use optional chaining for accessing this.block.attributes.settings.label is approved. It prevents potential errors when rendering the description.


232-232: LGTM!

The change to use optional chaining for checking this.component.options.length is approved. It ensures the DruxtDevelTemplate component is only rendered when necessary.

packages/druxt/src/nuxt/index.js (4)

1-5: LGTM!

The code changes are approved.


32-41: LGTM!

The refactoring of the DruxtNuxtModule to use defineNuxtModule and the introduction of meta and defaults properties improve the module's structure and maintainability.


43-233: LGTM!

The encapsulation of the setup logic in a dedicated function improves the module's readability and maintainability. The function correctly merges and normalizes the module options, creates a new DruxtClient instance, and integrates with other Nuxt modules and features based on the provided options.

Tools
Biome

[error] 79-79: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 84-84: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

GitHub Check: codecov/patch

[warning] 143-143: packages/druxt/src/nuxt/index.js#L143
Added line #L143 was not covered by tests


[warning] 153-154: packages/druxt/src/nuxt/index.js#L153-L154
Added lines #L153 - L154 were not covered by tests


[warning] 158-159: packages/druxt/src/nuxt/index.js#L158-L159
Added lines #L158 - L159 were not covered by tests


[warning] 163-163: packages/druxt/src/nuxt/index.js#L163
Added line #L163 was not covered by tests


79-79: Consider using optional chaining to simplify the code.

The static analysis tool suggests using optional chaining to simplify the code at lines 79 and 84. However, the current code is correct and the suggestions can be safely ignored.

Also applies to: 84-84

Tools
Biome

[error] 79-79: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

packages/menu/src/components/DruxtMenu.vue (1)

208-208: LGTM!

The addition of the optional chaining operator (?.) to the state access expression is a good improvement. It ensures that if druxtMenu is null or undefined, the expression will return undefined instead of throwing an error. This enhances the robustness of the code by preventing potential runtime errors.

packages/router/src/router.js (2)

189-189: LGTM!

The use of optional chaining to access route.props?.langcode is a good practice to handle cases where route.props might be undefined. This change enhances code safety and readability without altering the functionality.


192-192: LGTM!

The use of optional chaining to check for the redirect path with route.redirect?.[0]?.to is a good practice to handle cases where route.redirect might be undefined. This change enhances code readability and reduces the risk of runtime errors due to undefined values.

packages/druxt/src/components/DruxtModule.vue (13)

133-133: LGTM!

The use of optional chaining to check for the existence of this.$options.druxt is a good safety measure to prevent runtime errors.


138-138: LGTM!

The use of optional chaining to check for the existence of this.$options.druxt.fetchConfig before invoking it is a good safety measure to prevent runtime errors.


Line range hint 148-159: LGTM!

The use of optional chaining in the following scenarios is a good safety measure to prevent runtime errors:

  • Checking for the existence of this.$vnode.data.scopedSlots.default.
  • Filtering and accessing the first element of the options array.

168-173: LGTM!

The use of optional chaining to check for the existence of this.$options.druxt.settings before invoking it is a good safety measure to prevent runtime errors.


192-192: LGTM!

The use of optional chaining to access $route.meta.langcode is a good safety measure to prevent runtime errors if $route.meta is undefined.


228-230: LGTM!

The use of optional chaining to access properties of the err.response object is a good safety measure to prevent runtime errors if err.response or the nested properties are undefined.


240-240: LGTM!

The use of optional chaining to access err.response.data.errors is a good safety measure to prevent runtime errors if err.response, err.response.data, or err.response.data.errors is undefined.


254-254: LGTM!

The use of optional chaining to check for the existence of this.$options.druxt.componentOptions is a good safety measure to prevent runtime errors if this.$options.druxt is undefined.


260-260: LGTM!

The use of optional chaining to check if options has a truthy length property is a good safety measure to prevent runtime errors if options is undefined.


324-324: LGTM!

The use of optional chaining to check for the existence of this.$options.druxt.propsData is a good safety measure to prevent runtime errors if this.$options.druxt is undefined.


440-442: LGTM!

The use of optional chaining to access properties of the wrapper object is a good safety measure to prevent runtime errors if wrapper is undefined.


447-448: LGTM!

The use of optional chaining in the following scenarios is a good safety measure to prevent runtime errors:

  • Checking if this.component.options has a truthy length property.
  • Accessing the component property of the wrapper object.

Line range hint 1-524: Overall, the code changes look good to me!

The introduction of optional chaining throughout the component enhances the safety and readability of the code by gracefully handling cases where properties may be undefined. This is a great improvement that prevents potential runtime errors.

I didn't find any issues or concerns with the changes. The usage of optional chaining is appropriate in all the modified code segments.

Great job on the refactoring! The component is now more robust and maintainable.

packages/views/src/components/DruxtView.vue (7)

Line range hint 163-171: LGTM!

The use of optional chaining enhances safety by preventing errors when deeply nested properties are accessed.


Line range hint 179-187: LGTM!

The use of optional chaining enhances safety by preventing errors when deeply nested properties are accessed.


Line range hint 204-212: LGTM!

The use of optional chaining enhances safety by preventing errors when deeply nested properties are accessed.


262-262: LGTM!

The use of optional chaining provides a more concise and safer way to handle potentially undefined data.


435-436: LGTM!

The use of optional chaining streamlines the logic for accessing potentially undefined properties.


457-457: LGTM!

The use of optional chaining ensures that if collection.data is not defined, it will not cause an error.


466-466: LGTM!

The use of optional chaining provides a safer way to access the drupal_internal__id property.

docs/nuxt/.nvmrc Show resolved Hide resolved
packages/entity/test/nuxt/index.test.js Outdated Show resolved Hide resolved
packages/router/package.json Show resolved Hide resolved
packages/breadcrumb/src/nuxt/index.js Outdated Show resolved Hide resolved
packages/entity/src/nuxt/index.js Show resolved Hide resolved
packages/schema/src/nuxt/index.js Show resolved Hide resolved
packages/router/src/nuxt/index.js Show resolved Hide resolved
packages/druxt/src/nuxt/index.js Outdated Show resolved Hide resolved
packages/druxt/src/nuxt/index.js Show resolved Hide resolved
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

Outside diff range and nitpick comments (1)
packages/site/src/nuxt/index.js (1)

1-89: Consider adding JSDoc comments for better documentation coverage.

To improve the documentation of the module, consider adding JSDoc comments for the following:

  1. The setup function and its parameters (moduleOptions and nuxt).
  2. The options object and its properties.
  3. The Nuxt hooks used in the module (components:dirs and storybook:config).

Adding these comments will provide a more comprehensive understanding of the module's internals and make it easier for other developers to work with the code.

Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

Commits

Files that changed from the base of the PR and between 6e2cd96 and 0f0cf4f.

Files selected for processing (8)
  • packages/blocks/src/nuxt/index.js (1 hunks)
  • packages/breadcrumb/src/nuxt/index.js (1 hunks)
  • packages/druxt/src/nuxt/index.js (2 hunks)
  • packages/entity/src/nuxt/index.js (1 hunks)
  • packages/menu/src/nuxt/index.js (1 hunks)
  • packages/router/src/nuxt/index.js (2 hunks)
  • packages/site/src/nuxt/index.js (1 hunks)
  • packages/views/src/nuxt/index.js (2 hunks)
Additional context used
Biome
packages/router/src/nuxt/index.js

[error] 66-66: The assignment should not be in an expression.

The use of assignments in expressions is confusing.
Expressions are often considered as side-effect free.

(lint/suspicious/noAssignInExpressions)


[error] 86-86: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

packages/druxt/src/nuxt/index.js

[error] 76-76: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 81-81: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

Additional comments not posted (32)
packages/breadcrumb/src/nuxt/index.js (5)

29-47: LGTM!

The module's default options and setup function are well-structured and follow best practices:

  • The default options provide a good starting point for the module's configuration.
  • Merging user-defined options with existing Nuxt.js options ensures cohesive configuration.
  • Installing dependent modules is essential for integrating the breadcrumb functionality with the broader Druxt ecosystem.

49-53: LGTM!

The component registration is correctly implemented:

  • Registering component directories allows Nuxt.js to recognize and utilize the breadcrumb components within the application.
  • The component directories are registered using the components:dirs hook.

55-62: TODO: Resolve compatibility issues between @nuxt/kit and @nuxt/storybook.

The Nuxt Storybook integration is currently disabled due to compatibility issues between @nuxt/kit and @nuxt/storybook.


4-24: LGTM!

The module's JSDoc comments are well-written and informative:

  • The comments provide a clear description of the module's purpose and usage.
  • The example provided in the comments helps developers understand how to configure the module.

66-66: LGTM!

The module's export statement is correctly implemented:

  • Exporting the module as a default export allows it to be easily imported and used in other parts of the codebase.
packages/blocks/src/nuxt/index.js (1)

27-69: LGTM! The Nuxt.js module is well-structured and follows best practices.

The DruxtBlocksNuxtModule is a comprehensive Nuxt.js module that effectively integrates Vue.js components into a Nuxt.js application. The module's setup function handles various aspects of the integration, such as setting default options, installing the Druxt module, registering component directories, and configuring Nuxt Storybook.

The module uses the @nuxt/kit package for defining and installing the module, which is a recommended approach. The module's documentation provides clear examples and explanations of how to use and configure the module.

The module's configuration options allow flexibility in customizing the behavior of the Druxt blocks, and the integration with Nuxt Storybook enhances the development experience by providing a visual representation of the components.

Overall, this module streamlines the process of using Druxt blocks within a Nuxt.js application, promoting modularity and ease of use.

packages/views/src/nuxt/index.js (5)

1-1: LGTM!

The imports from @nuxt/kit are necessary for the updated module definition and configuration.


27-76: Great work on updating the module definition!

The changes made to the DruxtViewsNuxtModule definition are in line with the recommended practices for defining Nuxt modules using defineNuxtModule. The updated setup function, component directory registration, dependent module installation, Vuex plugin addition, Vuex store enablement, and Storybook configuration all contribute to a more modern and maintainable module structure.


78-78: LGTM!

Exporting the DruxtViewsNuxtModule as the default export aligns with the common practice and improves the module's usability.


55-59: Verify the impact of the baseUrl option on the dependent modules.

The code segment adds dependent modules using the installModule function and passes the baseUrl option to them. Please ensure that the dependent modules (druxt-entity/nuxt and druxt-schema/nuxt) handle the baseUrl option correctly and that there are no unintended side effects or breaking changes caused by this option.

Run the following script to verify the usage of the baseUrl option in the dependent modules:

Verification successful

The baseUrl option is correctly handled by the dependent modules.

After analyzing the codebase, I can confirm that both druxt-entity and druxt-schema modules properly handle and utilize the baseUrl option:

  • Both modules document the baseUrl option in their configuration.
  • The option is correctly set up in the Nuxt module initialization for both packages.
  • druxt-entity correctly passes the baseUrl to druxt-schema during installation.
  • druxt-schema uses the baseUrl to create a DruxtSchema instance, which is essential for interacting with the Drupal JSON:API.

There are no apparent issues or unintended side effects caused by passing the baseUrl option to these modules.

Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the usage of the `baseUrl` option in the dependent modules.

# Test: Search for the usage of the `baseUrl` option in the `druxt-entity` module.
# Expect: Occurrences of the `baseUrl` option being used correctly.
rg --type js -A 5 $'baseUrl' ./packages/entity/src

# Test: Search for the usage of the `baseUrl` option in the `druxt-schema` module.
# Expect: Occurrences of the `baseUrl` option being used correctly.
rg --type js -A 5 $'baseUrl' ./packages/schema/src

Length of output: 5385


72-74: Verify the compatibility of the DruxtViewsStorybook function with the updated Nuxt context.

The code segment configures Storybook using the storybook:config hook and calls the DruxtViewsStorybook function with the updated nuxt context. Please ensure that the DruxtViewsStorybook function is compatible with the new Nuxt context and that there are no breaking changes or errors caused by this update.

Run the following script to verify the compatibility of the DruxtViewsStorybook function:

Verification successful

DruxtViewsStorybook function is compatible with the updated Nuxt context

The verification process has confirmed that the DruxtViewsStorybook function, which is the default export from ./packages/views/src/nuxt/storybook.js, is indeed compatible with the updated Nuxt context. The function is correctly imported and used in index.js with the new context:

await DruxtViewsStorybook.call(nuxt, { stories })

This usage aligns with the function's implementation, which expects to be called with a specific context (using this.options) and receives a { stories } object as its parameter. The function also utilizes Nuxt-specific features, indicating it's designed to work within the Nuxt ecosystem.

No changes or further actions are required regarding the compatibility of the DruxtViewsStorybook function with the updated Nuxt context.

Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the compatibility of the `DruxtViewsStorybook` function with the updated Nuxt context.

# Test: Search for the definition of the `DruxtViewsStorybook` function.
# Expect: The function definition should handle the `nuxt` context correctly.
rg --type js -A 10 $'DruxtViewsStorybook' ./packages/views/src/nuxt/storybook.js

Length of output: 79


Script:

#!/bin/bash
# Description: Verify the existence of the file and search for the DruxtViewsStorybook function

# Check if the file exists
if [ -f "./packages/views/src/nuxt/storybook.js" ]; then
    echo "File ./packages/views/src/nuxt/storybook.js exists."
else
    echo "File ./packages/views/src/nuxt/storybook.js does not exist."
fi

# Search for DruxtViewsStorybook function in all JavaScript files within packages/views
echo "Searching for DruxtViewsStorybook function:"
rg --type js -A 10 'function\s+DruxtViewsStorybook' ./packages/views

# If not found as a function, search for it as a variable or constant
if [ $? -ne 0 ]; then
    echo "Searching for DruxtViewsStorybook as a variable or constant:"
    rg --type js -A 10 '(const|let|var)\s+DruxtViewsStorybook' ./packages/views
fi

Length of output: 559


Script:

#!/bin/bash
# Description: Further investigation of DruxtViewsStorybook usage and definition

# Search for any usage of DruxtViewsStorybook in the entire codebase
echo "Searching for any usage of DruxtViewsStorybook:"
rg --type js 'DruxtViewsStorybook' ./packages/views

# Look for imports in storybook.js
echo "Checking imports in storybook.js:"
rg --type js 'import.*DruxtViewsStorybook' ./packages/views/src/nuxt/storybook.js

# Check for similarly named functions or variables
echo "Searching for similarly named functions or variables:"
rg --type js '(function|const|let|var)\s+(Druxt.*Storybook)' ./packages/views

# Display the content of storybook.js for manual inspection
echo "Content of storybook.js:"
cat ./packages/views/src/nuxt/storybook.js

Length of output: 3242

packages/menu/src/nuxt/index.js (5)

29-36: LGTM!

The module's meta and defaults are correctly specified.


38-51: LGTM!

The setup function is correctly processing the options and installing the dependent module with the combined options.


53-57: LGTM!

The component directories are correctly registered, ensuring that the menu components are available for use within the application.


59-71: LGTM!

The plugin templates are correctly added, allowing for the generation of the necessary plugin files for the menu functionality and Vuex store.


73-76: LGTM!

The module correctly integrates with Nuxt Storybook by hooking into the storybook:config hook and calling the DruxtMenuStorybook function with the stories object.

packages/entity/src/nuxt/index.js (2)

32-78: LGTM!

The DruxtEntityNuxtModule function is well-structured, follows best practices for defining a Nuxt.js module, and sets up the necessary configurations and integrations for the Druxt framework. The function is well-documented, provides flexibility for users to customize options, ensures the installation of necessary dependencies, registers component directories correctly, and enables seamless integration with Nuxt Storybook for UI component development and testing.

Great job on implementing this critical part of the module!


68-68: Address the past review comment and consider adding tests for the conditional block.

The past review comment suggests adding tests to cover the conditional block at line 68. While the conditional block is not complex, it's still a good practice to test different scenarios based on user-defined options.

Consider adding tests that cover the following scenarios:

  1. When options.entity.components.fields is truthy, ensure that the component directory at ../dist/components/fields is registered.
  2. When options.entity.components.fields is falsy, ensure that the component directory at ../dist/components/fields is not registered.

These tests will help ensure that the conditional behavior works as expected based on user-defined options.

packages/site/src/nuxt/index.js (5)

1-4: LGTM!

The imports are relevant and necessary for the module functionality.


6-15: LGTM!

The JSDoc comment provides a clear and informative description of the module's purpose and functionality.


16-80: LGTM!

The DruxtSiteNuxtModule is well-structured and provides the necessary setup and configuration for integrating Druxt Site into a Nuxt.js application. The module installs essential Druxt modules, registers components, and sets up default options and layouts.


82-82: LGTM!

Exporting the module as the default export is the correct approach for making it accessible to other files.


84-89: LGTM!

The JSDoc comment provides a clear description of the ModuleOptions type and references the location of the type definition.

packages/router/src/nuxt/index.js (6)

31-39: LGTM!

The use of defineNuxtModule to define the DruxtRouterNuxtModule is a good practice. The meta and defaults properties provide useful information and sensible default options for the module.


80-81: Recommendation: Add tests for DruxtClient instantiation.

The static analysis tool reports that the added lines at line range 80-81, which create a new instance of DruxtClient, are not covered by tests.

To improve the test coverage and ensure the reliability and maintainability of the code, it is recommended to add tests that cover the instantiation of DruxtClient with the provided options.

Do you want me to generate the test code or open a GitHub issue to track this recommendation?

Tools
GitHub Check: codecov/patch

[warning] 80-81: packages/router/src/nuxt/index.js#L80-L81
Added lines #L80 - L81 were not covered by tests


40-79: LGTM!

The setup function is well-structured and handles the module configuration effectively. Merging options, installing dependencies, registering components, and adding custom routes are all good practices.

Also applies to: 82-84

Tools
Biome

[error] 66-66: The assignment should not be in an expression.

The use of assignments in expressions is confusing.
Expressions are often considered as side-effect free.

(lint/suspicious/noAssignInExpressions)


94-115: LGTM!

Extending pages using extendPages and adding language-specific routes and a wildcard route is a good approach for enhancing the router functionality and enabling multi-language support.


117-134: LGTM!

Adding a plugin and a store using addPluginTemplate is a good practice. Enabling the Vuex store is necessary for the module to function properly.


136-145: LGTM!

Adding a hook for Nuxt Storybook configuration and a template for a Storybook story is a good practice for integrating with Storybook. Pushing the generated story to the Storybook stories array ensures that the story is included.

packages/druxt/src/nuxt/index.js (3)

29-38: LGTM!

The module definition has been updated to use defineNuxtModule from @nuxt/kit, which is a good practice for defining Nuxt modules. The metadata and default options are well-defined and essential for the module.


40-225: LGTM!

The module setup function has been refactored to handle the module initialization process effectively. The merging of module options and Nuxt options, normalization of baseUrl and endpoint options, creation of a new DruxtClient instance, integration with @nuxtjs/proxy and @nuxtjs/axios modules, registration of components, plugins, and Vuex store, addition of CLI badge messages, enabling of development mode features, and integration with Nuxt Storybook are all well-implemented and enhance the module's functionality and developer experience.

Tools
Biome

[error] 76-76: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 81-81: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


140-140: ** Reminder: Add tests to cover the added lines.**

The code coverage report indicates that the added lines at 143, 153-154, 158-159, and 163 are not covered by tests.

Do you want me to generate the missing unit tests or open a GitHub issue to track this task?

Also applies to: 153-154, 158-159, 163-163

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

Outside diff range and nitpick comments (6)
packages/blocks/test/nuxt/index.test.js (3)

5-9: Consider using jest.requireMock for better type safety.

Instead of using jest.mock and manually defining the mocked module, consider using jest.requireMock to import the actual module and ensure better type safety. This approach helps maintain consistency between the mocked and actual module signatures.

-jest.mock('@nuxt/kit', () => ({
-  defineNuxtModule: (module) => module,
-  installModule: jest.fn(),
-}))
-import { installModule } from '@nuxt/kit'
+import { defineNuxtModule, installModule } from '@nuxt/kit'
+
+jest.mock('@nuxt/kit', () => ({
+  ...jest.requireActual('@nuxt/kit'),
+  installModule: jest.fn(),
+}))

11-19: Consider extracting the mock Nuxt instance into a separate file.

To improve code organization and reusability, consider extracting the nuxtMock object into a separate file, such as test/mocks/nuxt.js. This allows you to share the mock instance across multiple test files and keeps the test file focused on the specific module being tested.

-const nuxtMock = {
-  hook: jest.fn((hook, fn) => {
-    const arg = {
-      'components:dirs': [],
-      'storybook:config': { stories: [] }
-    }
-    return fn(arg[hook])
-  }),
-}
+import { nuxtMock } from '../mocks/nuxt'

21-29: Consider adding more test cases.

While the current test case covers the basic setup process of the DruxtBlocksNuxtModule, consider adding more test cases to ensure comprehensive coverage of the module's functionality. Some additional test cases to consider:

  1. Test the behavior when the druxt option is not provided in the Nuxt options.
  2. Verify that the correct arguments are passed to the installModule function.
  3. Test the behavior when the components:dirs and storybook:config hooks are not called.
  4. Validate the content of the components:dirs array and storybook:config object after the setup process.

Adding these additional test cases will help catch edge cases and ensure the module behaves as expected under different scenarios.

packages/router/test/nuxt/index.test.js (2)

11-11: Ensure all imported functions are used.

The imported functions addPluginTemplate, addTemplate, extendPages, and installModule should all be used within the test file. If any of these functions are unused, consider removing them from the import statement to maintain a clean and minimal import list.

Run the following script to verify the usage of the imported functions:

#!/bin/bash
# Description: Verify all imported functions are used in the test file.

# Test: Search for the usage of each imported function. Expect: At least one occurrence of each function.
for func in addPluginTemplate addTemplate extendPages installModule; do
  echo "Checking usage of $func:"
  rg --type js -A 5 "\b$func\b" packages/router/test/nuxt/index.test.js
  echo "---"
done

24-30: Verify the removal of unused nuxtMock.options properties.

The nuxtMock.options object includes properties like build, buildDir, and srcDir. Ensure that these properties are still required for the tests after the refactor. If they are no longer used, consider removing them to keep the mock setup minimal and focused.

packages/druxt/test/nuxt/index.test.js (1)

192-201: Reminder: Reimplement the development server middleware test.

The commented-out test for the development server middleware indicates that it needs to be reimplemented. Consider updating the test to ensure that the middleware is correctly added when the development mode is enabled.

Do you want me to generate the updated test code or open a GitHub issue to track this task?

Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

Commits

Files that changed from the base of the PR and between 0f0cf4f and 0828671.

Files selected for processing (4)
  • packages/blocks/test/nuxt/index.test.js (1 hunks)
  • packages/druxt/test/nuxt/index.test.js (4 hunks)
  • packages/entity/test/nuxt/index.test.js (1 hunks)
  • packages/router/test/nuxt/index.test.js (1 hunks)
Additional context used
Biome
packages/druxt/test/nuxt/index.test.js

[error] 141-141: Avoid the delete operator which can impact performance.

Unsafe fix: Use an undefined assignment instead.

(lint/performance/noDelete)

Additional comments not posted (19)
packages/blocks/test/nuxt/index.test.js (2)

1-29: LGTM!

The test file is well-structured and follows best practices for testing Nuxt modules. It effectively mocks the necessary dependencies, sets up a mock Nuxt instance, and validates the expected behavior of the DruxtBlocksNuxtModule during the setup process.

Key aspects:

  • Mocking of @nuxt/kit and storybook configuration is handled correctly.
  • The mock Nuxt instance provides the necessary hooks and options for testing.
  • The test case covers the essential aspects of the module setup, including verifying the number of times installModule and hook methods are called.

Overall, the test file provides a solid foundation for testing the DruxtBlocksNuxtModule and ensures that the module integrates correctly with the Nuxt framework.


3-3: Verify the mocked storybook configuration.

Please ensure that the mocked storybook configuration in ../../src/nuxt/storybook aligns with the actual configuration used in the module. If there are any discrepancies, update the mocked configuration to maintain consistency and avoid false positives in the tests.

Verification successful

The mocked storybook configuration is correctly implemented for testing purposes.

The current implementation of the mock is appropriate and aligns with common Jest testing strategies. The line jest.mock('../../src/nuxt/storybook') tells Jest to mock the entire storybook module, allowing tests to provide custom implementations or expectations as needed. This approach is particularly useful when dealing with complex modules that have side effects or external dependencies, as is the case with the actual storybook.js file.

The simplicity of the mock enables flexibility in testing, as specific functionalities can be mocked on a per-test basis. This strategy, combined with the additional mock for '@nuxt/kit', provides a solid foundation for isolated and controlled testing of the module's behavior.

Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the mocked storybook configuration matches the actual configuration.

# Test: Compare the mocked and actual storybook configurations.
diff <(cat packages/blocks/src/nuxt/storybook.js) <(cat packages/blocks/test/nuxt/index.test.js | sed -n '/jest\.mock.*storybook/,/)/p' | sed '$d')

Length of output: 261


Script:

#!/bin/bash
# Search for storybook.js file
echo "Searching for storybook.js file:"
fd storybook.js packages/blocks

# Display contents of storybook.js if found
echo -e "\nContents of storybook.js (if found):"
fd storybook.js packages/blocks -x cat {}

# Extract and display mocked storybook configuration from test file
echo -e "\nMocked storybook configuration in test file:"
sed -n '/jest\.mock.*storybook/,/})/p' packages/blocks/test/nuxt/index.test.js

Length of output: 3229

packages/entity/test/nuxt/index.test.js (1)

1-30: LGTM!

The test case is well-structured and covers the essential aspects of the Nuxt module setup. It mocks the necessary dependencies, sets up a mock Nuxt instance, and makes appropriate assertions to verify the expected behavior.

The test case now includes assertions to check that the installModule function from @nuxt/kit is called the expected number of times and that the Nuxt hooks are triggered as expected.

Great job addressing the previous review comment and enhancing the test case!

packages/router/test/nuxt/index.test.js (5)

3-9: Great job enhancing the mock setup!

The changes to the mock setup using jest.mock for the @nuxt/kit module improve the comprehensiveness of the mocking by including additional methods like addPluginTemplate, extendPages, and installModule. This will lead to more thorough testing of the DruxtRouterNuxtModule.


32-38: Excellent job updating the assertions!

The assertions have been updated to reflect the new mock methods, focusing on the calls to installModule, extendPages, addPluginTemplate, and addTemplate. The test case now checks for the correct number of calls to these methods based on the druxt.router options, ensuring that the DruxtRouterNuxtModule behaves as expected.


41-45: Great work testing different configurations!

The test case now checks the behavior of the DruxtRouterNuxtModule when the druxt.router.wildcard option is set to false. This ensures that the module functions correctly under different configurations.


48-54: Excellent job testing the pages: false configuration!

The test case now validates the behavior of the DruxtRouterNuxtModule when the druxt.router.pages option is set to false. It checks the number of calls to addPluginTemplate, addTemplate, and nuxtMock.hook, and also verifies that the build.createRoutes() method returns an empty array. This comprehensive testing ensures that the module handles this configuration correctly.


1-1: Verify the import path change in the codebase.

The import path for DruxtRouterNuxtModule has been updated. Ensure that the module has been moved to the new location and that all other files importing this module have been updated accordingly.

Run the following script to verify the import usage:

Verification successful

Import path change verified successfully

The import path for DruxtRouterNuxtModule has been correctly updated in the codebase. The module is defined in packages/router/src/nuxt/index.js and imported correctly in packages/router/test/nuxt/index.test.js using the path '../../src/nuxt'. No other occurrences of importing this module from a different path were found, indicating that all necessary updates have been made.

Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify all imports of `DruxtRouterNuxtModule` match the new path.

# Test: Search for the import usage. Expect: Only occurrences of the new import path.
rg --type js -A 5 $'DruxtRouterNuxtModule'

Length of output: 2400

packages/druxt/test/nuxt/index.test.js (11)

3-11: LGTM!

The changes to import the DruxtNuxtModule and mock the @nuxt/kit package are necessary for the updated test structure. The mocked functions addPluginTemplate, defineNuxtModule, and installModule will be used to verify the module's behavior.


18-38: LGTM!

The nuxtMock object is set up correctly in the beforeEach hook. It provides the necessary mocked functionality for the hook method and the required options for testing the Druxt module.


40-49: LGTM!

The test for module options correctly verifies that:

  • The addPluginTemplate function is called with the provided options.
  • The Druxt and Axios plugins are correctly ordered using the extendPlugins method.

52-60: LGTM!

The test for root options correctly verifies that the addPluginTemplate function is called with the provided options when they are set in the nuxtMock.options.druxt object.


67-75: LGTM!

The test for default options correctly verifies that:

  • The components and store options are enabled by default.
  • The components option can be disabled when explicitly set to false.

81-93: LGTM!

The test for plugin order correctly verifies that:

  • The extendPlugins option is a function after setting up the module.
  • The plugins are correctly ordered, with the Axios plugin first, followed by the Druxt plugin.

97-102: LGTM!

The test for the @nuxtjs/axios module correctly verifies that the installModule function is called with the correct arguments to install the Axios module.


Line range hint 107-124: LGTM!

The test for the API Proxy correctly verifies that:

  • The @nuxtjs/proxy module is installed when the proxy.api option is enabled.
  • The nuxtMock.options.proxy object is correctly set with the expected proxy configuration.

128-148: LGTM!

The test for the File Proxy correctly verifies that:

  • The nuxtMock.options.proxy object is correctly set with the default file proxy configuration when the proxy.files option is enabled.
  • The nuxtMock.options.proxy object is correctly set with a custom file proxy configuration when the proxy.files option is set to a custom value.
Tools
Biome

[error] 141-141: Avoid the delete operator which can impact performance.

Unsafe fix: Use an undefined assignment instead.

(lint/performance/noDelete)


Line range hint 152-190: LGTM!

The test for merging proxy options correctly verifies that:

  • The @nuxtjs/proxy module is installed when the proxy.api option is enabled.
  • The nuxtMock.options.proxy object is correctly merged with the existing array and object proxy settings.
Tools
Biome

[error] 141-141: Avoid the delete operator which can impact performance.

Unsafe fix: Use an undefined assignment instead.

(lint/performance/noDelete)


141-141: ****

The use of the delete operator in this context is appropriate and does not significantly impact performance. The static analysis hint can be safely ignored.

Tools
Biome

[error] 141-141: Avoid the delete operator which can impact performance.

Unsafe fix: Use an undefined assignment instead.

(lint/performance/noDelete)

packages/router/test/nuxt/index.test.js Show resolved Hide resolved
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.

1 participant