Improve dll plugin relation with webpackshims (#30129)

* chore(NA): remove specific watch for x-pack webpackShims folder.

* chore(NA): remove xpack security plugin angular-ui-select webpackShim.

* chore(NA): bump ui-select version on x-pack to match the one used on oss kibana

* chore(NA): remove manual searching for webpackShim imports into the dll plugin. chore(NA): explicit avoid max dll compilations in all environments for the dll plugin. chore(NA): explicit throw an error and list all the not allowed modules bundled into the dll bundle.

* refact(NA): move ui related actions inside webpackShims to proper ui related files

* chore(NA): move angular ui dependencies from webpackShims to kibana core module.

* test(NA): enable xpack jest tests to be able to resolve plugins/xpack_main/*. refact(NA): rewrite code for the old xpack jquery flot webpackShim.

* refact(NA): use the already declared ui module get to list the dependencies for the kibana legacy core plugin.

* chore(NA): move angular ui requires to a better centralized place.

* refact(NA): rename areMaxCompilationsPerformed to assertMaxCompilations.

* refact(NA): remove unnecessary promise resolve on async function.

* refact(NA): remove unnecessary promise resolve on async function.

* refact(NA): apply changes according pr review.

* refact(NA): change from requires to imports in xpack_main plugin jquery flots.

* refact(NA): jquery flots missing statements.

* fix(na): linting problems.

* chore(na): re add jquery flot requires instead of imports.

* refact(NA): moving jquery flots from require to import. test(NA): fix mock for jquery_flot.

* feat(na): allow dynamic dll plugin public modules on dll bundle.

* feat(NA): step verification to not allow modules from xpack source.

* chore(NA): fix linting problems.

.eslintrc.js

@@ -109,7 +109,7 @@ module.exports = {
         // instructs import/no-extraneous-dependencies to treat modules
         // in plugins/ or ui/ namespace as "core modules" so they don't
         // trigger failures for not being listed in package.json
-        'import/core-modules': ['plugins', 'ui', 'uiExports'],
+        'import/core-modules': ['plugins', 'legacy/ui', 'uiExports'],
 
         'import/resolver': {
           '@kbn/eslint-import-resolver-kibana': {

src/cli/cluster/cluster_manager.js

@@ -170,7 +170,6 @@ export default class ClusterManager {
       fromRoot('x-pack/common'),
       fromRoot('x-pack/plugins'),
       fromRoot('x-pack/server'),
-      fromRoot('x-pack/webpackShims'),
       fromRoot('config'),
       ...extraPaths,
     ].map(path => resolve(path));

src/dev/precommit_hook/casing_check_config.js

@@ -174,7 +174,6 @@ export const TEMPORARILY_IGNORED_PATHS = [
   'packages/kbn-ui-framework/doc_site/src/images/elastic-logo.svg',
   'packages/kbn-ui-framework/doc_site/src/images/hint-arrow.svg',
   'packages/kbn-ui-framework/doc_site/src/images/react-logo.svg',
-  'webpackShims/angular-ui-select.js',
   'webpackShims/elasticsearch-browser.js',
   'webpackShims/moment-timezone.js',
   'webpackShims/ui-bootstrap.js',
@@ -182,7 +181,7 @@ export const TEMPORARILY_IGNORED_PATHS = [
   'x-pack/plugins/graph/public/angular-venn-simple.js',
   'x-pack/plugins/index_management/public/lib/editSettings.js',
   'x-pack/plugins/license_management/public/store/reducers/licenseManagement.js',
-  'x-pack/plugins/monitoring/public/components/sparkline/__mocks__/jquery-flot.js',
+  'x-pack/plugins/monitoring/public/components/sparkline/__mocks__/plugins/xpack_main/jquery_flot.js',
   'x-pack/plugins/ml/public/jobs/new_job/simple/components/watcher/email-influencers.html',
   'x-pack/plugins/monitoring/public/icons/alert-blue.svg',
   'x-pack/plugins/monitoring/public/icons/health-gray.svg',

src/legacy/core_plugins/kibana/public/discover/components/field_chooser/field_chooser.js

@@ -21,7 +21,7 @@ import 'ui/directives/css_truncate';
 import 'ui/directives/field_name';
 import 'ui/filters/unique';
 import './discover_field';
-import 'angular-ui-select';
+import 'ui/angular_ui_select';
 import _ from 'lodash';
 import $ from 'jquery';
 import rison from 'rison-node';

src/legacy/core_plugins/kibana/public/management/sections/objects/_view.js

@@ -19,6 +19,7 @@
 
 import _ from 'lodash';
 import angular from 'angular';
+import 'angular-elastic/elastic';
 import rison from 'rison-node';
 import { savedObjectManagementRegistry } from '../../saved_object_registry';
 import objectViewHTML from './_view.html';
@@ -40,7 +41,7 @@ uiRoutes
     k7Breadcrumbs: getViewBreadcrumbs
   });
 
-uiModules.get('apps/management')
+uiModules.get('apps/management', ['monospaced.elastic'])
   .directive('kbnManagementObjectsView', function (kbnIndex, confirmModal, i18n) {
     return {
       restrict: 'E',

src/legacy/ui/public/angular-bootstrap/index.js

@@ -5,6 +5,14 @@
  * TODO: Write custom components that address our needs to directly and deprecate these Bootstrap components.
  */
 
+import 'angular';
+
+import { uiModules } from 'ui/modules';
+
+uiModules.get('kibana', [
+  'ui.bootstrap',
+]);
+
 /*
  * angular-ui-bootstrap
  * http://angular-ui.github.io/bootstrap/

src/legacy/ui/public/angular_ui_select.js

@@ -17,10 +17,11 @@
  * under the License.
  */
 
-require('jquery');
-require('angular');
-require('angular-sanitize');
-require('ui-select/dist/select');
-require('ui-select/dist/select.css');
+import 'jquery';
+import 'angular';
+import 'angular-sanitize';
+import 'ui-select/dist/select';
 
-require('ui/modules').get('kibana', ['ui.select', 'ngSanitize']);
+import { uiModules } from 'ui/modules';
+
+uiModules.get('kibana', ['ui.select', 'ngSanitize']);

src/legacy/ui/public/autoload/modules.js

@@ -54,3 +54,7 @@ import '../saved_objects/ui/saved_object_save_as_checkbox';
 import '../react_components';
 import '../i18n';
 import '../query_bar/directive';
+
+import '@elastic/ui-ace';
+import { uiModules } from 'ui/modules';
+uiModules.get('kibana', ['ui.ace']);

src/legacy/ui/public/styles/bootstrap/buttons.less

@@ -1,5 +1,5 @@
 /**
- * angular-ui-select depends upon these styles. Don't use them in your markup.
+ * ui/angular-ui-select depends upon these styles. Don't use them in your markup.
  * Please use the UI Framework styles instead.
  */
 

src/legacy/ui/public/test_harness/test_harness.js

@@ -18,6 +18,8 @@
  */
 
 // chrome expects to be loaded first, let it get its way
+import $ from 'jquery';
+import bindJqueryToFindTestSubject from 'ui/jquery/find_test_subject';
 import chrome from '../chrome';
 
 import { parse as parseUrl } from 'url';
@@ -30,6 +32,8 @@ import './test_harness.css';
 import 'ng_mock';
 import { setupTestSharding } from './test_sharding';
 
+bindJqueryToFindTestSubject($);
+
 const { query } = parseUrl(window.location.href, true);
 if (query && query.mocha) {
   try {

src/legacy/ui/public/tooltip/tooltip.js

@@ -17,14 +17,18 @@
  * under the License.
  */
 
+import 'ui/angular-bootstrap';
 import html from './tooltip.html';
 import chrome from 'ui/chrome';
+import  { uiModules } from 'ui/modules';
 
-require('ui-bootstrap')
+uiModules.get('kibana')
   .config(function ($tooltipProvider) {
     // we use the uiSettings client because the config service is not available in the config phase
     const uiSettings = chrome.getUiSettingsClient();
 
+    $tooltipProvider.setTriggers({ 'mouseenter': 'mouseleave click' });
+
     $tooltipProvider.options({
       placement: 'bottom',
       animation: !uiSettings.get('accessibility:disableAnimations'),

src/optimize/dynamic_dll_plugin/dll_allowed_modules.js

@@ -17,12 +17,21 @@
  * under the License.
  */
 
-require('angular');
-require('ui/angular-bootstrap');
-var uiModules = require('ui/modules').uiModules;
+import path from 'path';
 
-var kibana = uiModules.get('kibana', ['ui.bootstrap']);
+export function notInNodeModules(checkPath) {
+  return !checkPath.includes(`${path.sep}node_modules${path.sep}`);
+}
 
-module.exports = kibana.config(function ($tooltipProvider) {
-  $tooltipProvider.setTriggers({ 'mouseenter': 'mouseleave click' });
-});
+export function notInNodeModulesOrWebpackShims(checkPath) {
+  return notInNodeModules(checkPath)
+    && !checkPath.includes(`${path.sep}webpackShims${path.sep}`);
+}
+
+export function inPluginNodeModules(checkPath) {
+  return checkPath.match(/[\/\\]plugins.*[\/\\]node_modules/);
+}
+
+export function inDllPluginPublic(checkPath) {
+  return checkPath.includes(`${path.sep}dynamic_dll_plugin/public${path.sep}`);
+}

src/optimize/dynamic_dll_plugin/dll_compiler.js

@@ -18,6 +18,7 @@
  */
 
 import { configModel } from './dll_config_model';
+import { notInNodeModulesOrWebpackShims, notInNodeModules, inDllPluginPublic } from './dll_allowed_modules';
 import { fromRoot } from '../../legacy/utils';
 import { PUBLIC_PATH_PLACEHOLDER } from '../public_path_placeholder';
 import fs from 'fs';
@@ -25,11 +26,13 @@ import mkdirp from 'mkdirp';
 import webpack from 'webpack';
 import { promisify } from 'util';
 import path from 'path';
+import rimraf from 'rimraf';
 
 const readFileAsync = promisify(fs.readFile);
 const mkdirpAsync = promisify(mkdirp);
 const existsAsync = promisify(fs.exists);
 const writeFileAsync = promisify(fs.writeFile);
+const rimrafAsync = promisify(rimraf);
 
 export class DllCompiler {
   static getRawDllConfig(uiBundles = {}, babelLoaderCacheDir = '', threadLoaderPoolConfig = {}) {
@@ -163,7 +166,26 @@ export class DllCompiler {
   async run(dllEntries) {
     const dllConfig = this.dllConfigGenerator(this.rawDllConfig);
     await this.upsertEntryFile(dllEntries);
-    await this.runWebpack(dllConfig());
+
+    try {
+      this.logWithMetadata(['info', 'optimize:dynamic_dll_plugin'], 'Client vendors dll compilation started');
+
+      await this.runWebpack(dllConfig());
+
+      this.logWithMetadata(
+        ['info', 'optimize:dynamic_dll_plugin'],
+        `Client vendors dll compilation finished with success`
+      );
+    } catch (e) {
+      this.logWithMetadata(
+        ['fatal', 'optimize:dynamic_dll_plugin'],
+        `Client vendors dll compilation failed`
+      );
+
+      // Still throw the original error has here we just want
+      // log the fail message
+      throw e;
+    }
 
     // Style dll file isn't always created but we are
     // expecting it to exist always as we are referencing
@@ -182,9 +204,7 @@ export class DllCompiler {
 
   async runWebpack(config) {
     return new Promise((resolve, reject) => {
-      this.logWithMetadata(['info', 'optimize:dynamic_dll_plugin'], 'Client vendors dll compilation started');
-
-      webpack(config, (err, stats) => {
+      webpack(config, async (err, stats) => {
         // If a critical error occurs or we have
         // errors in the stats compilation,
         // reject the promise and logs the errors
@@ -197,18 +217,77 @@ export class DllCompiler {
         }));
 
         if (webpackErrors) {
-          this.logWithMetadata(
-            ['fatal', 'optimize:dynamic_dll_plugin'],
-            `Client vendors dll compilation failed`
-          );
+          // Reject with webpack fatal errors
           return reject(webpackErrors);
         }
 
-        // Otherwise let it proceed
-        this.logWithMetadata(
-          ['info', 'optimize:dynamic_dll_plugin'],
-          `Client vendors dll compilation finished with success`
-        );
+        // Identify if we have not allowed modules
+        // bundled inside the dll bundle
+        const notAllowedModules = [];
+
+        stats.compilation.modules.forEach((module) => {
+          // ignore if no module or userRequest are defined
+          if (!module || !module.resource) {
+            return;
+          }
+
+          // ignore if this module represents the
+          // dll entry file
+          if (module.resource === this.getEntryPath()) {
+            return;
+          }
+
+          // ignore if this module is part of the
+          // files inside dynamic dll plugin public folder
+          if (inDllPluginPublic(module.resource)) {
+            return;
+          }
+
+          // A module is not allowed if it's not a node_module, a webpackShim
+          // or the reasons from being bundled into the dll are not node_modules
+          if(notInNodeModulesOrWebpackShims(module.resource)) {
+            const reasons = module.reasons || [];
+
+            reasons.forEach((reason) => {
+              // Skip if we can't read the reason info
+              if (!reason || !reason.module || !reason.module.resource) {
+                return;
+              }
+
+              // Is the reason for this module being bundle a
+              // node_module or no?
+              if (notInNodeModules(reason.module.resource)) {
+                notAllowedModules.push(module.resource);
+                return;
+              }
+
+              // Even when the reason for the module comes from
+              // node_modules directory, assure it's not from
+              // node_modules/x-pack source code but from a real node_module
+              const dirs = reason.module.resource.split(path.sep);
+              const nodeModuleName = dirs[dirs.lastIndexOf('node_modules') + 1];
+              const inXpackSource = nodeModuleName === 'x-pack';
+
+              if (inXpackSource) {
+                notAllowedModules.push(module.resource);
+              }
+            });
+          }
+        });
+
+        if (notAllowedModules.length) {
+          // Delete the built dll, as it contains invalid modules, and reject listing
+          // all the not allowed modules
+          try {
+            await rimrafAsync(this.rawDllConfig.outputPath);
+          } catch (e) {
+            return reject(e);
+          }
+
+          return reject(`The following modules are not allowed to be bundled into the dll: \n${notAllowedModules.join('\n')}`);
+        }
+
+        // Otherwise it has succeed
         return resolve(stats);
       });
     });

src/optimize/dynamic_dll_plugin/dll_entry_template.js

@@ -19,9 +19,9 @@
 
 export function dllEntryTemplate(requirePaths = []) {
   return [
-    `require('dll/set_csp_nonce')`,
+    `require('dll/set_csp_nonce');`,
     ...requirePaths
-      .map(path => `require('${path}')`)
+      .map(path => `require('${path}');`)
       .sort()
   ].join('\n');
 }

src/optimize/dynamic_dll_plugin/dynamic_dll_plugin.js

@@ -18,6 +18,7 @@
  */
 
 import { DllCompiler } from './dll_compiler';
+import { notInNodeModulesOrWebpackShims, inPluginNodeModules } from './dll_allowed_modules';
 import { IS_KIBANA_DISTRIBUTABLE } from '../../legacy/utils';
 import { dllEntryTemplate } from './dll_entry_template';
 import RawModule from 'webpack/lib/RawModule';
@@ -26,20 +27,10 @@ import path from 'path';
 import normalizePosixPath from 'normalize-path';
 import fs from 'fs';
 import { promisify } from 'util';
-import { parseSingleFileSync, dependenciesVisitorsGenerator } from '@kbn/babel-code-parser';
 
 const realPathAsync = promisify(fs.realpath);
 const DLL_ENTRY_STUB_MODULE_TYPE = 'javascript/dll-entry-stub';
 
-function inNodeModulesOrWebpackShims(checkPath) {
-  return checkPath.includes(`${path.sep}node_modules${path.sep}`)
-    || checkPath.includes(`${path.sep}webpackShims${path.sep}`);
-}
-
-function inPluginNodeModules(checkPath) {
-  return checkPath.match(/[\/\\]plugins.*[\/\\]node_modules/);
-}
-
 export class DynamicDllPlugin {
   constructor({ uiBundles, threadLoaderPoolConfig, logWithMetadata, maxCompilations = 1 }) {
     this.logWithMetadata = logWithMetadata || (() => null);
@@ -162,10 +153,8 @@ export class DynamicDllPlugin {
         const dllContext = rawDllConfig.context;
         const dllOutputPath = rawDllConfig.outputPath;
         const requiresMap = {};
-        const resolvedShimsDependenciesMap = {};
 
         for (const module of compilation.modules) {
-          let requiredModulePath = null;
 
           // re-include requires for modules already handled by the dll
           if (module.delegateData) {
@@ -174,45 +163,15 @@ export class DynamicDllPlugin {
               // NOTE: normalizePosixPath is been used as we only want to have posix
               // paths inside our final dll entry file
               requiresMap[normalizePosixPath(path.relative(dllOutputPath, absoluteResource))] = true;
-              requiredModulePath = absoluteResource;
             }
           }
 
           // include requires for modules that need to be added to the dll
           if (module.stubType === DLL_ENTRY_STUB_MODULE_TYPE) {
             requiresMap[normalizePosixPath(path.relative(dllOutputPath, module.stubResource))] = true;
-            requiredModulePath = module.stubResource;
-          }
-
-          // read new requires for modules that reaches the compilation,
-          // aren't already being handled by dll and were not also
-          // in the entry paths before. The majority should come
-          // from webpackShims, otherwise we should throw
-          if (requiredModulePath && !requiredModulePath.includes('node_modules')) {
-            if (!requiredModulePath.includes('webpackShims')) {
-              throw new Error(
-                `The following module is reaching the compilation and ins\'t  either a node_module or webpackShim:
-                 ${requiredModulePath}
-                 `
-              );
-            }
-
-            // Get dependencies found in each webpack shim entry and just
-            // adds them to the global map for the resolvedShimsDependencies
-            Object.assign(
-              resolvedShimsDependenciesMap,
-              this.getDependenciesFromShim(requiredModulePath, compilation)
-            );
           }
         }
 
-        // Adds the discovered dep modules in webpackShims
-        // to the final require results
-        Object.assign(
-          requiresMap,
-          this.getRequireEntriesFromShimsDependencies(resolvedShimsDependenciesMap, dllOutputPath)
-        );
-
         // Sort and join all the discovered require deps
         // in order to create a consistent entry file
         this.afterCompilationEntryPaths = dllEntryTemplate(Object.keys(requiresMap));
@@ -248,19 +207,19 @@ export class DynamicDllPlugin {
   registerDoneHook(compiler) {
     compiler.hooks.done.tapPromise('DynamicDllPlugin', async stats => {
       if (stats.compilation.needsDLLCompilation) {
-        // Logic to run the max compilation requirements.
-        // Only enable this for CI builds in order to ensure
-        // we have an healthy dll ecosystem.
-        if (IS_KIBANA_DISTRIBUTABLE && (this.performedCompilations === this.maxCompilations)) {
-          throw new Error(
-            'All the allowed dll compilations were already performed and one more is needed which is not possible'
-          );
-        }
-
         // Run the dlls compiler and increment
         // the performed compilations
-        await this.runDLLCompiler(compiler);
-        this.performedCompilations++;
+        //
+        // NOTE: check the need for this extra try/catch after upgrading
+        // past webpack v4.29.3. For now it is needed so we can log the error
+        // otherwise the error log we'll get will be something like: [fatal] [object Object]
+        try {
+          await this.runDLLCompiler(compiler);
+        } catch (error) {
+          this.logWithMetadata(['error', 'optimize:dynamic_dll_plugin'], error.message);
+          throw error;
+        }
+
         return;
       }
 
@@ -274,125 +233,6 @@ export class DynamicDllPlugin {
     });
   }
 
-  getDependenciesFromShim(requiredModulePath, compilation) {
-    // NOTE: is possible we are able to do this reading and searching
-    // through the compilation's webpack modules, however
-    // for a sake of simplicity, and as the webpackShims
-    // should be really small files, we are parsing them
-    // manually and getting the requires
-
-    // Internal map to keep track of the dependencies found for the
-    // current webpackShim file
-    const resolvedShimDependencies = {};
-
-    // Discover the requires inside the webpackShims
-    const shimsDependencies = parseSingleFileSync(requiredModulePath, dependenciesVisitorsGenerator);
-
-    // Resolve webpackShims dependencies with alias
-    shimsDependencies.forEach((dep) => {
-      const isRelative = dep && dep.charAt(0) === '.';
-      let absoluteResource = null;
-
-      // check if the dependency value is relative
-      if (isRelative) {
-        absoluteResource = path.resolve(path.dirname(requiredModulePath), dep);
-      } else {
-        // get the imports and search for alias in the dependency
-        const alias = compilation.compiler.options.resolve.alias;
-        const aliasFound = Object.keys(alias).find((aliasKey) => {
-          return dep.search(`${aliasKey}/`) !== -1;
-        });
-        // search for imports with webpack-loaders
-        const webpackLoaderFoundIdx = dep.search('!');
-
-        if (webpackLoaderFoundIdx !== -1) {
-          // get the loader
-          const loader = dep.substring(0, webpackLoaderFoundIdx);
-          // get the rest of the dependency require value
-          // after the webpack loader char (!)
-          const restImport = dep.substring(webpackLoaderFoundIdx + 1);
-          // build the first part with the loader resolved
-          const absoluteResourceFirstPart = require.resolve(loader);
-          // check if we have a relative path in the script require
-          // path being passed to the loader
-          const isRestImportRelative = restImport && restImport.charAt(0) === '.';
-          // resolve the relative script dependency path
-          // in case we have one
-          const sanitizedRestImport = isRestImportRelative
-            ? path.resolve(path.dirname(requiredModulePath), restImport)
-            : restImport;
-          // replace the alias in the script dependency require path
-          // in case we have found the alias
-          const absoluteResourceSecondPart = aliasFound
-            ? require.resolve(`${alias[aliasFound]}${sanitizedRestImport.substring(aliasFound.length)}`)
-            : require.resolve(sanitizedRestImport);
-
-          // finally build our absolute entry path again in the
-          // original loader format `webpack-loader!script_path`
-          absoluteResource = `${absoluteResourceFirstPart}!${absoluteResourceSecondPart}`;
-        } else {
-          // in case we don't have any webpack loader in the
-          // dependency require value, just replace the alias
-          // if we have one and then resolve the result,
-          // or just resolve the dependency path if we don't
-          // have any alias
-          absoluteResource = aliasFound
-            ? require.resolve(`${alias[aliasFound]}${dep.substring(aliasFound.length)}`)
-            : require.resolve(dep);
-        }
-      }
-
-      // Only consider found js entries
-      if (!absoluteResource.includes('.js') || absoluteResource.includes('json')) {
-        return;
-      }
-
-      // add the absolute built resource to the list of
-      // entry paths found inside the webpackShims
-      // to be merged with the general requiresMap
-      // in the end
-      resolvedShimDependencies[absoluteResource] = true;
-    });
-
-    return resolvedShimDependencies;
-  }
-
-  getRequireEntriesFromShimsDependencies(resolvedShimsDependenciesMap, dllOutputPath) {
-    const internalRequiresMap = {};
-    const resolvedShimsDependencies = Object.keys(resolvedShimsDependenciesMap);
-
-    resolvedShimsDependencies.forEach((resolvedDep) => {
-      if (resolvedDep) {
-        // check if this is a require shim dependency with
-        // an webpack-loader
-        const webpackLoaderFoundIdx = resolvedDep.search('!');
-
-        if (webpackLoaderFoundIdx !== -1) {
-          // get the webpack-loader
-          const loader = resolvedDep.substring(0, webpackLoaderFoundIdx);
-          // get the rest of the dependency require value
-          // after the webpack-loader char (!)
-          const restImport = resolvedDep.substring(webpackLoaderFoundIdx + 1);
-          // resolve the loader and the restImport parts separately
-          const resolvedDepToRequireFirstPart = normalizePosixPath(path.relative(dllOutputPath, loader));
-          const resolvedDepToRequireSecondPart = normalizePosixPath(path.relative(dllOutputPath, restImport));
-
-          // rebuild our final webpackShim entry path in the original
-          // webpack loader format `webpack-loader!script_path`
-          // but right now resolved relatively to the dll output path
-          internalRequiresMap[`${resolvedDepToRequireFirstPart}!${resolvedDepToRequireSecondPart}`] = true;
-        } else {
-          // in case we didn't have any webpack-loader in the require path
-          // resolve the dependency path relative to the dllOutput path
-          // to get our final entry path
-          internalRequiresMap[normalizePosixPath(path.relative(dllOutputPath, resolvedDep))] = true;
-        }
-      }
-    });
-
-    return internalRequiresMap;
-  }
-
   isToForceDLLCreation() {
     return this.forceDLLCreationFlag;
   }
@@ -413,13 +253,13 @@ export class DynamicDllPlugin {
     }
 
     // ignore files that are not in node_modules
-    if (!inNodeModulesOrWebpackShims(module.resource)) {
+    if (notInNodeModulesOrWebpackShims(module.resource)) {
       return;
     }
 
     // also ignore files that are symlinked into node_modules, but only
     // do the `realpath` call after checking the plain resource path
-    if (!inNodeModulesOrWebpackShims(await realPathAsync(module.resource))) {
+    if (notInNodeModulesOrWebpackShims(await realPathAsync(module.resource))) {
       return;
     }
 
@@ -457,12 +297,41 @@ export class DynamicDllPlugin {
     return stubModule;
   }
 
+  async assertMaxCompilations() {
+    // Logic to run the max compilation requirements.
+    // Only enable this for CI builds in order to ensure
+    // we have an healthy dll ecosystem.
+    if (this.performedCompilations === this.maxCompilations) {
+      throw new Error('All the allowed dll compilations were already performed and one more is needed which is not possible');
+    }
+  }
+
   async runDLLCompiler(mainCompiler) {
-    await this.dllCompiler.run(this.entryPaths);
+    const runCompilerErrors = [];
+
+    try {
+      await this.dllCompiler.run(this.entryPaths);
+    } catch (e) {
+      runCompilerErrors.push(e);
+    }
+
+    try {
+      await this.assertMaxCompilations();
+    } catch (e) {
+      runCompilerErrors.push(e);
+    }
 
     // We need to purge the cache into the inputFileSystem
     // for every single built in previous compilation
     // that we rely in next ones.
     mainCompiler.inputFileSystem.purge(this.dllCompiler.getManifestPath());
+
+    this.performedCompilations++;
+
+    if (!runCompilerErrors.length) {
+      return;
+    }
+
+    throw new Error(runCompilerErrors.join('\n-'));
   }
 }

webpackShims/ace.js

@@ -21,6 +21,4 @@ require('brace');
 require('brace/mode/json');
 require('../node_modules/@elastic/ui-ace/ui-ace');
 
-require('ui/modules').get('kibana', ['ui.ace']);
-
 module.exports = window.ace;

webpackShims/angular.js

@@ -20,7 +20,3 @@
 require('jquery');
 require('../node_modules/angular/angular');
 module.exports = window.angular;
-
-require('../node_modules/angular-elastic/elastic');
-
-require('ui/modules').get('kibana', ['monospaced.elastic']);

webpackShims/elasticsearch-browser.js

@@ -19,4 +19,3 @@
 
 require('angular');
 module.exports = require('elasticsearch-browser/elasticsearch.angular.js');
-require('ui/modules').get('kibana', ['elasticsearch']);

webpackShims/jquery.js

@@ -17,5 +17,4 @@
  * under the License.
  */
 
-var $ = window.jQuery = window.$ = module.exports = require('../node_modules/jquery/dist/jquery');
-require('ui/jquery/find_test_subject')($);
+window.jQuery = window.$ = module.exports = require('../node_modules/jquery/dist/jquery');

x-pack/dev-tools/jest/create_jest_config.js

@@ -22,6 +22,7 @@ export function createJestConfig({
     ],
     moduleNameMapper: {
       '^ui/(.*)': `${kibanaDirectory}/src/legacy/ui/public/$1`,
+      '^plugins/xpack_main/(.*);': `${xPackKibanaDirectory}/plugins/xpack_main/public/$1`,
       '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':
         `${kibanaDirectory}/src/dev/jest/mocks/file_mock.js`,
       '\\.(css|less|scss)$': `${kibanaDirectory}/src/dev/jest/mocks/style_mock.js`,

x-pack/package.json

@@ -279,7 +279,7 @@
     "turf": "3.0.14",
     "typescript-fsa": "^2.5.0",
     "typescript-fsa-reducers": "^0.4.5",
-    "ui-select": "0.19.4",
+    "ui-select": "0.19.6",
     "unbzip2-stream": "1.0.9",
     "unstated": "^2.1.1",
     "uuid": "3.0.1",

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

@@ -5,11 +5,11 @@
  */
 
 import 'ui/autoload/all';
-import chrome from 'ui/chrome';
 import './angular/config';
 import './angular/services';
 import React from 'react';
 import ReactDOM from 'react-dom';
+import chrome from 'ui/chrome';
 import { CanvasRootController } from './angular/controllers';
 
 // Import the uiExports that the application uses

x-pack/plugins/canvas/public/components/app/track_route_change.js

@@ -4,9 +4,9 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { get } from 'lodash';
 import chrome from 'ui/chrome';
 import { absoluteToParsedUrl } from 'ui/url/absolute_to_parsed_url';
-import { get } from 'lodash';
 import { getWindow } from '../../lib/get_window';
 import { CANVAS_APP } from '../../../common/lib/constants';
 

x-pack/plugins/canvas/public/components/expression/index.js

@@ -4,7 +4,6 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { Storage } from 'ui/storage';
 import { connect } from 'react-redux';
 import {
   compose,
@@ -16,6 +15,7 @@ import {
   renderComponent,
 } from 'recompose';
 import { fromExpression } from '@kbn/interpreter/common';
+import { Storage } from 'ui/storage';
 import { getSelectedPage, getSelectedElement } from '../../state/selectors/workpad';
 import { setExpression, flushContext } from '../../state/actions/elements';
 import { getFunctionDefinitions } from '../../lib/function_definitions';

x-pack/plugins/canvas/public/components/workpad_export/utils.js

@@ -4,9 +4,9 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import rison from 'rison-node';
 import chrome from 'ui/chrome';
 import { QueryString } from 'ui/utils/query_string';
-import rison from 'rison-node';
 import { fetch } from '../../../common/lib/fetch';
 
 // type of the desired pdf output (print or preserve_layout)

x-pack/plugins/canvas/public/functions/timelion.js

@@ -4,8 +4,8 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import chrome from 'ui/chrome';
 import { flatten } from 'lodash';
+import chrome from 'ui/chrome';
 import { fetch } from '../../common/lib/fetch';
 import { buildBoolArray } from '../../server/lib/build_bool_array';
 

x-pack/plugins/canvas/public/lib/notify.js

@@ -4,9 +4,9 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { get } from 'lodash';
 import { toastNotifications } from 'ui/notify';
 import { formatMsg } from 'ui/notify/lib/format_msg';
-import { get } from 'lodash';
 
 const getToast = (err, opts = {}) => {
   const errData = get(err, 'response') || err;

x-pack/plugins/canvas/public/state/reducers/workpad.js

@@ -4,8 +4,8 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { recentlyAccessed } from 'ui/persisted_log';
 import { handleActions } from 'redux-actions';
+import { recentlyAccessed } from 'ui/persisted_log';
 import {
   setWorkpad,
   sizeWorkpad,

x-pack/plugins/ml/public/app.js

@@ -10,7 +10,7 @@ import 'uiExports/fieldFormats';
 import 'uiExports/savedObjectTypes';
 
 import 'ui/courier';
-import 'ui-bootstrap';
+import 'ui/angular-bootstrap';
 import 'ui/persisted_log';
 import 'ui/autoload/all';
 

x-pack/plugins/ml/public/jobs/new_job/advanced/new_job_controller.js

@@ -9,7 +9,7 @@
 import _ from 'lodash';
 import angular from 'angular';
 import 'ace';
-import 'angular-ui-select';
+import 'ui/angular_ui_select';
 
 import { parseInterval } from 'ui/utils/parse_interval';
 import { timefilter } from 'ui/timefilter';

x-pack/plugins/ml/public/jobs/new_job/simple/multi_metric/create_job/create_job_controller.js

@@ -7,7 +7,7 @@
 
 
 import _ from 'lodash';
-import 'angular-ui-select';
+import 'ui/angular_ui_select';
 
 import { aggTypes } from 'ui/agg_types';
 import { addJobValidationMethods } from 'plugins/ml/../common/util/validation_utils';

x-pack/plugins/ml/public/jobs/new_job/simple/population/create_job/create_job_controller.js

@@ -7,7 +7,7 @@
 
 
 import _ from 'lodash';
-import 'angular-ui-select';
+import 'ui/angular_ui_select';
 
 import { aggTypes } from 'ui/agg_types/index';
 import { addJobValidationMethods } from 'plugins/ml/../common/util/validation_utils';

x-pack/plugins/ml/public/jobs/new_job/simple/recognize/create_job/create_job_controller.js

@@ -8,7 +8,7 @@
 
 import _ from 'lodash';
 import angular from 'angular';
-import 'angular-ui-select';
+import 'ui/angular_ui_select';
 import dateMath from '@elastic/datemath';
 import { isJobIdValid, prefixDatafeedId } from 'plugins/ml/../common/util/job_utils';
 import { getCreateRecognizerJobBreadcrumbs } from 'plugins/ml/jobs/breadcrumbs';

x-pack/plugins/ml/public/jobs/new_job/simple/single_metric/create_job/create_job_controller.js

@@ -7,7 +7,7 @@
 
 
 import _ from 'lodash';
-import 'angular-ui-select';
+import 'ui/angular_ui_select';
 
 import { aggTypes } from 'ui/agg_types';
 import { addJobValidationMethods } from 'plugins/ml/../common/util/validation_utils';

x-pack/plugins/ml/public/lib/angular_bootstrap_patch.js

@@ -35,7 +35,7 @@
 // and also adds support for dropdown-append-to-body flag, allowing the dropdown
 // menu to be appended to be the body and for the menu to be right aligned to the dropdown
 // (by addition of the dropdown-menu-right class to the dropdown-menu)
-import 'ui-bootstrap';
+import 'ui/angular-bootstrap';
 import angular from 'angular';
 angular.module('ui.bootstrap.popover')
   .directive('popoverHtmlUnsafePopup', function ($compile) {

x-pack/plugins/monitoring/public/components/chart/chart_target.js

@@ -6,7 +6,7 @@
 
 import _ from 'lodash';
 import React from 'react';
-import $ from 'jquery-flot'; // webpackShim
+import $ from 'plugins/xpack_main/jquery_flot';
 import { eventBus } from './event_bus';
 import { getChartOptions } from './get_chart_options';
 

x-pack/plugins/monitoring/public/components/sparkline/sparkline_flot_chart.js

@@ -5,7 +5,7 @@
  */
 
 import { last, isFunction, debounce } from 'lodash';
-import $ from 'jquery-flot'; // webpackShim
+import $ from 'plugins/xpack_main/jquery_flot';
 import { DEBOUNCE_FAST_MS } from '../../../common/constants';
 
 /**

x-pack/plugins/security/public/views/management/edit_role/index.js

@@ -9,7 +9,7 @@ import chrome from 'ui/chrome';
 import routes from 'ui/routes';
 import { fatalError } from 'ui/notify';
 import template from 'plugins/security/views/management/edit_role/edit_role.html';
-import 'angular-ui-select';
+import 'ui/angular_ui_select';
 import 'plugins/security/services/application_privilege';
 import 'plugins/security/services/shield_user';
 import 'plugins/security/services/shield_role';

x-pack/plugins/security/public/views/management/edit_user.js

@@ -6,7 +6,7 @@
 import routes from 'ui/routes';
 import template from 'plugins/security/views/management/edit_user.html';
 import 'angular-resource';
-import 'angular-ui-select';
+import 'ui/angular_ui_select';
 import 'plugins/security/services/shield_user';
 import 'plugins/security/services/shield_role';
 import { EDIT_USERS_PATH } from './management_urls';

x-pack/plugins/uptime/public/apps/start_app.tsx

@@ -5,7 +5,7 @@
  */
 
 import 'react-vis/dist/style.css';
-import 'ui-bootstrap';
+import 'ui/angular-bootstrap';
 import 'ui/autoload/all';
 import 'ui/autoload/styles';
 import 'ui/courier';

x-pack/plugins/watcher/public/components/action_type_select/action_type_select.js

@@ -7,7 +7,7 @@
 import { map } from 'lodash';
 import { uiModules } from 'ui/modules';
 import template from './action_type_select.html';
-import 'angular-ui-select';
+import 'ui/angular_ui_select';
 import { Action } from 'plugins/watcher/models/action';
 import 'plugins/watcher/services/settings';
 

x-pack/plugins/watcher/public/components/flot_chart/flot_chart.js

@@ -7,7 +7,7 @@
 import { isFunction, debounce } from 'lodash';
 import { uiModules } from 'ui/modules';
 import template from './flot_chart.html';
-import $ from 'jquery-flot'; // webpackShim
+import $ from 'plugins/xpack_main/jquery_flot';
 import { FLOT_EVENT_PLOT_HOVER_DEBOUNCE_MS } from './constants';
 
 const app = uiModules.get('xpack/watcher');

x-pack/plugins/xpack_main/public/jquery_flot/index.js

@@ -4,11 +4,4 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-/* eslint-disable no-var */
-require('jquery');
-require('angular');
-require('angular-sanitize');
-require('ui-select/dist/select');
-
-var uiModules = require('ui/modules').uiModules;
-uiModules.get('kibana', ['ui.select', 'ngSanitize']);
+export { default } from './jquery_flot';

x-pack/plugins/xpack_main/public/jquery_flot/jquery_flot.js

@@ -4,13 +4,14 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-const $ = require('jquery');
+import $ from 'jquery';
 if (window) { window.jQuery = $; }
-require('ui/flot-charts/jquery.flot');
+import 'ui/flot-charts/jquery.flot';
 
 // load flot plugins
 // avoid the `canvas` plugin, it causes blurry fonts
-require('ui/flot-charts/jquery.flot.time');
-require('ui/flot-charts/jquery.flot.crosshair');
-require('ui/flot-charts/jquery.flot.selection');
-module.exports = $;
+import 'ui/flot-charts/jquery.flot.time';
+import 'ui/flot-charts/jquery.flot.crosshair';
+import 'ui/flot-charts/jquery.flot.selection';
+
+export default $;

yarn.lock

@@ -23536,11 +23536,6 @@ uglifyjs-webpack-plugin@^1.2.4:
     webpack-sources "^1.1.0"
     worker-farm "^1.5.2"
 
-ui-select@0.19.4:
-  version "0.19.4"
-  resolved "https://registry.yarnpkg.com/ui-select/-/ui-select-0.19.4.tgz#f5702c90cd91eca094202188a7fdbc9483e58797"
-  integrity sha1-9XAskM2R7KCUICGIp/28lIPlh5c=
-
 ui-select@0.19.6:
   version "0.19.6"
   resolved "https://registry.yarnpkg.com/ui-select/-/ui-select-0.19.6.tgz#9a824ec9d5b04c3fdc7483fa4746dd3c528d87ab"