@oceanum/oceanumlab 4.6.2 → 4.7.1

package/src/__tests__/Tabs.spec.tsx

@@ -0,0 +1,168 @@
+import { ReactWidget } from '@jupyterlab/ui-components';
+import { Widget } from '@lumino/widgets';
+import { readFileSync } from 'fs';
+import { join } from 'path';
+import React from 'react';
+
+import { ITab, Tabs } from '../Tabs';
+
+/** A widget whose sole job is to render the tab strip so the DOM can be inspected. */
+class Harness extends ReactWidget {
+  selected = 'one';
+  readonly selections: string[] = [];
+
+  constructor(private readonly _tabs: ITab[]) {
+    super();
+  }
+
+  render(): React.ReactElement {
+    return (
+      <Tabs
+        tabs={this._tabs}
+        selected={this.selected}
+        onSelect={id => {
+          this.selections.push(id);
+          this.selected = id;
+          this.update();
+        }}
+      />
+    );
+  }
+}
+
+const TABS: ITab[] = [
+  { id: 'one', label: 'One', render: () => <p>first pane</p> },
+  { id: 'two', label: 'Two', render: () => <p>second pane</p> },
+  { id: 'three', label: 'Three', render: () => <p>third pane</p> }
+];
+
+async function mount(): Promise<Harness> {
+  const widget = new Harness(TABS);
+  Widget.attach(widget, document.body);
+  // ReactWidget renders on an animation frame, so wait for the first pane rather than
+  // sleeping a fixed 50ms and hoping. That wait was enough on a warm run and not on a cold
+  // one: the first run after a fresh install, with an empty ts-jest cache, rendered nothing
+  // in time and every test here failed at once with zero panes -- which reads like a broken
+  // component rather than a slow one.
+  const deadline = Date.now() + 4000;
+  for (;;) {
+    if (widget.node.querySelector('[role="tabpanel"]')) {
+      return widget;
+    }
+    if (Date.now() > deadline) {
+      throw new Error('Tabs rendered no panes within 4s');
+    }
+    await new Promise(resolve => setTimeout(resolve, 25));
+  }
+}
+
+function strip(widget: Harness): HTMLElement[] {
+  return Array.from(widget.node.querySelectorAll<HTMLElement>('[role="tab"]'));
+}
+
+function panels(widget: Harness): HTMLElement[] {
+  return Array.from(
+    widget.node.querySelectorAll<HTMLElement>('[role="tabpanel"]')
+  );
+}
+
+describe('Tabs', () => {
+  it('marks only the selected tab, and puts only it in the tab order', async () => {
+    const widget = await mount();
+    const tabs = strip(widget);
+
+    expect(tabs.map(t => t.textContent)).toEqual(['One', 'Two', 'Three']);
+    expect(tabs.map(t => t.getAttribute('aria-selected'))).toEqual([
+      'true',
+      'false',
+      'false'
+    ]);
+    // A single tab stop for the strip: Tab moves past it, arrows move within it.
+    expect(tabs.map(t => t.tabIndex)).toEqual([0, -1, -1]);
+
+    widget.dispose();
+  });
+
+  it('keeps every pane mounted and hides the inactive ones', async () => {
+    // Unmounting would discard the AI conversation whenever the user switches away.
+    const widget = await mount();
+    const rendered = panels(widget);
+
+    expect(rendered).toHaveLength(3);
+    expect(rendered.map(p => p.hidden)).toEqual([false, true, true]);
+    expect(widget.node.textContent).toContain('second pane');
+
+    widget.dispose();
+  });
+
+  it('the stylesheet actually hides them', async () => {
+    // `hidden` is only a hint: an author `display` on .oceanum-tabpanel overrides the
+    // user agent's `[hidden] { display: none }`, and asserting the IDL property above
+    // cannot see that. This renders the real stylesheet and asks for the computed value.
+    const css = readFileSync(
+      join(__dirname, '..', '..', 'style', 'index.css'),
+      'utf8'
+    );
+    const style = document.createElement('style');
+    style.textContent = css;
+    document.head.appendChild(style);
+
+    const widget = await mount();
+    const [active, inactive] = panels(widget);
+    expect(getComputedStyle(active).display).not.toBe('none');
+    expect(getComputedStyle(inactive).display).toBe('none');
+
+    widget.dispose();
+    style.remove();
+  });
+
+  it('moves with the arrow keys, wrapping at both ends', async () => {
+    const widget = await mount();
+    // ReactWidget re-renders on an animation frame, so each key has to land on the
+    // render that the previous one produced.
+    const settle = (): Promise<void> =>
+      new Promise(resolve => setTimeout(resolve, 50));
+
+    strip(widget)[0].dispatchEvent(
+      new KeyboardEvent('keydown', { key: 'ArrowRight', bubbles: true })
+    );
+    expect(widget.selections.pop()).toBe('two');
+    await settle();
+
+    strip(widget)[1].dispatchEvent(
+      new KeyboardEvent('keydown', { key: 'ArrowLeft', bubbles: true })
+    );
+    expect(widget.selections.pop()).toBe('one');
+    await settle();
+
+    // Wrapping: left from the first tab reaches the last.
+    strip(widget)[0].dispatchEvent(
+      new KeyboardEvent('keydown', { key: 'ArrowLeft', bubbles: true })
+    );
+    expect(widget.selections.pop()).toBe('three');
+
+    widget.dispose();
+  });
+
+  it('jumps to the ends with Home and End', async () => {
+    const widget = await mount();
+
+    strip(widget)[0].dispatchEvent(
+      new KeyboardEvent('keydown', { key: 'End', bubbles: true })
+    );
+    expect(widget.selections.pop()).toBe('three');
+
+    widget.dispose();
+  });
+
+  it('falls back to the first tab when the selection names no tab', async () => {
+    const widget = new Harness(TABS);
+    widget.selected = 'gone';
+    Widget.attach(widget, document.body);
+    await new Promise(resolve => setTimeout(resolve, 50));
+
+    expect(strip(widget)[0].getAttribute('aria-selected')).toBe('true');
+
+    widget.dispose();
+  });
+});

package/src/__tests__/aiBackend.spec.ts

@@ -0,0 +1,271 @@
+import {
+  ACCESS_TOKEN_COMMAND,
+  SIGN_IN_COMMAND,
+  SIGN_OUT_COMMAND,
+  aiBackendUrl,
+  aiCredentialSource,
+  canSignIn,
+  isSignedIn,
+  resolveAiCredential,
+  signInToken,
+  type AuthCommands
+} from '../aiBackend';
+import { OCEANUM_AI_BACKEND_URL } from '../constants';
+import { validHttpUrl } from '../httpUrl';
+
+describe('aiBackendUrl', () => {
+  it('is production when the deployment names no address', () => {
+    // What index.ts passes when the sign-in environment has no `ai` URL, or there is no
+    // sign-in at all.
+    expect(aiBackendUrl('')).toBe(OCEANUM_AI_BACKEND_URL);
+    expect(aiBackendUrl(undefined)).toBe('https://ai.oceanum.io');
+  });
+
+  it.each([
+    ['as it is', 'https://ai.oceanum.tech', 'https://ai.oceanum.tech'],
+    [
+      'without a trailing slash',
+      'https://ai.oceanum.tech/',
+      'https://ai.oceanum.tech'
+    ],
+    ['trimmed', '  https://ai.oceanum.tech/  ', 'https://ai.oceanum.tech'],
+    [
+      'over plain http, with a port',
+      'http://localhost:8000/',
+      'http://localhost:8000'
+    ],
+    [
+      'with a path prefix',
+      'https://example.test/ai//',
+      'https://example.test/ai'
+    ],
+    [
+      'without a query or fragment',
+      'https://ai.oceanum.tech/?x=1#y',
+      'https://ai.oceanum.tech'
+    ]
+  ])('takes an http(s) address %s', (_, value, expected) => {
+    expect(aiBackendUrl(value)).toBe(expected);
+  });
+
+  it.each([
+    ['empty', ''],
+    ['blank', '   '],
+    ['missing', undefined],
+    ['null', null],
+    ['not a URL', 'not a url'],
+    ['a relative path', '/api'],
+    ['a javascript: URL', 'javascript:alert(1)'],
+    ['a file: URL', 'file:///etc/passwd']
+  ])('falls back to the default for %s', (_, value) => {
+    expect(aiBackendUrl(value)).toBe('https://ai.oceanum.io');
+  });
+});
+
+describe('validHttpUrl', () => {
+  it('falls back to the fallback it is given', () => {
+    expect(validHttpUrl('ftp://x', 'https://fallback.test').href).toBe(
+      'https://fallback.test/'
+    );
+  });
+});
+
+describe('resolveAiCredential', () => {
+  const never = jest.fn(async (): Promise<unknown> => 'unused');
+
+  beforeEach(() => never.mockClear());
+
+  it('uses a pasted token, trimmed, without asking for the sign-in', async () => {
+    expect(await resolveAiCredential('  a-token \n', never)).toEqual({
+      source: 'datamesh-token',
+      headers: { 'X-Datamesh-Token': 'a-token' }
+    });
+    expect(never).not.toHaveBeenCalled();
+  });
+
+  it.each([
+    ['no', undefined],
+    ['a null', null],
+    ['an empty', ''],
+    ['a blank', ' \t ']
+  ])(
+    'uses the sign-in as a bearer token with %s pasted token',
+    async (_, pasted) => {
+      expect(await resolveAiCredential(pasted, async () => ' a-jwt ')).toEqual({
+        source: 'sign-in',
+        headers: { Authorization: 'Bearer a-jwt' }
+      });
+    }
+  );
+
+  it.each([
+    ['signed out', async (): Promise<unknown> => null],
+    ['an empty token', async (): Promise<unknown> => ''],
+    ['a blank token', async (): Promise<unknown> => '   '],
+    ['a non-string', async (): Promise<unknown> => ({ token: 'a-jwt' })],
+    ['a number', async (): Promise<unknown> => 42],
+    [
+      'a rejection',
+      (): Promise<unknown> => Promise.reject(new Error('sign-in failed'))
+    ],
+    [
+      'a throw',
+      (): Promise<unknown> => {
+        throw new Error('sign-in failed');
+      }
+    ]
+  ])('has no credential without a pasted token and %s', async (_, get) => {
+    expect(await resolveAiCredential('', get)).toBeNull();
+  });
+});
+
+/**
+ * A host registry: `commands` are registered, `enabled`/`visible` say what its
+ * queries answer. Queries must never execute anything.
+ */
+const host = (
+  commands: Record<string, () => unknown>,
+  { enabled = [] as string[], visible = [] as string[] } = {}
+) => ({
+  hasCommand: jest.fn((id: string) => id in commands),
+  execute: jest.fn(async (id: string) => commands[id]()),
+  isEnabled: jest.fn((id: string) => enabled.includes(id)),
+  isVisible: jest.fn((id: string) => visible.includes(id))
+});
+
+const asCommands = (commands: ReturnType<typeof host>): AuthCommands =>
+  commands as unknown as AuthCommands;
+
+describe('canSignIn and isSignedIn', () => {
+  const all = {
+    [ACCESS_TOKEN_COMMAND]: () => 'a-jwt',
+    [SIGN_IN_COMMAND]: (): void => undefined,
+    [SIGN_OUT_COMMAND]: (): void => undefined
+  };
+
+  it('reads the queries, and runs nothing', () => {
+    const commands = host(all, {
+      enabled: [SIGN_IN_COMMAND],
+      visible: [SIGN_OUT_COMMAND]
+    });
+
+    expect(canSignIn(asCommands(commands))).toBe(true);
+    expect(isSignedIn(asCommands(commands))).toBe(true);
+    expect(commands.execute).not.toHaveBeenCalled();
+  });
+
+  it('is signed out while the sign-out command is hidden', () => {
+    const commands = host(all, { enabled: [SIGN_IN_COMMAND] });
+
+    expect(canSignIn(asCommands(commands))).toBe(true);
+    expect(isSignedIn(asCommands(commands))).toBe(false);
+  });
+
+  it('cannot sign in where the site has sign-in disabled', () => {
+    const commands = host(all, { visible: [SIGN_OUT_COMMAND] });
+
+    expect(canSignIn(asCommands(commands))).toBe(false);
+  });
+
+  it('is false where the host has no such commands', () => {
+    const commands = host({});
+
+    expect(canSignIn(asCommands(commands))).toBe(false);
+    expect(isSignedIn(asCommands(commands))).toBe(false);
+    expect(commands.execute).not.toHaveBeenCalled();
+  });
+
+  it('is false when a query throws', () => {
+    const commands = {
+      hasCommand: () => true,
+      execute: jest.fn(),
+      isEnabled: () => {
+        throw new Error('no');
+      },
+      isVisible: () => {
+        throw new Error('no');
+      }
+    } as unknown as AuthCommands;
+
+    expect(canSignIn(commands)).toBe(false);
+    expect(isSignedIn(commands)).toBe(false);
+  });
+});
+
+describe('aiCredentialSource', () => {
+  const signedIn = {
+    enabled: [SIGN_IN_COMMAND],
+    visible: [SIGN_OUT_COMMAND]
+  };
+  const all = {
+    [ACCESS_TOKEN_COMMAND]: () => 'a-jwt',
+    [SIGN_IN_COMMAND]: (): void => undefined,
+    [SIGN_OUT_COMMAND]: (): void => undefined
+  };
+
+  it('is the pasted token when there is one', () => {
+    const commands = host(all, signedIn);
+
+    expect(aiCredentialSource('  a-token ', asCommands(commands))).toBe(
+      'datamesh-token'
+    );
+    expect(commands.execute).not.toHaveBeenCalled();
+  });
+
+  it('is the sign-in while signed in, and nothing once signed out', () => {
+    const commands = host(all, signedIn);
+    expect(aiCredentialSource('', asCommands(commands))).toBe('sign-in');
+    expect(commands.execute).not.toHaveBeenCalled();
+
+    const out = host(all, { enabled: [SIGN_IN_COMMAND] });
+    expect(aiCredentialSource('', asCommands(out))).toBeNull();
+  });
+
+  it('is nothing where the host has no access-token command', () => {
+    const commands = host(
+      { [SIGN_OUT_COMMAND]: (): void => undefined },
+      { visible: [SIGN_OUT_COMMAND] }
+    );
+
+    expect(aiCredentialSource('', asCommands(commands))).toBeNull();
+  });
+
+  it.each([
+    ['blank', '   '],
+    ['missing', undefined],
+    ['not a string', 42]
+  ])('treats a %s pasted token as none', (_, value) => {
+    const commands = host(all, signedIn);
+
+    expect(aiCredentialSource(value, asCommands(commands))).toBe('sign-in');
+  });
+});
+
+describe('signInToken', () => {
+  it('is null, without running anything, when the host has no access-token command', async () => {
+    const commands = host({});
+
+    expect(await signInToken(asCommands(commands))()).toBeNull();
+    expect(commands.execute).not.toHaveBeenCalled();
+  });
+
+  it("is what the host's access-token command answers", async () => {
+    let token: string | null = 'a-jwt';
+    const commands = host({ [ACCESS_TOKEN_COMMAND]: () => token });
+    const get = signInToken(asCommands(commands));
+
+    expect(await get()).toBe('a-jwt');
+    token = null;
+    expect(await get()).toBeNull();
+    expect(commands.execute).toHaveBeenCalledWith(ACCESS_TOKEN_COMMAND);
+  });
+
+  it('checks for the command on every call, so a host registering it late is found', async () => {
+    const commands: Record<string, () => unknown> = {};
+    const get = signInToken(asCommands(host(commands)));
+
+    expect(await get()).toBeNull();
+    commands[ACCESS_TOKEN_COMMAND] = () => 'a-jwt';
+    expect(await get()).toBe('a-jwt');
+  });
+});