@rancher/shell 3.0.9-rc.5 → 3.0.9

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

@@ -0,0 +1,157 @@
+import { shallowMount } from '@vue/test-utils';
+import Opsgenie from '@shell/edit/monitoring.coreos.com.alertmanagerconfig/types/opsgenie.vue';
+import { Checkbox } from '@components/Form/Checkbox';
+
+describe('component: Opsgenie.vue', () => {
+  const defaultProps = {
+    mode:      'edit',
+    value:     { responders: [] },
+    namespace: 'test-namespace'
+  };
+
+  it('should render correctly with initial props', () => {
+    const wrapper = shallowMount(Opsgenie, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const headings = wrapper.findAll('h3');
+
+    expect(headings[0].text()).toBe('Target');
+    expect(headings[1].text()).toBe('Responders');
+    expect(wrapper.findComponent({ name: 'SimpleSecretSelector' }).exists()).toBe(true);
+    expect(wrapper.findComponent({ name: 'LabeledInput' }).exists()).toBe(true);
+    expect(wrapper.findComponent(Checkbox).exists()).toBe(true);
+    expect(wrapper.findComponent({ name: 'ArrayList' }).exists()).toBe(true);
+  });
+
+  it('should update proxy URL', async() => {
+    const wrapper = shallowMount(Opsgenie, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const labeledInput = wrapper.findComponent({ name: 'LabeledInput' });
+
+    await labeledInput.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 checkbox', async() => {
+    const wrapper = shallowMount(Opsgenie, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const checkbox = wrapper.findComponent(Checkbox);
+
+    await checkbox.vm.$emit('update:value', false);
+    expect(wrapper.props('value').sendResolved).toBe(false);
+  });
+
+  it('should handle API key secret updates', async() => {
+    const wrapper = shallowMount(Opsgenie, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const secretSelector = wrapper.findComponent({ name: 'SimpleSecretSelector' });
+
+    await secretSelector.vm.$emit('updateSecretName', 'my-secret-name');
+    await secretSelector.vm.$emit('updateSecretKey', 'my-secret-key');
+
+    expect(wrapper.props('value').apiKey.name).toBe('my-secret-name');
+    expect(wrapper.props('value').apiKey.key).toBe('my-secret-key');
+  });
+
+  it('should add and update a responder', async() => {
+    const wrapper = shallowMount(Opsgenie, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const arrayList = wrapper.findComponent({ name: 'ArrayList' });
+
+    await arrayList.vm.$emit('update:value', [wrapper.vm.defaultResponder]);
+
+    const responders = wrapper.vm.responders;
+
+    expect(responders).toHaveLength(1);
+    expect(responders[0].type).toBe('team');
+    expect(responders[0].target).toBe('id');
+
+    // Manually change responder type and check if watch updates the value prop
+    responders[0].type = 'user';
+    await wrapper.vm.$nextTick();
+    expect(wrapper.props('value').responders[0].type).toBe('user');
+
+    // Test updateResponder method
+    wrapper.vm.updateResponder({ selected: 'username', text: 'test-user' }, responders[0]);
+    await wrapper.vm.$nextTick();
+    expect(responders[0].target).toBe('username');
+    expect(responders[0].value).toBe('test-user');
+    // Check that the watcher has updated the value prop correctly
+    expect(wrapper.props('value').responders[0]).toStrictEqual({ type: 'user', username: 'test-user' });
+  });
+
+  it('should remove a responder', async() => {
+    const wrapper = shallowMount(Opsgenie, {
+      props: {
+        ...defaultProps,
+        value: {
+          responders: [
+            {
+              type: 'team',
+              id:   'team-id'
+            }
+          ]
+        }
+      },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    // Simulate the internal workings of ArrayList for removing an item
+    wrapper.vm.responders.splice(0, 1);
+    await wrapper.vm.$nextTick();
+
+    expect(wrapper.vm.responders).toHaveLength(0);
+    expect(wrapper.props('value').responders).toHaveLength(0);
+  });
+
+  it('should render in view mode', () => {
+    const wrapper = shallowMount(Opsgenie, {
+      props: {
+        mode:  'view',
+        value: {
+          httpConfig:   { proxyURL: 'http://view-proxy.com' },
+          sendResolved: false,
+          responders:   [
+            {
+              type: 'user',
+              name: 'view-user'
+            }
+          ]
+        },
+        namespace: 'test-namespace'
+      },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const labeledInput = wrapper.findComponent({ name: 'LabeledInput' });
+    const checkbox = wrapper.findComponent(Checkbox);
+    const arrayList = wrapper.findComponent({ name: 'ArrayList' });
+
+    expect(labeledInput.props('mode')).toBe('view');
+    expect(checkbox.props('mode')).toBe('view');
+    expect(arrayList.props('mode')).toBe('view');
+
+    const responder = wrapper.vm.responders[0];
+
+    expect(responder.type).toBe('user');
+    expect(responder.target).toBe('name');
+    expect(responder.value).toBe('view-user');
+    expect(wrapper.vm.typeLabel(responder.type)).toBe('User');
+    expect(wrapper.vm.targetLabel(responder.target)).toBe('Name');
+  });
+});

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

@@ -0,0 +1,132 @@
+import { shallowMount } from '@vue/test-utils';
+import PagerDuty from '@shell/edit/monitoring.coreos.com.alertmanagerconfig/types/pagerduty.vue';
+import { Checkbox } from '@components/Form/Checkbox';
+
+describe('component: PagerDuty.vue', () => {
+  const defaultProps = {
+    mode:      'edit',
+    value:     {},
+    namespace: 'test-namespace'
+  };
+
+  it('should render correctly with initial props', () => {
+    const wrapper = shallowMount(PagerDuty, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const headings = wrapper.findAll('h3');
+
+    expect(headings[0].text()).toBe('Target');
+
+    expect(wrapper.findComponent({ name: 'LabeledSelect' }).exists()).toBe(true);
+    expect(wrapper.findComponent({ name: 'SimpleSecretSelector' }).exists()).toBe(true);
+    expect(wrapper.findComponent({ name: 'LabeledInput' }).exists()).toBe(true);
+    expect(wrapper.findComponent(Checkbox).exists()).toBe(true);
+  });
+
+  it('should show routing key selector for "Events API v2"', () => {
+    const wrapper = shallowMount(PagerDuty, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+    const selector = wrapper.findComponent({ name: 'SimpleSecretSelector' });
+
+    expect(selector.props('secretNameLabel')).toContain('monitoring.alertmanagerConfig.pagerDuty.routingKey');
+  });
+
+  it('should show service key selector for "Prometheus"', async() => {
+    const wrapper = shallowMount(PagerDuty, {
+      props:  { ...defaultProps, value: { serviceKey: { name: 's', key: 'k' } } },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+    const selector = wrapper.findComponent({ name: 'SimpleSecretSelector' });
+
+    expect(selector.props('secretNameLabel')).toContain('monitoring.alertmanagerConfig.pagerDuty.serviceKey');
+  });
+
+  it('should clear other key when integration type changes', async() => {
+    const wrapper = shallowMount(PagerDuty, {
+      props:  { ...defaultProps, value: { routingKey: { name: 'r', key: 'k' } } },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    wrapper.vm.integrationType = 'Prometheus';
+    await wrapper.vm.$nextTick();
+
+    expect(wrapper.props('value').routingKey).toBeNull();
+  });
+
+  it('should update routing key secret', async() => {
+    const wrapper = shallowMount(PagerDuty, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const secretSelector = wrapper.findComponent({ name: 'SimpleSecretSelector' });
+
+    await secretSelector.vm.$emit('updateSecretName', 'routing-name');
+    await secretSelector.vm.$emit('updateSecretKey', 'routing-key');
+
+    expect(wrapper.props('value').routingKey.name).toBe('routing-name');
+    expect(wrapper.props('value').routingKey.key).toBe('routing-key');
+  });
+
+  it('should update service key secret', async() => {
+    const wrapper = shallowMount(PagerDuty, {
+      props:  { ...defaultProps, value: { serviceKey: {} } },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    const secretSelector = wrapper.findComponent({ name: 'SimpleSecretSelector' });
+
+    await secretSelector.vm.$emit('updateSecretName', 'service-name');
+    await secretSelector.vm.$emit('updateSecretKey', 'service-key');
+
+    expect(wrapper.props('value').serviceKey.name).toBe('service-name');
+    expect(wrapper.props('value').serviceKey.key).toBe('service-key');
+  });
+
+  it('should update proxy URL', async() => {
+    const wrapper = shallowMount(PagerDuty, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+    const labeledInput = wrapper.findComponent({ name: 'LabeledInput' });
+
+    await labeledInput.vm.$emit('update:value', 'http://proxy.com');
+    expect(wrapper.props('value').httpConfig.proxyURL).toBe('http://proxy.com');
+  });
+
+  it('should toggle send resolved alerts', async() => {
+    const wrapper = shallowMount(PagerDuty, {
+      props:  defaultProps,
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+    const checkbox = wrapper.findComponent(Checkbox);
+
+    await checkbox.vm.$emit('update:value', false);
+    expect(wrapper.props('value').sendResolved).toBe(false);
+  });
+
+  it('should render in view mode', () => {
+    const wrapper = shallowMount(PagerDuty, {
+      props:  { ...defaultProps, mode: 'view' },
+      global: { mocks: { $fetchState: { pending: false, error: null } } }
+    });
+
+    expect(wrapper.findComponent({ name: 'LabeledSelect' }).attributes('mode')).toBe('view');
+    expect(wrapper.findComponent({ name: 'SimpleSecretSelector' }).props('disabled')).toBe(true);
+    expect(wrapper.findComponent({ name: 'LabeledInput' }).attributes('mode')).toBe('view');
+    expect(wrapper.findComponent(Checkbox).attributes('mode')).toBe('view');
+  });
+
+  it('should show banner if no namespace is provided', () => {
+    const wrapper = shallowMount(PagerDuty, {
+      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/__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);
+  });
+});