[Maps] Load mapbox-gl with static worker (elastic#51675)

This instructs mapbox-gl to load its workers using a static script. It removes the corresponding child-src CSP-rule from the policy. It retains the worker-src rule as it is required by the ace-editor in Dev-tools.

src/legacy/server/csp/index.test.ts

@@ -40,8 +40,7 @@ test('default CSP rules', () => {
   expect(DEFAULT_CSP_RULES).toMatchInlineSnapshot(`
     Array [
       "script-src 'unsafe-eval' 'self'",
-      "worker-src blob:",
-      "child-src blob:",
+      "worker-src blob: 'self'",
       "style-src 'unsafe-inline' 'self'",
     ]
   `);

src/legacy/server/csp/index.ts

@@ -19,8 +19,7 @@
 
 export const DEFAULT_CSP_RULES = Object.freeze([
   `script-src 'unsafe-eval' 'self'`,
-  'worker-src blob:',
-  'child-src blob:',
+  `worker-src blob: 'self'`,
   `style-src 'unsafe-inline' 'self'`,
 ]);
 

test/api_integration/apis/general/csp.js

@@ -37,8 +37,7 @@ export default function ({ getService }) {
       const entries = Array.from(parsed.entries());
       expect(entries).to.eql([
         [ 'script-src', [ '\'unsafe-eval\'', '\'self\'' ] ],
-        [ 'worker-src', [ 'blob:' ] ],
-        [ 'child-src', [ 'blob:' ] ],
+        [ 'worker-src', [ 'blob:', '\'self\'' ] ],
         [ 'style-src', [ '\'unsafe-inline\'', '\'self\'' ] ]
       ]);
     });

x-pack/legacy/plugins/maps/public/connected_components/map/mb/view.js

@@ -13,15 +13,21 @@ import {
   addSpritesheetToMap,
 } from './utils';
 import { getGlyphUrl, isRetina } from '../../../meta';
-import { DECIMAL_DEGREES_PRECISION, ZOOM_PRECISION } from '../../../../common/constants';
-import mapboxgl from 'mapbox-gl';
+import {
+  DECIMAL_DEGREES_PRECISION,
+  ZOOM_PRECISION,
+} from '../../../../common/constants';
+import mapboxgl from 'mapbox-gl/dist/mapbox-gl-csp';
+import mbWorkerUrl from '!!file-loader!mapbox-gl/dist/mapbox-gl-csp-worker';
 import chrome from 'ui/chrome';
 import { spritesheet } from '@elastic/maki';
 import sprites1 from '@elastic/maki/dist/sprite@1.png';
 import sprites2 from '@elastic/maki/dist/sprite@2.png';
 import { DrawControl } from './draw_control';
 import { TooltipControl } from './tooltip_control';
 
+mapboxgl.workerUrl = mbWorkerUrl;
+
 export class MBMapContainer extends React.Component {
   state = {
     prevLayerList: undefined,

x-pack/test/oidc_api_integration/apis/implicit_flow/oidc_auth.ts

@@ -61,7 +61,7 @@ export default function({ getService }: FtrProviderContext) {
         expect(response.headers['content-type']).to.be('text/html; charset=utf-8');
         expect(response.headers['cache-control']).to.be('private, no-cache, no-store');
         expect(response.headers['content-security-policy']).to.be(
-          `script-src 'unsafe-eval' 'self'; worker-src blob:; child-src blob:; style-src 'unsafe-inline' 'self'`
+          `script-src 'unsafe-eval' 'self'; worker-src blob: 'self'; style-src 'unsafe-inline' 'self'`
         );
 
         // Check that script that forwards URL fragment worked correctly.

x-pack/test/saml_api_integration/apis/security/saml_login.ts

@@ -142,7 +142,7 @@ export default function({ getService }: FtrProviderContext) {
         expect(response.headers['content-type']).to.be('text/html; charset=utf-8');
         expect(response.headers['cache-control']).to.be('private, no-cache, no-store');
         expect(response.headers['content-security-policy']).to.be(
-          `script-src 'unsafe-eval' 'self'; worker-src blob:; child-src blob:; style-src 'unsafe-inline' 'self'`
+          `script-src 'unsafe-eval' 'self'; worker-src blob: 'self'; style-src 'unsafe-inline' 'self'`
         );
 
         // Check that script that forwards URL fragment worked correctly.