@redhat-cloud-services/frontend-components-config 4.6.6 → 4.6.9

package/README.md

@@ -7,22 +7,36 @@
     - [Removed features with webpack 5](#removed-features-with-webpack-5)
   - [useProxy](#useproxy)
     - [Attributes](#attributes)
-      - [useChromeTemplate](#useChromeTemplate)
+      - [useChromeTemplate](#usechrometemplate)
       - [localChrome](#localchrome)
-      - [registry](#registry)
+      - [keycloakUri](#keycloakuri)
+      - [Registry](#registry)
       - [Custom routes](#custom-routes)
         - [routes](#routes)
         - [routesPath](#routespath)
-    - [Custom proxy settings](#custom-proxy-settings)
+      - [Custom proxy settings](#custom-proxy-settings)
+      - [Env](#env)
+      - [Use cloud](#use-cloud)
+      - [Target](#target)
+      - [useAgent](#useagent)
+      - [bounceProd](#bounceprod)
+        - [Running PROD proxy without VPN](#running-prod-proxy-without-vpn)
   - [standalone](#standalone)
     - [Usage](#usage)
       - [Simple](#simple)
       - [Advanced](#advanced)
-        - [Using provided services](#Using-provided-services)
-        - [Writing services](#Writing-services)
-        - [Customizing default services](#Customizing-default-services)
-  - [fec node scripts](#fec-node-scripts)
-  - [include PF css modules in your bundle](#include-PF-css-modules-in-your-bundle)
+        - [Using provided services](#using-provided-services)
+        - [Writing services](#writing-services)
+        - [Customizing default services](#customizing-default-services)
+- [fec node scripts](#fec-node-scripts)
+  - [Usage](#usage-1)
+  - [Patch etc hosts](#patch-etc-hosts)
+  - [Static](#static)
+    - [Inventory example](#inventory-example)
+    - [In inventory UI repository changes](#in-inventory-ui-repository-changes)
+    - [Compliance frontend setup](#compliance-frontend-setup)
+    - [Run servers](#run-servers)
+- [include PF css modules in your bundle](#include-pf-css-modules-in-your-bundle)
 
 ## Webpack 5
 
@@ -65,6 +79,8 @@ const { config: webpackConfig, plugins } = config({
 |[env](#env)|`string`|Environment to proxy against such as ci-beta.|
 |[useCloud](#use-cloud)|`boolean`|Toggle to use old fallback to cloud.redhat.com paths instead of console.redhat.com.|
 |[target](#target)|`string`|Override `env` and `useCloud` to use a custom URI.|
+|[useAgent](#useAgent)|`boolean` = `true`|Enforce using the agent to proxy requests via `proxyUrl`.|
+|[bounceProd](#bounceProd)|`boolean` = `false`|Bounce all non-GET requests via server requests.|
 
 
 #### useChromeTemplate
@@ -102,6 +118,9 @@ You can also easily run you application with a local build of Chrome by adding `
 INSIGHTS_CHROME=/Users/rvsiansk/insights-project/insights-chrome/build/
 ```
 
+**The path must end with a slash character / !!**
+
+
 To check what the proxy is doing with your local chrome settings you can set `proxyVerbose: true`.
 
 #### keycloakUri
@@ -207,6 +226,33 @@ If you want to run in legacy mode pass `useCloud: true` in your config, this way
 #### Target
 Override for the target `env` and `useCloud` build. Useful for cross-environment testing.
 
+#### useAgent
+
+`boolean` = `true`
+
+Enforces using the agent to proxy requests via `proxyUrl`. Setting this to `true` will enforce using agent for PROD environemnt too (use when you are using Red Hat VPN and you do not want to bounce PROD requests). STAGE is using the agent automatically and it cannot be turned off.
+
+#### bounceProd
+
+`boolean` = `false`
+
+Bounce all non-GET PROD requests via server. This option removes all headers except `cookie` and `body` so Akamai won't have issues with different origins/hosts. This behavior allows to access PROD environment without using Red Hat VPN.
+
+##### Running PROD proxy without VPN
+
+Set following attributes in your dev webpack proxy:
+
+```jsx
+const config = {
+  ...options,
+  env: 'prod-stable', // or 'prod-beta'
+  useAgent: false,
+  bounceProd: true
+}
+```
+
+Now, you can access PROD env without being connected to Red Hat VPN.
+
 ## standalone
 A way to run cloud.redhat.com apps from `localhost` offline.
 
@@ -446,4 +492,4 @@ const { config: webpackConfig, plugins } = config({
   ...
 });
 
-```
+```

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@redhat-cloud-services/frontend-components-config",
-    "version": "4.6.6",
+    "version": "4.6.9",
     "description": "Config plugins and settings for RedHat Cloud Services project.",
     "main": "index.js",
     "bin": {
@@ -53,7 +53,7 @@
         "util": "^0.12.4",
         "webpack": "^5.55.1",
         "webpack-cli": "^4.8.0",
-        "webpack-dev-server": "4.3.1",
+        "webpack-dev-server": "4.8.1",
         "write-file-webpack-plugin": "^4.5.1",
         "yargs": "^17.2.1"
     }

package/src/config.js

@@ -35,7 +35,9 @@ module.exports = ({
   registry,
   client = {},
   bundlePfModules = false,
-  useChromeTemplate = false,
+  useChromeTemplate = true,
+  bounceProd,
+  useAgent,
 } = {}) => {
   const filenameMask = `js/[name]${useFileHash ? `.${Date.now()}.[fullhash]` : ''}.js`;
   if (betaEnv) {
@@ -197,6 +199,8 @@ module.exports = ({
             copyTemplate(chromePath);
           }
         },
+        bounceProd,
+        useAgent,
       }),
     },
   };

package/src/plugins.js

@@ -1,5 +1,5 @@
 const { SourceMapDevToolPlugin } = require('webpack');
-const { ProvidePlugin } = require('webpack');
+const { ProvidePlugin, DefinePlugin } = require('webpack');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const { CleanWebpackPlugin } = require('clean-webpack-plugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
@@ -17,6 +17,7 @@ module.exports = ({
   generateSourceMaps,
   plugins,
   useChromeTemplate = false,
+  definePlugin = {},
 } = {}) => [
   ...(generateSourceMaps
     ? [
@@ -53,6 +54,11 @@ module.exports = ({
           },
           ...(replacePlugin || []),
         ]),
+        new DefinePlugin({
+          // we have to wrap the appname string in another string because of how define plugin explodes strings
+          CRC_APP_NAME: JSON.stringify(insights?.appname),
+          ...(definePlugin || {}),
+        }),
       ]),
   new ProvidePlugin({
     process: 'process/browser.js',

package/src/plugins.test.js

@@ -2,17 +2,18 @@ import plugins from './plugins';
 
 const HTML_WEBPACK = 2;
 const REPLACE = 3;
+const DEFINE_PLUGIN = 4;
 
 describe('plugins generations, no option', () => {
   const enabledPlugins = plugins();
 
   it('should generate plugins', () => {
-    expect(enabledPlugins.length).toBe(6);
+    expect(enabledPlugins.length).toBe(7);
   });
 
   it('should generate plugins with sourceMaps', () => {
     const enabledPlugins = plugins({ generateSourceMaps: true });
-    expect(enabledPlugins.length).toBe(7);
+    expect(enabledPlugins.length).toBe(8);
   });
 
   it('should generate correct template path for HtmlWebpackPlugin', () => {
@@ -52,3 +53,19 @@ it('replacePlugin should update', () => {
   });
   enabledPlugins[REPLACE].replace({ html: '@@another string @@env' }, (_, { html }) => expect(html).toBe('test-string string '));
 });
+
+it('definePlugin should have default replace of CRC_APP_NAME', () => {
+  const enabledPlugins = plugins({
+    insights: { appname: 'test_app' },
+  });
+  expect(enabledPlugins[DEFINE_PLUGIN].definitions.CRC_APP_NAME).toBe('"test_app"');
+});
+
+it('definePlugin should update', () => {
+  const enabledPlugins = plugins({
+    definePlugin: {
+      SOME_VAR: JSON.stringify('test_val'),
+    },
+  });
+  expect(enabledPlugins[DEFINE_PLUGIN].definitions.SOME_VAR).toBe('"test_val"');
+});