@rancher/shell 3.0.9-rc.6 → 3.0.10

package/detail/fleet.cattle.io.cluster.vue

@@ -6,7 +6,7 @@ import ResourceTabs from '@shell/components/form/ResourceTabs';
 import Tab from '@shell/components/Tabbed/Tab';
 import { MANAGEMENT, FLEET, SCHEMA } from '@shell/config/types';
 import { FLEET as FLEET_LABELS } from '@shell/config/labels-annotations';
-import { allHash } from 'utils/promise';
+import { allHash } from '@shell/utils/promise';
 
 export default {
   name: 'FleetDetailCluster',

package/dialog/FeatureFlagListDialog.vue

@@ -134,7 +134,7 @@ export default {
             this.waiting = false;
             this.close();
 
-            await this.$store.dispatch('management/findAll', { type: this.resource, opt: { force: true } });
+            await this.$store.dispatch('management/findAll', { type: this.update.type, opt: { force: true } });
           }
         } catch (e) {}
 

package/edit/auth/github-app-steps.vue

@@ -49,6 +49,7 @@ defineProps<{
             <CopyToClipboard
               label-as="tooltip"
               :text="tArgs.serverUrl"
+              :aria-label="t('generic.copyValueToClipboard', { value: tArgs.serverUrl })"
               class="icon-btn"
               action-color="bg-transparent"
             />
@@ -67,6 +68,7 @@ defineProps<{
             <CopyToClipboard
               :text="t(`authConfig.${name}.form.callback.value`, tArgs, true)"
               label-as="tooltip"
+              :aria-label="t('generic.copyValueToClipboard', { value: t(`authConfig.${name}.form.callback.value`, tArgs, true) })"
               class="icon-btn"
               action-color="bg-transparent"
             />

package/edit/auth/github-steps.vue

@@ -40,6 +40,7 @@ defineProps<{
             <b>{{ t(`authConfig.${name}.form.homepage.label`) }}</b>: {{ tArgs.serverUrl }} <CopyToClipboard
               label-as="tooltip"
               :text="tArgs.serverUrl"
+              :aria-label="t('generic.copyValueToClipboard', { value: tArgs.serverUrl })"
               class="icon-btn"
               action-color="bg-transparent"
             />
@@ -49,6 +50,7 @@ defineProps<{
             <b>{{ t(`authConfig.${name}.form.callback.label`) }}</b>: {{ tArgs.serverUrl }} <CopyToClipboard
               :text="tArgs.serverUrl"
               label-as="tooltip"
+              :aria-label="t('generic.copyValueToClipboard', { value: tArgs.serverUrl })"
               class="icon-btn"
               action-color="bg-transparent"
             />

package/edit/catalog.cattle.io.clusterrepo.vue

@@ -228,7 +228,7 @@ export default {
 <template>
   <form>
     <h2>{{ t('catalog.repo.target.label') }}</h2>
-    <div class="row mb-10">
+    <div class="row mb-20">
       <div class="col span-12 target-groups">
         <RcItemCard
           v-for="card in clusterRepoTargets"

package/edit/management.cattle.io.user.vue

@@ -16,8 +16,6 @@ export default {
     ChangePassword, GlobalRoleBindings, CruResource, LabeledInput, Loading
   },
 
-  emits: ['update:mode'],
-
   mixins: [
     CreateEditView
   ],
@@ -42,8 +40,7 @@ export default {
         password:     false,
         roles:        !showGlobalRoles,
         rolesChanged: false,
-      },
-      watchOverride: false,
+      }
     };
   },
 
@@ -110,10 +107,20 @@ export default {
         if (this.isCreate) {
           const user = await this.createUser();
 
-          await this.updateRoles(user.id);
+          await this.createSecret(user);
+          await this.updateRoles(user);
+
+          // Show success notification only after ALL operations complete
+          // this is a "clone" of steve-class "processSaveResponse" toast/growl
+          this.$store.dispatch('growl/success', {
+            title:   this.t('generic.autogeneratedCreated.title', { resource: user.kind }),
+            message: this.t('generic.autogeneratedCreated.message', { id: user.username, resource: user.kind }),
+            timeout: 3000
+          }, { root: true });
         } else {
-          await this.editUser();
-          await this.updateRoles();
+          const user = await this.editUser();
+
+          await this.updateRoles(user);
         }
 
         this.$router.replace({ name: this.doneRoute });
@@ -139,21 +146,10 @@ export default {
         username:           this.form.username
       });
 
-      const userSaved = await user.save();
-
-      if (this.form.password.password) {
-        // create secret to hold user password
-        const secret = await this.$store.dispatch('management/create', {
-          type:     SECRET,
-          metadata: {
-            namespace: 'cattle-local-user-passwords',
-            name:      userSaved.id
-          },
-          data: { password: base64Encode(this.form.password.password) }
-        });
-
-        await secret.save();
-      }
+      const userSaved = await user.save({
+        // Don't show a success toast until the secret and GRB are also created
+        suppressSuccessToast: true,
+      });
 
       return userSaved;
     },
@@ -178,27 +174,57 @@ export default {
         await wait(5000);
       }
 
-      this.value.save();
+      const user = this.value.save();
+
+      return user;
     },
 
-    async updateRoles(userId) {
+    async createSecret(user) {
+      if (this.form.password.password) {
+        try {
+        // create secret to hold user password
+          const secret = await this.$store.dispatch('management/create', {
+            type:     SECRET,
+            metadata: {
+              namespace: 'cattle-local-user-passwords',
+              name:      user.id
+            },
+            data: { password: base64Encode(this.form.password.password) }
+          });
+
+          await secret.save();
+        } catch (err) {
+          if (this.isCreate) {
+            try {
+              // If secret creation fails, attempt to clean up the user to maintain consistency
+              await user.remove();
+            } catch (cleanupErr) {
+              // Log cleanup error but prioritize original error for user feedback
+              console.error('Failed to clean up user after secret creation failure:', cleanupErr); // eslint-disable-line no-console
+            }
+          }
+
+          throw err;
+        }
+      }
+    },
+
+    async updateRoles(user) {
       if (!this.$refs.grb) {
         return;
       }
 
       try {
-        await this.$refs.grb.save(userId);
+        await this.$refs.grb.save(user.id);
       } catch (err) {
         if (this.isCreate) {
-          this.watchOverride = true;
-          this.$emit(
-            'update:mode',
-            {
-              userId,
-              mode:     _EDIT,
-              resource: 'management.cattle.io.user',
-            }
-          );
+          try {
+            // If GRB creation fails, clean up the user to maintain consistency
+            await user.remove();
+          } catch (cleanupErr) {
+            // Log cleanup error but prioritize original error for user feedback
+            console.error('Failed to clean up user after GRB creation failure:', cleanupErr); // eslint-disable-line no-console
+          }
         }
         throw err;
       }
@@ -274,7 +300,6 @@ export default {
         :user-id="value.id || liveValue.id"
         :mode="mode"
         :real-mode="realMode"
-        :watch-override="watchOverride"
         type="user"
         @hasChanges="validation.rolesChanged = $event"
         @canLogIn="validation.roles = $event"

package/edit/monitoring.coreos.com.alertmanagerconfig/__tests__/auth.spec.ts

@@ -0,0 +1,145 @@
+import { shallowMount } from '@vue/test-utils';
+import Auth from '@shell/edit/monitoring.coreos.com.alertmanagerconfig/auth.vue';
+import LabeledSelect from '@shell/components/form/LabeledSelect.vue';
+import SimpleSecretSelector from '@shell/components/form/SimpleSecretSelector';
+
+describe('component: Auth.vue', () => {
+  const defaultProps = {
+    mode:      'edit',
+    value:     {},
+    namespace: 'test-namespace'
+  };
+
+  it('should render correctly with initial props', () => {
+    const wrapper = shallowMount(Auth, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    expect(wrapper.find('h3').text()).toBe('%monitoringReceiver.auth.label%');
+    expect(wrapper.findComponent(LabeledSelect).exists()).toBe(true);
+  });
+
+  it('should initialize with basic auth type if present', () => {
+    const wrapper = shallowMount(Auth, {
+      props:  { ...defaultProps, value: { basicAuth: { username: { name: 'test' } } } },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    expect(wrapper.vm.authType).toBe('basicAuth');
+    expect(wrapper.findAllComponents(SimpleSecretSelector)).toHaveLength(2);
+  });
+
+  it('should initialize with bearer token auth type if present', () => {
+    const wrapper = shallowMount(Auth, {
+      props:  { ...defaultProps, value: { bearerTokenSecret: { name: 'test' } } },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    expect(wrapper.vm.authType).toBe('bearerTokenSecret');
+    expect(wrapper.findAllComponents(SimpleSecretSelector)).toHaveLength(1);
+  });
+
+  it('should switch to basic auth and clear other types', async() => {
+    const value = { bearerTokenSecret: { name: 'b', key: 'k' } };
+    const wrapper = shallowMount(Auth, {
+      props:  { ...defaultProps, value },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    await wrapper.findComponent(LabeledSelect).vm.$emit('update:value', 'basicAuth');
+    expect(wrapper.vm.authType).toBe('basicAuth');
+    expect(wrapper.props('value').bearerTokenSecret).toBeUndefined();
+    expect(wrapper.props('value').basicAuth).toBeDefined();
+  });
+
+  it('should switch to bearer token and clear other types', async() => {
+    const value = { basicAuth: { username: { name: 'u' } } };
+    const wrapper = shallowMount(Auth, {
+      props:  { ...defaultProps, value },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    await wrapper.findComponent(LabeledSelect).vm.$emit('update:value', 'bearerTokenSecret');
+    expect(wrapper.vm.authType).toBe('bearerTokenSecret');
+    expect(wrapper.props('value').basicAuth).toBeUndefined();
+    expect(wrapper.props('value').bearerTokenSecret).toBeDefined();
+  });
+
+  it('should switch to none and clear other types', async() => {
+    const value = { basicAuth: { username: { name: 'u' } } };
+    const wrapper = shallowMount(Auth, {
+      props:  { ...defaultProps, value },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    await wrapper.findComponent(LabeledSelect).vm.$emit('update:value', 'none');
+    expect(wrapper.vm.authType).toBe('none');
+    expect(wrapper.props('value').basicAuth).toBeUndefined();
+  });
+
+  it('should update basic auth username and password', async() => {
+    const wrapper = shallowMount(Auth, {
+      props:  { ...defaultProps, value: { basicAuth: { username: { name: 'test' } } } },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    await wrapper.vm.$nextTick();
+
+    const selectors = wrapper.findAllComponents(SimpleSecretSelector);
+
+    expect(selectors).toHaveLength(2);
+
+    const usernameSelector = selectors[0];
+    const passwordSelector = selectors[1];
+
+    await usernameSelector.vm.$emit('updateSecretName', 'user-secret');
+    await usernameSelector.vm.$emit('updateSecretKey', 'user-key');
+    await passwordSelector.vm.$emit('updateSecretName', 'pass-secret');
+    await passwordSelector.vm.$emit('updateSecretKey', 'pass-key');
+
+    const basicAuth = wrapper.props('value').basicAuth;
+
+    expect(basicAuth.username.name).toBe('user-secret');
+    expect(basicAuth.username.key).toBe('user-key');
+    expect(basicAuth.password.name).toBe('pass-secret');
+    expect(basicAuth.password.key).toBe('pass-key');
+  });
+
+  it('should update bearer token secret', async() => {
+    const wrapper = shallowMount(Auth, {
+      props:  { ...defaultProps, value: { bearerTokenSecret: { name: 'test' } } },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    await wrapper.vm.$nextTick();
+
+    const selector = wrapper.findComponent(SimpleSecretSelector);
+
+    expect(selector.exists()).toBe(true);
+
+    await selector.vm.$emit('updateSecretName', 'bearer-name');
+    await selector.vm.$emit('updateSecretKey', 'bearer-key');
+
+    const bearerToken = wrapper.props('value').bearerTokenSecret;
+
+    expect(bearerToken.name).toBe('bearer-name');
+    expect(bearerToken.key).toBe('bearer-key');
+  });
+
+  it('should render in view mode', () => {
+    const wrapper = shallowMount(Auth, {
+      props: {
+        mode: 'view', value: { basicAuth: {} }, namespace: 'ns'
+      },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    expect(wrapper.findComponent(LabeledSelect).attributes('disabled')).toBe('true');
+    const selectors = wrapper.findAllComponents(SimpleSecretSelector);
+
+    selectors.forEach((selector) => {
+      expect(selector.props('disabled')).toBe(true);
+    });
+  });
+});

package/edit/monitoring.coreos.com.alertmanagerconfig/__tests__/index.test.ts

@@ -0,0 +1,202 @@
+/* eslint-disable import/first */
+global.PointerEvent = class PointerEvent extends Event {};
+
+import { shallowMount } from '@vue/test-utils';
+import { EDITOR_MODES } from '@shell/components/YamlEditor.vue';
+import { _EDIT, _VIEW } from '@shell/config/query-params';
+import Index from '../index.vue';
+
+describe('monitoring.coreos.com.alertmanagerconfig/index.vue', () => {
+  it('should render correctly', () => {
+    const valueMock = {
+      applyDefaults: jest.fn(),
+      spec:          {
+        receivers: [
+          { name: 'receiver1', type: 'webhook' },
+          { name: 'receiver2', type: 'email' },
+        ],
+      },
+      getCreateReceiverRoute: jest.fn(() => ({ name: 'create-receiver' })),
+      getReceiverDetailLink:  jest.fn((name) => `detail-${ name }`),
+    };
+
+    const wrapper = shallowMount(Index, {
+      propsData: {
+        value: valueMock,
+        mode:  'create',
+      },
+      global: {
+        mocks: {
+          $store: {
+            getters:  { currentProduct: { inStore: 'test' } },
+            dispatch: jest.fn(() => Promise.resolve({ receiverSchema: {} })),
+          },
+          $router:     { push: jest.fn() },
+          $route:      { name: 'test-route' },
+          $fetchState: { pending: false },
+        }
+      },
+      stubs: {
+        CruResource:       true,
+        NameNsDescription: true,
+        Tabbed:            true,
+        Tab:               true,
+        RouteConfig:       true,
+        ResourceTable:     true,
+        ActionMenu:        true,
+        Loading:           true,
+      }
+    });
+
+    // Ensure the component is rendered
+    expect(wrapper.exists()).toBe(true);
+
+    // Assert that applyDefaults is called
+    expect(valueMock.applyDefaults).toHaveBeenCalledTimes(1);
+
+    // Assert receiverOptions are correctly populated from value.spec.receivers
+    expect(wrapper.vm.receiverOptions).toStrictEqual(['receiver1', 'receiver2']);
+
+    // Assert createReceiverLink is correctly set
+    expect(wrapper.vm.createReceiverLink).toStrictEqual({ name: 'create-receiver' });
+
+    // Assert that receiverTableHeaders has the expected structure (basic check)
+    expect(wrapper.vm.receiverTableHeaders.length).toBeGreaterThan(0);
+    expect(wrapper.vm.receiverTableHeaders[0].name).toBe('name');
+    expect(wrapper.vm.receiverTableHeaders[1].name).toBe('type');
+  });
+
+  // Additional test for editorMode computed property
+  it('editorMode should return VIEW_CODE when mode is _VIEW', () => {
+    const valueMock = {
+      applyDefaults:          jest.fn(),
+      spec:                   { receivers: [] },
+      getCreateReceiverRoute: jest.fn(),
+      getReceiverDetailLink:  jest.fn(),
+    };
+
+    const wrapper = shallowMount(Index, {
+      propsData: {
+        value: valueMock,
+        mode:  _VIEW, // Set mode to _VIEW
+      },
+      global: {
+        mocks: {
+          $store: {
+            getters:  { currentProduct: { inStore: 'test' } },
+            dispatch: jest.fn(() => Promise.resolve({ receiverSchema: {} })),
+          },
+          $router:     { push: jest.fn() },
+          $route:      { name: 'test-route' },
+          $fetchState: { pending: false },
+        },
+      },
+      stubs: {
+        CruResource:       true,
+        NameNsDescription: true,
+        Tabbed:            true,
+        Tab:               true,
+        RouteConfig:       true,
+        ResourceTable:     true,
+        ActionMenu:        true,
+        Loading:           true,
+      }
+    });
+
+    expect(wrapper.vm.editorMode).toBe(EDITOR_MODES.VIEW_CODE);
+  });
+
+  it('editorMode should return EDIT_CODE when mode is not _VIEW', () => {
+    const valueMock = {
+      applyDefaults:          jest.fn(),
+      spec:                   { receivers: [] },
+      getCreateReceiverRoute: jest.fn(),
+      getReceiverDetailLink:  jest.fn(),
+    };
+
+    const wrapper = shallowMount(Index, {
+      propsData: {
+        value: valueMock,
+        mode:  _EDIT, // Set mode to _EDIT
+      },
+      global: {
+        mocks: {
+          $store: {
+            getters:  { currentProduct: { inStore: 'test' } },
+            dispatch: jest.fn(() => Promise.resolve({ receiverSchema: {} })),
+          },
+          $router:     { push: jest.fn() },
+          $route:      { name: 'test-route' },
+          $fetchState: { pending: false },
+        },
+      },
+      stubs: {
+        CruResource:       true,
+        NameNsDescription: true,
+        Tabbed:            true,
+        Tab:               true,
+        RouteConfig:       true,
+        ResourceTable:     true,
+        ActionMenu:        true,
+        Loading:           true,
+      }
+    });
+
+    expect(wrapper.vm.editorMode).toBe(EDITOR_MODES.EDIT_CODE);
+  });
+
+  it('translateReceiverTypes method translates receiver types', () => {
+    const valueMock = {
+      applyDefaults:          jest.fn(),
+      spec:                   { receivers: [] },
+      getCreateReceiverRoute: jest.fn(),
+      getReceiverDetailLink:  jest.fn(),
+    };
+
+    const wrapper = shallowMount(Index, {
+      propsData: {
+        value: valueMock,
+        mode:  'create',
+      },
+      global: {
+        mocks: {
+          $store: {
+            getters:  { currentProduct: { inStore: 'test' } },
+            dispatch: jest.fn(() => Promise.resolve({ receiverSchema: {} })),
+          },
+          $router:     { push: jest.fn() },
+          $route:      { name: 'test-route' },
+          $fetchState: { pending: false },
+        },
+      },
+      stubs: {
+        CruResource:       true,
+        NameNsDescription: true,
+        Tabbed:            true,
+        Tab:               true,
+        RouteConfig:       true,
+        ResourceTable:     true,
+        ActionMenu:        true,
+        Loading:           true,
+      }
+    });
+
+    // Ensure receiverTypes is initialized, then call the method
+    const originalReceiverTypes = [
+      { label: 'alertmanagerConfigReceiver.alerta', value: 'alerta' },
+      { label: 'alertmanagerConfigReceiver.dingtalk', value: 'dingtalk' }
+    ];
+
+    // Manually set receiverTypes for the test (it's normally populated from an import)
+    // In a real scenario, you'd mock the import or ensure it's loaded before the test.
+    // For this test, we'll directly manipulate the vm.
+    wrapper.setData({ receiverTypes: originalReceiverTypes });
+
+    const translatedTypes = wrapper.vm.translateReceiverTypes();
+
+    expect(translatedTypes).toStrictEqual([
+      { label: '%alertmanagerConfigReceiver.alerta%', value: 'alerta' },
+      { label: '%alertmanagerConfigReceiver.dingtalk%', value: 'dingtalk' }
+    ]);
+  });
+});