OCPBUGS-78980: Update @graphql-codegen packages for Node.js 25 compatibility

stefanonardo · stefanonardo · commit 827b5ae6937f · 2026-04-01T13:48:05.000+02:00
The console build fails on Node.js 25 because @graphql-codegen/cli@1.x
transitively depends on buffer-equal-constant-time, which uses the removed
SlowBuffer API. Upgrading to codegen v5 eliminates this dependency chain.
diff --git a/frontend/package.json b/frontend/package.json
@@ -184,7 +184,7 @@
     "fuzzysearch": "1.0.x",
     "gherkin-lint": "^4.1.3",
     "git-url-parse": "^11.4.0",
-    "graphql": "^14.0.0",
+    "graphql": "^15.0.0",
     "i18next": "^25.8.18",
     "i18next-browser-languagedetector": "^8.2.1",
     "i18next-conv": "16.0.0",
@@ -230,10 +230,10 @@
   "devDependencies": {
     "@babel/core": "^7.28.5",
     "@cypress/webpack-preprocessor": "^7.0.2",
-    "@graphql-codegen/cli": "^1.15.1",
-    "@graphql-codegen/typescript": "^1.15.1",
-    "@graphql-codegen/typescript-graphql-files-modules": "^1.15.1",
-    "@graphql-codegen/typescript-operations": "^1.15.1",
+    "@graphql-codegen/cli": "^5.0.0",
+    "@graphql-codegen/typescript": "^4.0.0",
+    "@graphql-codegen/typescript-graphql-files-modules": "^3.0.0",
+    "@graphql-codegen/typescript-operations": "^4.0.0",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.6.2",
     "@swc/core": "^1.15.18",
     "@swc/jest": "^0.2.39",
@@ -245,6 +245,7 @@
     "@types/glob": "7.x",
     "@types/immutable": "3.x",
     "@types/jest": "^30.0.0",
+    "@types/js-yaml": "3.12.10",
     "@types/json-schema": "^7.0.7",
     "@types/lodash-es": "^4.17.12",
     "@types/node": "22.x",
@@ -273,7 +274,7 @@
     "find-up": "4.x",
     "fork-ts-checker-webpack-plugin": "9.1.0",
     "glob": "7.x",
-    "graphql-tag": "^2.10.3",
+    "graphql-tag": "^2.12.6",
     "html-webpack-plugin": "5.6.5",
     "html-webpack-skip-assets-plugin": "^1.0.4",
     "husky": "^8.0.3",
diff --git a/frontend/packages/console-shared/src/components/editor/yaml-download-utils.ts b/frontend/packages/console-shared/src/components/editor/yaml-download-utils.ts
@@ -1,11 +1,12 @@
 import { saveAs } from 'file-saver';
 import { safeLoad } from 'js-yaml';
+import type { K8sResourceKind } from '@console/dynamic-plugin-sdk/src';
 
 export const downloadYaml = (data: BlobPart) => {
   const blob = new Blob([data], { type: 'text/yaml;charset=utf-8' });
   let filename = 'k8s-object.yaml';
   try {
-    const obj = safeLoad(data);
+    const obj = safeLoad(String(data)) as K8sResourceKind;
     if (obj.kind) {
       filename = `${obj.kind.toLowerCase()}-${obj.metadata.name}.yaml`;
     }
diff --git a/frontend/packages/console-shared/src/hooks/useResourceSidebarSamples.ts b/frontend/packages/console-shared/src/hooks/useResourceSidebarSamples.ts
@@ -1,5 +1,5 @@
 import { Map as ImmutableMap } from 'immutable';
-import YAML from 'js-yaml';
+import * as YAML from 'js-yaml';
 import * as _ from 'lodash';
 import { useTranslation } from 'react-i18next';
 import { PodDisruptionBudgetModel } from '@console/app/src/models';
diff --git a/frontend/packages/dev-console/src/components/deployments/EditDeployment.tsx b/frontend/packages/dev-console/src/components/deployments/EditDeployment.tsx
@@ -46,7 +46,7 @@ const EditDeployment: FC<EditDeploymentProps> = ({ heading, resource, namespace,
     const resourceType = getResourcesType(resource);
     if (values.editorType === EditorType.YAML) {
       try {
-        deploymentRes = safeLoad(values.yamlData);
+        deploymentRes = safeLoad(values.yamlData) as K8sResourceKind;
         if (!deploymentRes?.metadata?.namespace) {
           deploymentRes.metadata.namespace = namespace;
         }
diff --git a/frontend/packages/helm-plugin/src/catalog/providers/useHelmCharts.tsx b/frontend/packages/helm-plugin/src/catalog/providers/useHelmCharts.tsx
@@ -52,7 +52,7 @@ const useHelmCharts: ExtensionHook<CatalogItem[]> = ({
       .then(async (res) => {
         if (mounted) {
           const yaml = await res.text();
-          const json = safeLoad(yaml);
+          const json = safeLoad(yaml) as { entries: HelmChartEntries };
           setHelmCharts(json.entries);
         }
       })
diff --git a/frontend/packages/helm-plugin/src/components/forms/HelmChartRepository/CreateHelmChartRepository.tsx b/frontend/packages/helm-plugin/src/components/forms/HelmChartRepository/CreateHelmChartRepository.tsx
@@ -91,7 +91,7 @@ const CreateHelmChartRepository: FC<CreateHelmChartRepositoryProps> = ({
 
     if (values.editorType === EditorType.YAML) {
       try {
-        HelmChartRepositoryRes = safeLoad(values.yamlData);
+        HelmChartRepositoryRes = safeLoad(values.yamlData) as HelmChartRepositoryType;
         if (
           HelmChartRepositoryRes &&
           HelmChartRepositoryRes.kind === 'ProjectHelmChartRepository' &&
diff --git a/frontend/packages/helm-plugin/src/components/forms/install-upgrade/HelmChartVersionDropdown.tsx b/frontend/packages/helm-plugin/src/components/forms/install-upgrade/HelmChartVersionDropdown.tsx
@@ -125,7 +125,7 @@ const HelmChartVersionDropdown: FC<HelmChartVersionDropdownProps> = ({
       try {
         const response = await coFetch(`/api/helm/charts/index.yaml?namespace=${namespace}`);
         const yaml = await response.text();
-        json = safeLoad(yaml);
+        json = safeLoad(yaml) as { entries: HelmChartEntries };
       } catch {
         if (ignore) return;
       }
diff --git a/frontend/packages/helm-plugin/src/components/forms/install-upgrade/HelmInstallUpgradePage.tsx b/frontend/packages/helm-plugin/src/components/forms/install-upgrade/HelmInstallUpgradePage.tsx
@@ -167,7 +167,7 @@ const HelmInstallUpgradePage: FC = () => {
       }
     } else if (yamlData) {
       try {
-        valuesObj = safeLoad(yamlData);
+        valuesObj = safeLoad(yamlData) as any;
       } catch (err) {
         actions.setStatus({
           submitError: t('helm-plugin~Invalid YAML - {{errorText}}', { errorText: err.toString() }),
diff --git a/frontend/packages/helm-plugin/src/components/forms/url-chart/HelmURLChartInstallPage.tsx b/frontend/packages/helm-plugin/src/components/forms/url-chart/HelmURLChartInstallPage.tsx
@@ -136,7 +136,7 @@ const HelmURLChartInstallPage: FunctionComponent = () => {
       }
     } else if (yamlData) {
       try {
-        valuesObj = safeLoad(yamlData);
+        valuesObj = safeLoad(yamlData) as Record<string, unknown>;
       } catch (err) {
         actions.setStatus({
           submitError: t('helm-plugin~Invalid YAML - {{errorText}}', { errorText: err.toString() }),
diff --git a/frontend/packages/knative-plugin/src/components/add/brokers/AddBroker.tsx b/frontend/packages/knative-plugin/src/components/add/brokers/AddBroker.tsx
@@ -37,13 +37,13 @@ const AddBroker: FC<AddBrokerProps> = ({ namespace, selectedApplication }) => {
   const createResources = (
     formValues: AddBrokerFormYamlValues,
     actions: FormikHelpers<AddBrokerFormYamlValues>,
-  ): Promise<K8sResourceKind> => {
+  ): Promise<K8sResourceKind | null> => {
     let broker: K8sResourceKind;
     if (formValues.editorType === EditorType.Form) {
       broker = convertFormToBrokerYaml(formValues.formData);
     } else {
       try {
-        broker = safeLoad(formValues.yamlData);
+        broker = safeLoad(formValues.yamlData) as K8sResourceKind;
         if (!broker.metadata?.namespace) {
           broker.metadata.namespace = formValues.formData.project.name;
         }
diff --git a/frontend/packages/knative-plugin/src/utils/create-channel-utils.ts b/frontend/packages/knative-plugin/src/utils/create-channel-utils.ts
@@ -167,7 +167,7 @@ export const useDefaultChannelConfiguration = (namespace: string): [string, bool
   );
   let defaultConfiguredChannel = EVENTING_IMC_KIND;
   if (configMap && defaultConfiguredChannelLoaded) {
-    const cfg = safeLoad(configMap.data?.['default-ch-config']);
+    const cfg = safeLoad(configMap.data?.['default-ch-config']) as Record<string, any>;
 
     defaultConfiguredChannel = _.hasIn(cfg?.namespaceDefaults, namespace)
       ? cfg?.namespaceDefaults[namespace].kind
diff --git a/frontend/packages/vsphere-plugin/src/components/persist.ts b/frontend/packages/vsphere-plugin/src/components/persist.ts
@@ -132,7 +132,7 @@ const updateYamlFormat = (
 ): string => {
   let cmCfg: ProviderCM;
   try {
-    cmCfg = safeLoad(cloudProviderConfig.data.config);
+    cmCfg = safeLoad(cloudProviderConfig.data.config) as ProviderCM;
   } catch (e) {
     throw new PersistError(
       t('Failed to parse cloud provider config {{cm}}', { cm: cloudProviderConfig.metadata.name }),
diff --git a/frontend/public/components/edit-yaml.tsx b/frontend/public/components/edit-yaml.tsx
@@ -76,7 +76,7 @@ const generateObjToLoad = (
 ) => {
   const sampleObj: K8sResourceKind = safeLoad(
     yaml ? yaml : getYAMLTemplates(templateExtensions).getIn([kind, id]),
-  );
+  ) as K8sResourceKind;
   if (_.has(sampleObj.metadata, 'namespace')) {
     sampleObj.metadata.namespace = namespace;
   }
@@ -336,7 +336,7 @@ const EditYAMLInner: FC<EditYAMLInnerProps> = (props) => {
   const getResourceKindfromYAML = useCallback(
     (yaml) => {
       try {
-        const obj = safeLoad(yaml);
+        const obj = safeLoad(yaml) as Record<string, any>;
         return getModel(obj)?.kind;
       } catch (e) {
         return 'unknown';
@@ -378,7 +378,7 @@ const EditYAMLInner: FC<EditYAMLInnerProps> = (props) => {
       return false;
     }
     try {
-      safeLoad(str);
+      safeLoad(str) as Record<string, any>;
       return true;
     } catch {
       return false;
@@ -595,7 +595,7 @@ const EditYAMLInner: FC<EditYAMLInnerProps> = (props) => {
     }
 
     try {
-      obj = safeLoad(editorMounted && getEditor()?.getValue());
+      obj = safeLoad(editorMounted && getEditor()?.getValue()) as Record<string, any>;
     } catch (e) {
       handleError(t('public~Error parsing YAML: {{e}}', { e }));
       return;
diff --git a/frontend/public/components/monitoring/alertmanager/alertmanager-utils.tsx b/frontend/public/components/monitoring/alertmanager/alertmanager-utils.tsx
@@ -44,7 +44,7 @@ export const getAlertmanagerConfig = (
 ): { config: AlertmanagerConfig; errorMessage?: string } => {
   const parsedAlertmanagerYAML = getAlertmanagerYAML(secret);
   try {
-    const config = safeLoad(parsedAlertmanagerYAML.yaml);
+    const config = safeLoad(parsedAlertmanagerYAML.yaml) as AlertmanagerConfig;
     return { config, errorMessage: parsedAlertmanagerYAML.errorMessage };
   } catch (e) {
     return { config: null, errorMessage: `Error loading alertmanager.yaml: ${e}` };
@@ -55,7 +55,7 @@ export const patchAlertmanagerConfig = (
   secret: K8sResourceKind,
   yaml: object | string,
 ): Promise<any> => {
-  const yamlString = _.isObject(yaml) ? safeDump(yaml) : yaml;
+  const yamlString = _.isObject(yaml) ? safeDump(yaml) : String(yaml);
   const yamlEncodedString = Base64.encode(yamlString);
   const patch = [{ op: 'replace', path: '/data/alertmanager.yaml', value: yamlEncodedString }];
   return k8sPatch(SecretModel, secret, patch);
diff --git a/frontend/public/components/monitoring/receiver-forms/alert-manager-receiver-forms.tsx b/frontend/public/components/monitoring/receiver-forms/alert-manager-receiver-forms.tsx
@@ -543,7 +543,7 @@ const ReceiverWrapper = memo<ReceiverFormsWrapperProps>(({ obj, ...props }) => {
           setLoadError({ message: 'alertmanager.v2.status.config.original not found.' });
         } else {
           try {
-            const { global } = safeLoad(originalAlertmanagerConfigJSON);
+            const { global } = safeLoad(originalAlertmanagerConfigJSON) as Record<string, any>;
             setAlertmanagerGlobals(global);
             setLoaded(true);
           } catch (error) {
diff --git a/frontend/yarn.lock b/frontend/yarn.lock

Original file line number	Diff line number	Diff line change
`@@ -46,7 +46,7 @@ const EditDeployment: FC<EditDeploymentProps> = ({ heading, resource, namespace,`
`46`	`46`	`const resourceType = getResourcesType(resource);`
`47`	`47`	`if (values.editorType === EditorType.YAML) {`
`48`	`48`	`try {`
`49`		`- deploymentRes = safeLoad(values.yamlData);`
	`49`	`+ deploymentRes = safeLoad(values.yamlData) as K8sResourceKind;`
`50`	`50`	`if (!deploymentRes?.metadata?.namespace) {`
`51`	`51`	`deploymentRes.metadata.namespace = namespace;`
`52`	`52`	`}`
Original file line number	Diff line number	Diff line change
`@@ -52,7 +52,7 @@ const useHelmCharts: ExtensionHook<CatalogItem[]> = ({`
`52`	`52`	`.then(async (res) => {`
`53`	`53`	`if (mounted) {`
`54`	`54`	`const yaml = await res.text();`
`55`		`- const json = safeLoad(yaml);`
	`55`	`+ const json = safeLoad(yaml) as { entries: HelmChartEntries };`
`56`	`56`	`setHelmCharts(json.entries);`
`57`	`57`	`}`
`58`	`58`	`})`
Original file line number	Diff line number	Diff line change
`@@ -125,7 +125,7 @@ const HelmChartVersionDropdown: FC<HelmChartVersionDropdownProps> = ({`
`125`	`125`	`try {`
`126`	`126`	const response = await coFetch(`/api/helm/charts/index.yaml?namespace=${namespace}`);
`127`	`127`	`const yaml = await response.text();`
`128`		`- json = safeLoad(yaml);`
	`128`	`+ json = safeLoad(yaml) as { entries: HelmChartEntries };`
`129`	`129`	`} catch {`
`130`	`130`	`if (ignore) return;`
`131`	`131`	`}`
Original file line number	Diff line number	Diff line change
`@@ -167,7 +167,7 @@ const HelmInstallUpgradePage: FC = () => {`
`167`	`167`	`}`
`168`	`168`	`} else if (yamlData) {`
`169`	`169`	`try {`
`170`		`- valuesObj = safeLoad(yamlData);`
	`170`	`+ valuesObj = safeLoad(yamlData) as any;`
`171`	`171`	`} catch (err) {`
`172`	`172`	`actions.setStatus({`
`173`	`173`	`submitError: t('helm-plugin~Invalid YAML - {{errorText}}', { errorText: err.toString() }),`
Original file line number	Diff line number	Diff line change
`@@ -136,7 +136,7 @@ const HelmURLChartInstallPage: FunctionComponent = () => {`
`136`	`136`	`}`
`137`	`137`	`} else if (yamlData) {`
`138`	`138`	`try {`
`139`		`- valuesObj = safeLoad(yamlData);`
	`139`	`+ valuesObj = safeLoad(yamlData) as Record<string, unknown>;`
`140`	`140`	`} catch (err) {`
`141`	`141`	`actions.setStatus({`
`142`	`142`	`submitError: t('helm-plugin~Invalid YAML - {{errorText}}', { errorText: err.toString() }),`