@rancher/shell 0.3.17 → 0.3.18

package/components/form/__tests__/FileSelector.test.ts

@@ -0,0 +1,76 @@
+/* eslint-disable jest/no-hooks */
+import FileSelector from '@shell/components/form/FileSelector';
+import { mount } from '@vue/test-utils';
+
+describe('component: FileSelector', () => {
+  let wrapper: any;
+
+  beforeEach(() => {
+    jest.restoreAllMocks();
+  });
+  afterEach(() => {
+    wrapper.destroy();
+  });
+
+  const binaryString = Buffer.from('/9j/4AAQSkZJRgABAQAASABIAAD/4QCARXhpZgAATU0AKgAAAAgABQESAAMAAAABAAEAAAEaAAUAAAABAAAASgEbAAUAAAABAAAAUgEoAAMAAAABAAIAAIdpAAQAAAABAAAAWgAAAAAAAABIAAAAAQAAAEgAAAABAAKgAgAEAAAAAQAAADmgAwAEAAAAAQAAAFEAAAAA/+0AOFBob3Rvc2hvcCAzLjAAOEJJTQQEAAAAAAAAOEJJTQQlAAAAAAAQ1B2M2Y8AsgTpgAmY7PhCfv/iAihJQ0NfUFJPRklMRQABAQAAAhgAAAAABDAAAG1udHJSR0IgWFlaIAAAAAAAAAAAAAAAAGFjc3AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD21gABAAAAANMtAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACWRlc2MAAADwAAAAdHJYWVoAAAFkAAAAFGdYWVoAAAF4AAAAFGJYWVoAAAGMAAAAFHJUUkMAAAGgAAAAKGdUUkMAAAGgAAAAKGJUUkMAAAGgAAAAKHd0cHQAAAHIAAAAFGNwcnQAAAHcAAAAPG1sdWMAAAAAAAAAAQAAAAxlblVTAAAAWAAAABwAcwBSAEcAQgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAWFlaIAAAAAAAAG+iAAA49QAAA5BYWVogAAAAAAAAYpkAALeFAAAY2lhZWiAAAAAAAAAkoAAAD4QAALbPcGFyYQAAAAAABAAAAAJmZgAA8qcAAA1ZAAAT0AAAClsAAAAAAAAAAFhZWiAAAAAAAAD21gABAAAAANMtbWx1YwAAAAAAAAABAAAADGVuVVMAAAAgAAAAHABHAG8AbwBnAGwAZQAgAEkAbgBjAC4AIAAyADAAMQA2/8AAEQgAUQA5AwEiAAIRAQMRAf/EAB8AAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKC//EALUQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+v/EAB8BAAMBAQEBAQEBAQEAAAAAAAABAgMEBQYHCAkKC//EALURAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/bAEMAEAsMDgwKEA4NDhIREBMYKBoYFhYYMSMlHSg6Mz08OTM4N0BIXE5ARFdFNzhQbVFXX2JnaGc+TXF5cGR4XGVnY//bAEMBERISGBUYLxoaL2NCOEJjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY//dAAQABP/aAAwDAQACEQMRAD8AdRRRX0B4gUUUUAFFFFABRRRQB//QdRRRX0B4gUUUUAFFFFABRRRQB//RdRRRX0B4gUUUUAFFFFABRRRQB//SdRRRX0B4gUUUUAFFFFABRRRQB//TdRRRX0B4gUUUUAFFFFAwooooA//UdRRRX0B4gUUUUAFFFFAwooooA//Z', 'base64'); // Binary data string
+  const jpegBlobFile = new Blob([binaryString], { type: 'image/jpeg' });
+  const obj = { hello: 'world' };
+  const jsonBlobFile = new Blob([JSON.stringify(obj, null, 2)], { type: 'application/json' });
+
+  it('should render', () => {
+    wrapper = mount(FileSelector, {
+      propsData: { label: 'upload' },
+      mocks:     {},
+      methods:   {},
+    });
+
+    const uploadButton = wrapper.find('.btn');
+
+    expect(wrapper.isVisible()).toBe(true);
+    expect(uploadButton.exists()).toBeTruthy();
+  });
+
+  it('should succeed when loading an image', async() => {
+    wrapper = mount(FileSelector, {
+      propsData: { label: 'upload', accept: 'image/jpeg,image/png,image/svg+xml' },
+      mocks:     {},
+      methods:   {},
+    });
+    const readAsTextSpy = jest.spyOn(FileReader.prototype, 'readAsText');
+
+    const event = {
+      target: {
+        files: [
+          jpegBlobFile
+        ]
+      }
+    };
+
+    await wrapper.vm.fileChange(event);
+    expect(wrapper.emitted('selected')).toHaveLength(1);
+    expect(readAsTextSpy).toHaveBeenCalledWith(jpegBlobFile);
+  });
+
+  it('should fail when file is too big', async() => {
+    wrapper = mount(FileSelector, {
+      propsData: {
+        label: 'upload', accept: 'image/jpeg,image/png,image/svg+xml', byteLimit: 10
+      },
+      mocks:   {},
+      methods: {},
+    });
+    const readAsTextSpy = jest.spyOn(FileReader.prototype, 'readAsText');
+
+    const event = {
+      target: {
+        files: [
+          jpegBlobFile
+        ]
+      }
+    };
+
+    await wrapper.vm.fileChange(event);
+    expect(wrapper.emitted('error')).toHaveLength(1);
+    expect(readAsTextSpy).not.toHaveBeenCalledWith(jsonBlobFile);
+  });
+});

package/components/formatter/ClusterProvider.vue

@@ -12,7 +12,9 @@ export default {
       // model doesn't work for imported K3s clusters, in
       // which case it returns 'k3s' instead of 'imported.'
       // This is the workaround.
-      isImported: props.row.mgmt?.providerForEmberParam === 'import'
+      isImported: props.row?.mgmt?.providerForEmberParam === 'import' ||
+        // when imported cluster is Google GKE
+        props.row?.mgmt?.spec?.gkeConfig?.imported
     };
   },
 };

package/components/formatter/__tests__/ClusterProvider.test.ts

@@ -0,0 +1,24 @@
+import { mount } from '@vue/test-utils';
+import ClusterProvider from '@shell/components/formatter/ClusterProvider.vue';
+
+describe('component: ClusterProvider', () => {
+  const importedGkeClusterInfo = { mgmt: { spec: { gkeConfig: { imported: true } } } };
+  const notImportedGkeClusterInfo = { mgmt: { spec: { gkeConfig: { imported: false } } } };
+  const importedClusterInfoWithProviderForEmberParam = { mgmt: { providerForEmberParam: 'import' } };
+
+  describe('isImported', () => {
+    const testCases = [
+      [importedGkeClusterInfo, true],
+      [notImportedGkeClusterInfo, false],
+      [importedClusterInfoWithProviderForEmberParam, true],
+      [{}, undefined],
+    ];
+
+    it.each(testCases)('should return the isImported value properly based on the props data', (row, expected) => {
+      const wrapper = mount(ClusterProvider, { propsData: { row } });
+
+      expect(wrapper.vm.$data.isImported).toBe(expected);
+    }
+    );
+  });
+});

package/components/nav/WindowManager/ContainerShell.vue

@@ -3,7 +3,6 @@ import { allHash } from '@shell/utils/promise';
 import { addParams } from '@shell/utils/url';
 import { base64Decode, base64Encode } from '@shell/utils/crypto';
 import Select from '@shell/components/form/Select';
-import isEmpty from 'lodash/isEmpty';
 import { NODE } from '@shell/config/types';
 
 import Socket, {
@@ -16,11 +15,14 @@ import Socket, {
 } from '@shell/utils/socket';
 import Window from './Window';
 
-const DEFAULT_COMMAND = [
-  '/bin/sh',
-  '-c',
-  'TERM=xterm-256color; export TERM; [ -x /bin/bash ] && ([ -x /usr/bin/script ] && /usr/bin/script -q -c "/bin/bash" /dev/null || exec /bin/bash) || exec /bin/sh',
-];
+const commands = {
+  linux: [
+    '/bin/sh',
+    '-c',
+    'TERM=xterm-256color; export TERM; [ -x /bin/bash ] && ([ -x /usr/bin/script ] && /usr/bin/script -q -c "/bin/bash" /dev/null || exec /bin/bash) || exec /bin/sh',
+  ],
+  windows: ['cmd']
+};
 
 export default {
   components: { Window, Select },
@@ -40,8 +42,8 @@ export default {
 
     // The height of the window
     height: {
-      type:     Number,
-      required: true,
+      type:    Number,
+      default: undefined,
     },
 
     // The width of the window
@@ -82,6 +84,10 @@ export default {
       backlog:        [],
       node:           null,
       keepAliveTimer: null,
+      errorMsg:       '',
+      backupShells:   ['linux', 'windows'],
+      os:             undefined,
+      retries:        0
     };
   },
 
@@ -120,7 +126,16 @@ export default {
   },
 
   async mounted() {
-    await this.fetchNode();
+    const nodeId = this.pod.spec?.nodeName;
+
+    try {
+      const schema = this.$store.getters[`cluster/schemaFor`](NODE);
+
+      if (schema) {
+        await this.$store.dispatch('cluster/find', { type: NODE, id: nodeId });
+      }
+    } catch {}
+
     await this.setupTerminal();
     await this.connect();
 
@@ -131,26 +146,6 @@ export default {
   },
 
   methods: {
-    async fetchNode() {
-      if (this.node) {
-        return;
-      }
-
-      const nodeId = this.pod.spec?.nodeName;
-
-      if ( !nodeId ) {
-        return;
-      }
-
-      try {
-        this.node = await this.$store.dispatch('cluster/find', {
-          type: NODE,
-          id:   nodeId,
-        });
-      } catch (e) {
-        console.error('Failed to fetch node', nodeId); // eslint-disable-line no-console
-      }
-    },
     async setupTerminal() {
       const docStyle = getComputedStyle(document.querySelector('body'));
       const xterm = await import(/* webpackChunkName: "xterm" */ 'xterm');
@@ -220,11 +215,11 @@ export default {
         return;
       }
 
-      const { node } = this;
-      let cmd = DEFAULT_COMMAND;
-
-      if (!isEmpty(node) && node?.status?.nodeInfo?.operatingSystem === 'windows') {
-        cmd = ['cmd'];
+      if (this.pod.os) {
+        this.os = this.pod.os;
+        this.backupShells = this.backupShells.filter((shell) => shell !== this.pod.os);
+      } else {
+        this.os = this.backupShells.shift();
       }
 
       const url = addParams(
@@ -235,7 +230,7 @@ export default {
           stdin:     1,
           stderr:    1,
           tty:       1,
-          command:   cmd,
+          command:   commands[this.os],
         }
       );
 
@@ -260,6 +255,7 @@ export default {
       this.socket.addEventListener(EVENT_CONNECTING, (e) => {
         this.isOpen = false;
         this.isOpening = true;
+        this.errorMsg = '';
       });
 
       this.socket.addEventListener(EVENT_CONNECT_ERROR, (e) => {
@@ -282,16 +278,44 @@ export default {
       this.socket.addEventListener(EVENT_DISCONNECTED, (e) => {
         this.isOpen = false;
         this.isOpening = false;
+
+        // If we had an error message, try connecting with the next command
+        if (this.errorMsg) {
+          this.terminal.write(this.errorMsg);
+          if (this.backupShells.length && this.retries < 2) {
+            this.retries++;
+            // we're not really counting on this being a reactive change so there's no need to fire the whole action
+            this.pod.os = undefined;
+            // the pod will still return an os if one's been defined in the node so we'll skip the backups if that's the case and rely on retry count to break the retry loop
+            if (!this.pod.os) {
+              this.os = this.backupShells.shift();
+            }
+            this.connect();
+          } else {
+            // Output an message to let he user know none of the shell commands worked
+            this.terminal.write(this.t('wm.containerShell.failed'));
+          }
+        }
       });
 
       this.socket.addEventListener(EVENT_MESSAGE, (e) => {
         const type = e.detail.data.substr(0, 1);
         const msg = base64Decode(e.detail.data.substr(1));
 
+        this.errorMsg = '';
+
         if (`${ type }` === '1') {
+          if (msg) {
+            // we're not really counting on this being a reactive change so there's no need to fire the whole action
+            this.pod.os = this.os;
+          }
           this.terminal.write(msg);
         } else {
           console.error(msg); // eslint-disable-line no-console
+
+          if (`${ type }` === '3') {
+            this.errorMsg = msg;
+          }
         }
       });
 
@@ -316,7 +340,7 @@ export default {
 
       this.fitAddon.fit();
 
-      const { rows, cols } = this.fitAddon.proposeDimensions();
+      const { rows, cols } = this.fitAddon.proposeDimensions() || {};
 
       if (!this.isOpen) {
         return;