@rancher/shell 3.0.9-rc.6 → 3.0.9

package/edit/monitoring.coreos.com.alertmanagerconfig/types/__tests__/slack.spec.ts

@@ -0,0 +1,108 @@
+import { shallowMount } from '@vue/test-utils';
+import Slack from '@shell/edit/monitoring.coreos.com.alertmanagerconfig/types/slack.vue';
+import { Checkbox } from '@components/Form/Checkbox';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import { _CREATE } from '@shell/config/query-params';
+
+describe('component: Slack.vue', () => {
+  const defaultProps = {
+    mode:      'edit',
+    value:     {},
+    namespace: 'test-namespace'
+  };
+
+  it('should render correctly with initial props', () => {
+    const wrapper = shallowMount(Slack, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const headings = wrapper.findAll('h3');
+
+    expect(headings[0].text()).toBe('Target');
+
+    expect(wrapper.findComponent({ name: 'SimpleSecretSelector' }).exists()).toBe(true);
+    expect(wrapper.findAllComponents(LabeledInput)).toHaveLength(2);
+    expect(wrapper.findComponent(Checkbox).exists()).toBe(true);
+  });
+
+  it('should initialize text template in create mode', () => {
+    const wrapper = shallowMount(Slack, {
+      props:  { ...defaultProps, mode: _CREATE },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    expect(wrapper.props('value').text).toBe('{{ template "slack.rancher.text" . }}');
+  });
+
+  it('should update API URL secret', async() => {
+    const wrapper = shallowMount(Slack, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const secretSelector = wrapper.findComponent({ name: 'SimpleSecretSelector' });
+
+    await secretSelector.vm.$emit('updateSecretName', 'my-secret');
+    await secretSelector.vm.$emit('updateSecretKey', 'my-key');
+
+    expect(wrapper.props('value').apiURL.name).toBe('my-secret');
+    expect(wrapper.props('value').apiURL.key).toBe('my-key');
+  });
+
+  it('should update default channel', async() => {
+    const wrapper = shallowMount(Slack, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+    const channelInput = wrapper.findAllComponents(LabeledInput)[0];
+
+    await channelInput.vm.$emit('update:value', '#my-channel');
+    expect(wrapper.props('value').channel).toBe('#my-channel');
+  });
+
+  it('should update proxy URL', async() => {
+    const wrapper = shallowMount(Slack, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+    const proxyInput = wrapper.findAllComponents(LabeledInput)[1];
+
+    await proxyInput.vm.$emit('update:value', 'http://my-proxy.com');
+    expect(wrapper.props('value').httpConfig.proxyURL).toBe('http://my-proxy.com');
+  });
+
+  it('should toggle send resolved alerts', async() => {
+    const wrapper = shallowMount(Slack, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+    const checkbox = wrapper.findComponent(Checkbox);
+
+    await checkbox.vm.$emit('update:value', true);
+    expect(wrapper.props('value').sendResolved).toBe(true);
+  });
+
+  it('should render in view mode', () => {
+    const wrapper = shallowMount(Slack, {
+      props:  { ...defaultProps, mode: 'view' },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    expect(wrapper.findComponent({ name: 'SimpleSecretSelector' }).props('disabled')).toBe(true);
+    const inputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(inputs[0].props('mode')).toBe('view');
+    expect(inputs[1].props('mode')).toBe('view');
+    expect(wrapper.findComponent(Checkbox).props('mode')).toBe('view');
+  });
+
+  it('should show banner if no namespace is provided', () => {
+    const wrapper = shallowMount(Slack, {
+      props:  { ...defaultProps, namespace: '' },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    expect(wrapper.findComponent({ name: 'Banner' }).exists()).toBe(true);
+  });
+});

package/edit/monitoring.coreos.com.alertmanagerconfig/types/pagerduty.vue

@@ -4,10 +4,11 @@ import LabeledSelect from '@shell/components/form/LabeledSelect';
 import { Checkbox } from '@components/Form/Checkbox';
 import SimpleSecretSelector from '@shell/components/form/SimpleSecretSelector';
 import { _VIEW } from '@shell/config/query-params';
+import Banner from '@components/Banner/Banner.vue';
 
 export default {
   components: {
-    Checkbox, LabeledInput, LabeledSelect, SimpleSecretSelector
+    Banner, Checkbox, LabeledInput, LabeledSelect, SimpleSecretSelector
   },
   props: {
     mode: {

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

@@ -0,0 +1,165 @@
+import { shallowMount } from '@vue/test-utils';
+import Auth from '@shell/edit/monitoring.coreos.com.receiver/auth.vue';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+
+describe('component: Auth', () => {
+  const defaultProps = {
+    mode:  'create',
+    value: {},
+  };
+
+  it('should render correctly with default auth type "none"', () => {
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps } });
+
+    expect(wrapper.find('h3').text()).toBe('%monitoringReceiver.auth.label%');
+    const labeledSelect = wrapper.findComponent(LabeledSelect);
+
+    expect(labeledSelect.exists()).toBe(true);
+    expect(wrapper.vm.authType).toBe('none');
+
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(labeledInputs).toHaveLength(0);
+  });
+
+  it('should initialize with "basic_auth" if value contains it', () => {
+    const value = { basic_auth: { username: 'user' } };
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps, value } });
+
+    expect(wrapper.vm.authType).toBe('basic_auth');
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(labeledInputs).toHaveLength(2);
+  });
+
+  it('should initialize with "bearer_token" if value contains it', () => {
+    const value = { bearer_token: 'token' };
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps, value } });
+
+    expect(wrapper.vm.authType).toBe('bearer_token');
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(labeledInputs).toHaveLength(1);
+  });
+
+  it('should initialize with "bearer_token_file" if value contains it', () => {
+    const value = { bearer_token_file: '/path/to/file' };
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps, value } });
+
+    expect(wrapper.vm.authType).toBe('bearer_token_file');
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(labeledInputs).toHaveLength(1);
+  });
+
+  it('should switch to "basic_auth" and display its inputs', async() => {
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps } });
+
+    const labeledSelect = wrapper.findComponent(LabeledSelect);
+
+    await labeledSelect.vm.$emit('update:value', 'basic_auth');
+    await wrapper.vm.$nextTick();
+
+    expect(wrapper.vm.authType).toBe('basic_auth');
+    expect(wrapper.props().value).toHaveProperty('basic_auth');
+    expect(wrapper.props().value.basic_auth).toStrictEqual({});
+
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(labeledInputs).toHaveLength(2);
+    expect(labeledInputs[0].props().label).toBe('%monitoringReceiver.auth.username%');
+    expect(labeledInputs[1].props().label).toBe('%monitoringReceiver.auth.password%');
+  });
+
+  it('should update basic_auth username and password', async() => {
+    const value = { basic_auth: { username: 'initial' } };
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps, value } });
+
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+
+    await labeledInputs[0].vm.$emit('update:value', 'testuser');
+    await labeledInputs[1].vm.$emit('update:value', 'testpass');
+
+    expect(wrapper.props().value.basic_auth.username).toBe('testuser');
+    expect(wrapper.props().value.basic_auth.password).toBe('testpass');
+  });
+
+  it('should switch to "bearer_token" and display its input', async() => {
+    const value = { basic_auth: { username: 'user' } };
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps, value } });
+
+    const labeledSelect = wrapper.findComponent(LabeledSelect);
+
+    await labeledSelect.vm.$emit('update:value', 'bearer_token');
+    await wrapper.vm.$nextTick();
+
+    expect(wrapper.vm.authType).toBe('bearer_token');
+    expect(wrapper.props().value).not.toHaveProperty('basic_auth');
+    expect(wrapper.props().value).toHaveProperty('bearer_token');
+    expect(wrapper.props().value.bearer_token).toBe('');
+
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(labeledInputs).toHaveLength(1);
+    expect(labeledInputs[0].props().label).toBe('%monitoringReceiver.auth.bearerToken.label%');
+  });
+
+  it('should update bearer_token', async() => {
+    const value = { bearer_token: 'initial-token' };
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps, value } });
+    const labeledInput = wrapper.findComponent(LabeledInput);
+
+    await labeledInput.vm.$emit('update:value', 'secret-token');
+
+    expect(wrapper.props().value.bearer_token).toBe('secret-token');
+  });
+
+  it('should switch to "bearer_token_file" and display its input', async() => {
+    const value = { basic_auth: { username: 'user' } };
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps, value } });
+
+    const labeledSelect = wrapper.findComponent(LabeledSelect);
+
+    await labeledSelect.vm.$emit('update:value', 'bearer_token_file');
+    await wrapper.vm.$nextTick();
+
+    expect(wrapper.vm.authType).toBe('bearer_token_file');
+    expect(wrapper.props().value).not.toHaveProperty('basic_auth');
+    expect(wrapper.props().value).toHaveProperty('bearer_token_file');
+    expect(wrapper.props().value.bearer_token_file).toBe('');
+
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(labeledInputs).toHaveLength(1);
+    expect(labeledInputs[0].props().label).toBe('%monitoringReceiver.auth.bearerTokenFile.label%');
+  });
+
+  it('should update bearer_token_file', async() => {
+    const value = { bearer_token_file: '/initial/path' };
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps, value } });
+    const labeledInput = wrapper.findComponent(LabeledInput);
+
+    await labeledInput.vm.$emit('update:value', '/path/to/token/file');
+
+    expect(wrapper.props().value.bearer_token_file).toBe('/path/to/token/file');
+  });
+
+  it('should switch from a selected auth type back to "none"', async() => {
+    const value = { basic_auth: { username: 'user' } };
+    const wrapper = shallowMount(Auth, { props: { ...defaultProps, value } });
+
+    expect(wrapper.vm.authType).toBe('basic_auth');
+
+    const labeledSelect = wrapper.findComponent(LabeledSelect);
+
+    await labeledSelect.vm.$emit('update:value', 'none');
+    await wrapper.vm.$nextTick();
+
+    expect(wrapper.vm.authType).toBe('none');
+    expect(wrapper.props().value).not.toHaveProperty('basic_auth');
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(labeledInputs).toHaveLength(0);
+  });
+});

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

@@ -0,0 +1,153 @@
+import { shallowMount } from '@vue/test-utils';
+import { _EDIT } from '@shell/config/query-params';
+import Index from '../index.vue';
+
+describe('shell/edit/monitoring.coreos.com.receiver/index.vue', () => {
+  const mockStore = (resourceFields = {}) => ({
+    getters: {
+      'cluster/schemaFor': jest.fn(() => ({ resourceFields })),
+      clusterId:           'c-cluster-123',
+      'i18n/t':            (key) => key,
+    },
+    dispatch: jest.fn(),
+  });
+
+  const baseValue = () => ({
+    spec: {
+      name:              'test-receiver',
+      email_configs:     [],
+      slack_configs:     [],
+      webhook_configs:   [],
+      pagerduty_configs: [],
+      opsgenie_configs:  [],
+      victorops_configs: [],
+      pushover_configs:  [],
+      wechat_configs:    [],
+    },
+    applyDefaults:      jest.fn(),
+    save:               jest.fn(),
+    done:               jest.fn(),
+    registerBeforeHook: jest.fn(),
+    doneRoute:          {},
+  });
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('should mount and initialize data correctly in create mode', () => {
+    const value = baseValue();
+    const wrapper = shallowMount(Index, {
+      props: {
+        value,
+        mode: 'create'
+      },
+      global: {
+        mocks: {
+          $store:      mockStore(value.spec),
+          $fetchState: { pending: false },
+          $route:      { name: 'test-route' },
+        }
+      }
+    });
+
+    expect(wrapper.vm.suffixYaml).toBe('');
+  });
+
+  it('should correctly process email configs with smarthost on edit mode', () => {
+    const valueWithSmarthost = baseValue();
+
+    valueWithSmarthost.spec.email_configs = [{ smarthost: 'smtp.example.com:587' }];
+    const wrapper = shallowMount(Index, {
+      props: {
+        value: valueWithSmarthost,
+        mode:  _EDIT
+      },
+      global: {
+        mocks: {
+          $store:      mockStore(),
+          $fetchState: { pending: false },
+          $route:      { name: 'test-route' },
+        }
+      }
+    });
+
+    expect(wrapper.vm.value.spec.email_configs[0].host).toBe('smtp.example.com');
+    expect(wrapper.vm.value.spec.email_configs[0].port).toBe('587');
+    expect(wrapper.vm.value.spec.email_configs[0].smarthost).toBeUndefined();
+  });
+
+  it('should call saveOverride which calls save method on success', async() => {
+    const wrapper = shallowMount(Index, {
+      props: {
+        value: baseValue(),
+        mode:  _EDIT,
+      },
+      global: {
+        mocks: {
+          $store:      mockStore(),
+          $fetchState: { pending: false },
+          $route:      { name: 'test-route' },
+        }
+      },
+    });
+
+    const spy = jest.spyOn(wrapper.vm, 'save');
+    const buttonDone = jest.fn();
+
+    wrapper.vm.saveOverride(buttonDone);
+    expect(spy).toHaveBeenCalledTimes(1);
+  });
+
+  it('should call saveOverride which populates errors on yaml error', async() => {
+    const wrapper = shallowMount(Index, {
+      props: {
+        value: baseValue(),
+        mode:  _EDIT,
+      },
+      global: {
+        mocks: {
+          $store:      mockStore(),
+          $fetchState: { pending: false },
+          $route:      { name: 'test-route' },
+        }
+      },
+    });
+
+    const spy = jest.spyOn(wrapper.vm, 'save');
+
+    wrapper.vm.yamlError = 'Invalid YAML';
+    const buttonDone = jest.fn();
+
+    wrapper.vm.saveOverride(buttonDone);
+
+    expect(wrapper.vm.errors).toContain('Invalid YAML');
+    expect(spy).not.toHaveBeenCalled();
+    expect(buttonDone).toHaveBeenCalledWith(false);
+  });
+
+  it('should call createSmarthost and update email configs', () => {
+    const value = baseValue();
+
+    value.spec.email_configs = [{ host: 'smtp.example.com', port: '587' }];
+
+    const wrapper = shallowMount(Index, {
+      props: {
+        value,
+        mode: _EDIT
+      },
+      global: {
+        mocks: {
+          $store:      mockStore(),
+          $fetchState: { pending: false },
+          $route:      { name: 'test-route' },
+        }
+      }
+    });
+
+    wrapper.vm.createSmarthost();
+    expect(value.spec.email_configs[0].smarthost).toBe('smtp.example.com:587');
+    expect(value.spec.email_configs[0].host).toBeUndefined();
+    expect(value.spec.email_configs[0].port).toBeUndefined();
+  });
+});

package/edit/monitoring.coreos.com.receiver/__tests__/tls.spec.ts

@@ -0,0 +1,115 @@
+import { shallowMount } from '@vue/test-utils';
+import Tls from '@shell/edit/monitoring.coreos.com.receiver/tls.vue';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import { Banner } from '@components/Banner';
+
+describe('shell/edit/monitoring.coreos.com.receiver/tls.vue', () => {
+  const mockValue = {
+    tls_config: {
+      ca_file: 'ca.pem', cert_file: 'cert.pem', key_file: 'key.pem'
+    }
+  };
+  const mockMode = 'edit';
+
+  it('should mount correctly', () => {
+    const wrapper = shallowMount(Tls, {
+      props: {
+        value: mockValue,
+        mode:  mockMode,
+      },
+    });
+
+    expect(wrapper.exists()).toBe(true);
+  });
+
+  it('should initialize tls_config if it does not exist', () => {
+    const wrapper = shallowMount(Tls, {
+      props: {
+        value: {},
+        mode:  mockMode,
+      },
+    });
+
+    expect(wrapper.props().value.tls_config).toBeDefined();
+    expect(wrapper.props().value.tls_config).toStrictEqual({});
+  });
+
+  it('should render all LabeledInput components with correct labels and modes', () => {
+    const wrapper = shallowMount(Tls, {
+      props: {
+        value: mockValue,
+        mode:  mockMode,
+      },
+    });
+
+    const inputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(inputs).toHaveLength(3);
+
+    const labels = [
+      '%monitoring.receiver.tls.caFilePath.label%',
+      '%monitoring.receiver.tls.certFilePath.label%',
+      '%monitoring.receiver.tls.keyFilePath.label%',
+    ];
+
+    inputs.forEach((input, i) => {
+      expect(input.props('label')).toBe(labels[i]);
+      expect(input.props('mode')).toBe(mockMode);
+    });
+  });
+
+  it('should bind LabeledInput values correctly', () => {
+    const wrapper = shallowMount(Tls, {
+      props: {
+        value: mockValue,
+        mode:  mockMode,
+      },
+    });
+
+    const inputs = wrapper.findAllComponents(LabeledInput);
+
+    expect(inputs[0].props('value')).toBe(mockValue.tls_config.ca_file);
+    expect(inputs[1].props('value')).toBe(mockValue.tls_config.cert_file);
+    expect(inputs[2].props('value')).toBe(mockValue.tls_config.key_file);
+  });
+
+  it('should update the value when LabeledInput emits an update', async() => {
+    const wrapper = shallowMount(Tls, {
+      props: {
+        value: {
+          tls_config: {
+            ca_file: '', cert_file: '', key_file: ''
+          }
+        },
+        mode: mockMode,
+      },
+    });
+
+    const inputs = wrapper.findAllComponents(LabeledInput);
+    const newCaFile = 'new-ca.pem';
+    const newCertFile = 'new-cert.pem';
+    const newKeyFile = 'new-key.pem';
+
+    await inputs[0].vm.$emit('update:value', newCaFile);
+    await inputs[1].vm.$emit('update:value', newCertFile);
+    await inputs[2].vm.$emit('update:value', newKeyFile);
+
+    expect(wrapper.props().value.tls_config.ca_file).toBe(newCaFile);
+    expect(wrapper.props().value.tls_config.cert_file).toBe(newCertFile);
+    expect(wrapper.props().value.tls_config.key_file).toBe(newKeyFile);
+  });
+
+  it('should display the informational banner', () => {
+    const wrapper = shallowMount(Tls, {
+      props: {
+        value: mockValue,
+        mode:  mockMode,
+      },
+    });
+
+    const banner = wrapper.findComponent(Banner);
+
+    expect(banner.exists()).toBe(true);
+    expect(banner.props('color')).toBe('info');
+  });
+});

package/edit/monitoring.coreos.com.receiver/types/__tests__/email.spec.ts

@@ -0,0 +1,86 @@
+
+import { shallowMount } from '@vue/test-utils';
+import Email from '@shell/edit/monitoring.coreos.com.receiver/types/email.vue';
+import TLS from '@shell/edit/monitoring.coreos.com.receiver/tls.vue';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import { Checkbox } from '@components/Form/Checkbox';
+import { _EDIT } from '@shell/config/query-params';
+
+describe('component: Email', () => {
+  const mockStore = {
+    getters: {
+      'i18n/t':      (key: string) => key,
+      'i18n/exists': () => true,
+    },
+  };
+
+  const requiredProps = {
+    mode:  _EDIT,
+    value: {},
+  };
+
+  it('should render all child components', () => {
+    const wrapper = shallowMount(Email, {
+      props:  requiredProps,
+      global: { mocks: mockStore },
+    });
+
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+    const checkboxes = wrapper.findAllComponents(Checkbox);
+    const tls = wrapper.findComponent(TLS);
+
+    expect(labeledInputs).toHaveLength(6);
+    expect(checkboxes).toHaveLength(2);
+    expect(tls.exists()).toBe(true);
+  });
+
+  it('should pass down the mode prop to child components', () => {
+    const wrapper = shallowMount(Email, {
+      props:  requiredProps,
+      global: { mocks: mockStore },
+    });
+
+    const labeledInputs = wrapper.findAllComponents(LabeledInput);
+    const checkboxes = wrapper.findAllComponents(Checkbox);
+    const tls = wrapper.findComponent(TLS);
+
+    labeledInputs.forEach((input) => {
+      expect(input.props().mode).toBe(_EDIT);
+    });
+
+    checkboxes.forEach((checkbox) => {
+      expect(checkbox.props().mode).toBe(_EDIT);
+    });
+
+    expect(tls.props().mode).toBe(_EDIT);
+  });
+
+  it('should initialize send_resolved and require_tls to false if not present', () => {
+    const value = {};
+    const wrapper = shallowMount(Email, {
+      props: {
+        ...requiredProps,
+        value,
+      },
+      global: { mocks: mockStore },
+    });
+
+    expect(wrapper.props().value.send_resolved).toBe(false);
+    expect(wrapper.props().value.require_tls).toBe(false);
+  });
+
+  it('should emit an input event when TLS component emits an update:value event', async() => {
+    const wrapper = shallowMount(Email, {
+      props:  requiredProps,
+      global: { mocks: mockStore },
+    });
+
+    const tls = wrapper.findComponent(TLS);
+    const updatedValue = { smarthost: 'new-value' };
+
+    await tls.vm.$emit('update:value', updatedValue);
+
+    expect(wrapper.emitted('input')).toHaveLength(1);
+    expect(wrapper.emitted('input')?.[0][0]).toStrictEqual(updatedValue);
+  });
+});