Fix canvas working in non-default spaces

src/core/public/base_path/base_path_service.test.ts

@@ -23,10 +23,14 @@ function setup(options: any = {}) {
   const injectedBasePath: string =
     options.injectedBasePath === undefined ? '/foo/bar' : options.injectedBasePath;
 
+  const injectedSocketBasePath: string =
+    options.injectedSocketBasePath === undefined ? '/socket' : options.injectedSocketBasePath;
+
   const service = new BasePathService();
 
   const injectedMetadata = {
     getBasePath: jest.fn().mockReturnValue(injectedBasePath),
+    getSocketBasePath: jest.fn().mockReturnValue(injectedSocketBasePath),
   } as any;
 
   const startContract = service.start({
@@ -52,6 +56,18 @@ describe('startContract.get()', () => {
   });
 });
 
+describe('startContract.getSocketBasePath()', () => {
+  it('returns an empty string if no socketBasePath is injected', () => {
+    const { startContract } = setup({ injectedSocketBasePath: null });
+    expect(startContract.getSocketBasePath()).toBe('');
+  });
+
+  it('returns the injected socketBasePath', () => {
+    const { startContract } = setup();
+    expect(startContract.getSocketBasePath()).toBe('/socket');
+  });
+});
+
 describe('startContract.addToPath()', () => {
   it('adds the base path to the path if it is relative and starts with a slash', () => {
     const { startContract } = setup();

src/core/public/base_path/base_path_service.ts

@@ -27,6 +27,7 @@ interface Deps {
 export class BasePathService {
   public start({ injectedMetadata }: Deps) {
     const basePath = injectedMetadata.getBasePath() || '';
+    const socketBasePath = injectedMetadata.getSocketBasePath() || '';
 
     return {
       /**
@@ -36,6 +37,13 @@ export class BasePathService {
         return basePath;
       },
 
+      /**
+       * Get the current socketBasePath as defined by the server
+       */
+      getSocketBasePath() {
+        return socketBasePath;
+      },
+
       /**
        * Add the current basePath to a path string.
        * @param path A relative url including the leading `/`, otherwise it will be returned without modification

src/core/public/injected_metadata/injected_metadata_service.ts

@@ -26,6 +26,7 @@ export interface InjectedMetadataParams {
     version: string;
     buildNumber: number;
     basePath: string;
+    socketBasePath: string;
     vars: {
       [key: string]: unknown;
     };
@@ -66,6 +67,10 @@ export class InjectedMetadataService {
         return this.state.basePath;
       },
 
+      getSocketBasePath: () => {
+        return this.state.socketBasePath;
+      },
+
       getKibanaVersion: () => {
         return this.getKibanaVersion();
       },

src/core/public/legacy_platform/legacy_platform_service.test.ts

@@ -113,6 +113,7 @@ const loadingCountStartContract = {
 
 const basePathStartContract = {
   get: jest.fn(),
+  getSocketBasePath: jest.fn(),
   addToPath: jest.fn(),
   removeFromPath: jest.fn(),
 };

src/ui/public/chrome/api/base_path.test.ts

@@ -27,6 +27,7 @@ function initChrome() {
 
 const newPlatformBasePath = {
   get: jest.fn().mockReturnValue('get'),
+  getSocketBasePath: jest.fn().mockReturnValue('getSocketBasePath'),
   addToPath: jest.fn().mockReturnValue('addToPath'),
   removeFromPath: jest.fn().mockReturnValue('removeFromPath'),
 };

src/ui/public/chrome/api/base_path.ts

@@ -32,4 +32,5 @@ export function initChromeBasePathApi(chrome: { [key: string]: any }) {
   chrome.getBasePath = () => newPlatformBasePath.get();
   chrome.addBasePath = (path: string) => newPlatformBasePath.addToPath(path);
   chrome.removeBasePath = (path: string) => newPlatformBasePath.removeFromPath(path);
+  chrome.getSocketBasePath = () => newPlatformBasePath.getSocketBasePath();
 }

src/ui/ui_render/ui_render_mixin.js

@@ -139,6 +139,7 @@ export function uiRenderMixin(kbnServer, server, config) {
       const request = reply.request;
       const translations = await server.getUiTranslations();
       const basePath = request.getBasePath();
+      const socketBasePath = config.get('server.basePath') || '/';
 
       return reply.view('ui_app', {
         uiPublicUrl: `${basePath}/ui`,
@@ -149,6 +150,7 @@ export function uiRenderMixin(kbnServer, server, config) {
           version: kbnServer.version,
           buildNumber: config.get('pkg.buildNum'),
           basePath,
+          socketBasePath,
           vars: await replaceInjectedVars(
             request,
             defaults(

x-pack/plugins/canvas/public/socket.js

@@ -9,7 +9,7 @@ import io from 'socket.io-client';
 import { functionsRegistry } from '../common/lib/functions_registry';
 import { loadBrowserPlugins } from './lib/load_browser_plugins';
 
-const basePath = chrome.getBasePath();
+const basePath = chrome.getSocketBasePath();
 export const socket = io(undefined, { path: `${basePath}/socket.io` });
 
 socket.on('getFunctionList', () => {