1 files changed, 18 insertions, 10 deletions
diff --git a/spec/frontend/packages_and_registries/package_registry/components/details/npm_installation_spec.js b/spec/frontend/packages_and_registries/package_registry/components/details/npm_installation_spec.js
index b89410ede13..8c0e2d948ca 100644
--- a/spec/frontend/packages_and_registries/package_registry/components/details/npm_installation_spec.js
+++ b/spec/frontend/packages_and_registries/package_registry/components/details/npm_installation_spec.js
@@ -1,4 +1,4 @@
-import { GlFormRadioGroup } from '@gitlab/ui';
+import { GlLink, GlSprintf, GlFormRadioGroup } from '@gitlab/ui';
 import { nextTick } from 'vue';
 import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 
@@ -15,6 +15,7 @@ import {
   YARN_PACKAGE_MANAGER,
   PROJECT_PACKAGE_ENDPOINT_TYPE,
   INSTANCE_PACKAGE_ENDPOINT_TYPE,
+  NPM_HELP_PATH,
 } from '~/packages_and_registries/package_registry/constants';
 import CodeInstructions from '~/vue_shared/components/registry/code_instruction.vue';
 
@@ -29,13 +30,12 @@ describe('NpmInstallation', () => {
   const findCodeInstructions = () => wrapper.findAllComponents(CodeInstructions);
   const findInstallationTitle = () => wrapper.findComponent(InstallationTitle);
   const findEndPointTypeSector = () => wrapper.findComponent(GlFormRadioGroup);
+  const findSetupDocsLink = () => wrapper.findComponent(GlLink);
 
   function createComponent({ data = {} } = {}) {
     wrapper = shallowMountExtended(NpmInstallation, {
       provide: {
-        npmHelpPath: 'npmHelpPath',
-        npmPath: 'npmPath',
-        npmProjectPath: 'npmProjectPath',
+        npmInstanceUrl: 'npmInstanceUrl',
       },
       propsData: {
         packageEntity,
@@ -43,6 +43,7 @@ describe('NpmInstallation', () => {
       data() {
         return data;
       },
+      stubs: { GlSprintf },
     });
   }
 
@@ -58,6 +59,13 @@ describe('NpmInstallation', () => {
     expect(wrapper.element).toMatchSnapshot();
   });
 
+  it('has a setup link', () => {
+    expect(findSetupDocsLink().attributes()).toMatchObject({
+      href: NPM_HELP_PATH,
+      target: '_blank',
+    });
+  });
+
   describe('endpoint type selector', () => {
     it('has the endpoint type selector', () => {
       expect(findEndPointTypeSector().exists()).toBe(true);
@@ -109,7 +117,7 @@ describe('NpmInstallation', () => {
 
     it('renders the correct setup command', () => {
       expect(findCodeInstructions().at(1).props()).toMatchObject({
-        instruction: 'echo @gitlab-org:registry=npmPath/ >> .npmrc',
+        instruction: 'echo @gitlab-org:registry=npmInstanceUrl/ >> .npmrc',
         multiline: false,
         trackingAction: TRACKING_ACTION_COPY_NPM_SETUP_COMMAND,
       });
@@ -121,7 +129,7 @@ describe('NpmInstallation', () => {
       await nextTick();
 
       expect(findCodeInstructions().at(1).props()).toMatchObject({
-        instruction: `echo @gitlab-org:registry=npmProjectPath/ >> .npmrc`,
+        instruction: `echo @gitlab-org:registry=${packageEntity.npmUrl}/ >> .npmrc`,
         multiline: false,
         trackingAction: TRACKING_ACTION_COPY_NPM_SETUP_COMMAND,
       });
@@ -131,7 +139,7 @@ describe('NpmInstallation', () => {
       await nextTick();
 
       expect(findCodeInstructions().at(1).props()).toMatchObject({
-        instruction: `echo @gitlab-org:registry=npmPath/ >> .npmrc`,
+        instruction: `echo @gitlab-org:registry=npmInstanceUrl/ >> .npmrc`,
         multiline: false,
         trackingAction: TRACKING_ACTION_COPY_NPM_SETUP_COMMAND,
       });
@@ -153,7 +161,7 @@ describe('NpmInstallation', () => {
 
     it('renders the correct registry command', () => {
       expect(findCodeInstructions().at(1).props()).toMatchObject({
-        instruction: 'echo \\"@gitlab-org:registry\\" \\"npmPath/\\" >> .yarnrc',
+        instruction: 'echo \\"@gitlab-org:registry\\" \\"npmInstanceUrl/\\" >> .yarnrc',
         multiline: false,
         trackingAction: TRACKING_ACTION_COPY_YARN_SETUP_COMMAND,
       });
@@ -165,7 +173,7 @@ describe('NpmInstallation', () => {
       await nextTick();
 
       expect(findCodeInstructions().at(1).props()).toMatchObject({
-        instruction: `echo \\"@gitlab-org:registry\\" \\"npmProjectPath/\\" >> .yarnrc`,
+        instruction: `echo \\"@gitlab-org:registry\\" \\"${packageEntity.npmUrl}/\\" >> .yarnrc`,
         multiline: false,
         trackingAction: TRACKING_ACTION_COPY_YARN_SETUP_COMMAND,
       });
@@ -175,7 +183,7 @@ describe('NpmInstallation', () => {
       await nextTick();
 
       expect(findCodeInstructions().at(1).props()).toMatchObject({
-        instruction: 'echo \\"@gitlab-org:registry\\" \\"npmPath/\\" >> .yarnrc',
+        instruction: 'echo \\"@gitlab-org:registry\\" \\"npmInstanceUrl/\\" >> .yarnrc',
         multiline: false,
         trackingAction: TRACKING_ACTION_COPY_YARN_SETUP_COMMAND,
       });