Merge branch 'master' into fix/resolve-custom-inputs-not-passed-to-webpack-configs

Signed-off-by: hainenber <dotronghai96@gmail.com>

docs/developer_docs/contributing/development-setup.md

@@ -643,13 +643,13 @@ npm run dev-server
 npm run dev-server -- --port=9001
 
 # Proxy backend requests to a Flask server running on a non-default port
-npm run dev-server -- --env=--supersetPort=8081
+npm run dev-server -- --env supersetPort=8081
 
 # Proxy to a remote backend but serve local assets
-npm run dev-server -- --env=--superset=https://superset-dev.example.com
+npm run dev-server -- --env supersetUrl=https://superset-dev.example.com
 ```
 
-The `--superset=` option is useful in case you want to debug a production issue or have to setup Superset behind a firewall. It allows you to run Flask server in another environment while keep assets building locally for the best developer experience.
+The `--supersetUrl=` option is useful in case you want to debug a production issue or have to setup Superset behind a firewall. It allows you to run Flask server in another environment while keep assets building locally for the best developer experience.
 
 #### Other npm commands
 

superset-frontend/.storybook/main.mjs

@@ -22,11 +22,13 @@ import path from 'node:path';
 import { createRequire } from 'node:module';
 import { fileURLToPath } from 'node:url';
 // Superset's webpack.config.js
-import customConfig from '../webpack.config.js';
+import generateWebpackConfig from '../webpack.config.js';
 
 const require = createRequire(import.meta.url);
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 
+const customConfig = generateWebpackConfig();
+
 // Filter out plugins that shouldn't be included in Storybook's static build
 // ReactRefreshWebpackPlugin adds Fast Refresh code that requires a dev server runtime,
 // which isn't available when serving the static storybook build

superset-frontend/package-lock.json

@@ -150,8 +150,7 @@
         "use-immer": "^0.11.0",
         "use-query-params": "^2.2.2",
         "uuid": "^14.0.2",
-        "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz",
-        "yargs": "^18.1.0"
+        "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz"
       },
       "devDependencies": {
         "@babel/cli": "^7.29.7",

superset-frontend/package.json

@@ -227,8 +227,7 @@
     "use-immer": "^0.11.0",
     "use-query-params": "^2.2.2",
     "uuid": "^14.0.2",
-    "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz",
-    "yargs": "^18.1.0"
+    "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz"
   },
   "devDependencies": {
     "@babel/cli": "^7.29.7",

superset-frontend/scripts/build.js

@@ -26,13 +26,22 @@
 
 import { spawnSync } from 'node:child_process';
 import { globSync } from 'node:fs';
-import yargs from 'yargs';
-import { hideBin } from 'yargs/helpers';
+import { parseArgs } from 'node:util';
 
 process.env.PATH = `./node_modules/.bin:${process.env.PATH}`;
 
-const { globs } = yargs(hideBin(process.argv)).parse();
-const glob = globs?.length > 1 ? `{${globs.join(',')}}` : globs?.[0] || '*';
+const cliOptions = {
+  globs: {
+    type: 'string',
+    multiple: true,
+    default: ['*'],
+  },
+};
+
+const { values } = parseArgs({ options: cliOptions });
+
+const glob =
+  values.globs?.length > 1 ? `{${values.globs.join(',')}}` : values.globs?.[0];
 
 const BABEL_CONFIG = '--config-file=../../babel.config.js';
 

superset-frontend/tools/webpack.proxy-config.test.js

@@ -21,14 +21,6 @@ import zlib from 'node:zlib';
 import { ZSTDCompress } from 'simple-zstd';
 import { createProxyMiddleware } from 'http-proxy-middleware';
 
-// yargs ships ESM-only and jest's default transform doesn't cover
-// node_modules; webpack.proxy-config.js only uses it to parse a `--env`
-// CLI flag we don't exercise here (the target port is set via
-// process.env.supersetPort below), so stub it out rather than teaching
-// the whole suite's transformIgnorePatterns about it.
-jest.mock('yargs', () => jest.fn(() => ({ parse: () => ({}) })));
-jest.mock('yargs/helpers', () => ({ hideBin: argv => argv }));
-
 const HANG_GUARD_MS = 2000;
 
 /**

superset-frontend/webpack.proxy-config.js

@@ -21,23 +21,7 @@ import { Writable } from 'node:stream';
 import { pipeline } from 'node:stream/promises';
 import { ZSTDDecompress } from 'simple-zstd';
 
-import yargs from 'yargs';
-import { hideBin } from 'yargs/helpers';
-
-const parsedArgs = yargs(hideBin(process.argv)).parse();
-
-const parsedEnvArg = () => {
-  let envArgs = {};
-  if (parsedArgs.env) {
-    envArgs = yargs(parsedArgs.env).argv;
-  }
-  return { ...process.env, ...envArgs };
-};
-const { supersetPort = 8088, superset: supersetUrl = null } = parsedEnvArg();
-const backend = (supersetUrl || `http://localhost:${supersetPort}`).replace(
-  '//+$/',
-  '',
-); // strip ending backslash
+const importTimeEnvVars = Object.freeze({ ...process.env });
 
 let manifest;
 function isHTML(res) {
@@ -88,7 +72,7 @@ function toDevHTML(originalHtml) {
   return html;
 }
 
-function copyHeaders(originalResponse, response) {
+function copyHeaders(originalResponse, response, backend) {
   response.statusCode = originalResponse.statusCode;
   response.statusMessage = originalResponse.statusMessage;
   if (response.setHeader) {
@@ -185,7 +169,14 @@ async function processHTML(proxyResponse, response) {
   response.end(toDevHTML(Buffer.concat(chunks).toString()));
 }
 
-export default function getProxyConfig(newManifest) {
+export default function getProxyConfig(newManifest, env = {}) {
+  const parsedEnvArgs = { ...importTimeEnvVars, ...env };
+  const { supersetPort = 8088, supersetUrl = null } = parsedEnvArgs;
+  const backend = (supersetUrl || `http://localhost:${supersetPort}`).replace(
+    '//+$/',
+    '',
+  ); // strip ending backslash
+
   manifest = newManifest;
   return {
     context: path => {
@@ -206,7 +197,7 @@ export default function getProxyConfig(newManifest) {
     selfHandleResponse: true, // so that the onProxyRes takes care of sending the response
     onProxyRes(proxyResponse, request, response) {
       try {
-        copyHeaders(proxyResponse, response);
+        copyHeaders(proxyResponse, response, backend);
         if (isHTML(response)) {
           // For HTML responses, flush headers before processing starts.
           // processHTML awaits pipeline() and calls response.end() once it