Fix: broken import in some dependency

[schweikart]

Commit c83fcba (yarn upgrade) introduced a build error that previously wasn't caught by our CI pipeline. This PR makes sure that our CI pipeline will catch build errors from now on.

However, the surfacing problem still needs to be solved. @Elscrux do you have any idea how to fix this? Reverting c83fcba would certainly work, but this can't be our best solution...

[schweikart]

This is the error output:

info  - Collecting page data ..Error [ERR_REQUIRE_ESM]: require() of ES Module /home/max/Projects/toolbox-web/node_modules/d3-interpolate/src/index.js from /home/max/Projects/toolbox-web/node_modules/@antv/g-base/lib/animate/timeline.js not supported.
Instead change the require of index.js in /home/max/Projects/toolbox-web/node_modules/@antv/g-base/lib/animate/timeline.js to a dynamic import() which is available in all CommonJS modules.
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g-base/lib/animate/timeline.js:5:24)
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g-base/lib/abstract/canvas.js:7:18)
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g-base/lib/index.js:17:16)
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g6-core/lib/interface/behavior.js:8:14)
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g6-core/lib/util/base.js:8:17)
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g6-core/lib/graph/controller/view.js:9:13)
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g6-core/lib/graph/controller/index.js:31:36)
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g6-core/lib/graph/graph.js:15:19)
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g6-core/lib/index.js:94:37)
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g6-pc/lib/index.js:101:15)
    at Object.<anonymous> (/home/max/Projects/toolbox-web/node_modules/@antv/g6/lib/index.js:11:37)
    at 2222 (/home/max/Projects/toolbox-web/.next/server/pages/solve/MaxCut.js:271:18)
    at __webpack_require__ (/home/max/Projects/toolbox-web/.next/server/webpack-runtime.js:25:42)
    at /home/max/Projects/toolbox-web/.next/server/pages/solve/MaxCut.js:20:66
    at __webpack_require__.a (/home/max/Projects/toolbox-web/.next/server/webpack-runtime.js:89:13)
    at 4537 (/home/max/Projects/toolbox-web/.next/server/pages/solve/MaxCut.js:11:21)
    at __webpack_require__ (/home/max/Projects/toolbox-web/.next/server/webpack-runtime.js:25:42)
    at /home/max/Projects/toolbox-web/.next/server/pages/solve/MaxCut.js:216:93
    at __webpack_require__.a (/home/max/Projects/toolbox-web/.next/server/webpack-runtime.js:89:13)
    at 524 (/home/max/Projects/toolbox-web/.next/server/pages/solve/MaxCut.js:205:21)
    at __webpack_require__ (/home/max/Projects/toolbox-web/.next/server/webpack-runtime.js:25:42)
    at __webpack_exec__ (/home/max/Projects/toolbox-web/.next/server/pages/solve/MaxCut.js:323:39)
    at /home/max/Projects/toolbox-web/.next/server/pages/solve/MaxCut.js:324:70
    at __webpack_require__.X (/home/max/Projects/toolbox-web/.next/server/webpack-runtime.js:177:21)
    at /home/max/Projects/toolbox-web/.next/server/pages/solve/MaxCut.js:324:47
    at Object.<anonymous> (/home/max/Projects/toolbox-web/.next/server/pages/solve/MaxCut.js:327:3)
    at Object.requirePage (/home/max/Projects/toolbox-web/node_modules/next/dist/server/require.js:58:12)
    at /home/max/Projects/toolbox-web/node_modules/next/dist/server/load-components.js:56:50
    at async Promise.all (index 2)
    at async Object.loadComponents (/home/max/Projects/toolbox-web/node_modules/next/dist/server/load-components.js:53:49)
    at async /home/max/Projects/toolbox-web/node_modules/next/dist/build/utils.js:673:21
    at async Span.traceAsyncFn (/home/max/Projects/toolbox-web/node_modules/next/dist/trace/trace.js:79:20) {
  code: 'ERR_REQUIRE_ESM'
}

> Build error occurred
Error: Failed to collect page data for /solve/MaxCut
    at /home/max/Projects/toolbox-web/node_modules/next/dist/build/utils.js:743:15 {
  type: 'Error'
}

[Elscrux]

@schweikart It seems to be an issue with CommonJS vs ES Modules. Something now apparently enforces using the ES Modules way of things and the graph visualization library still uses the CommonJS way

require('something')

I tried some things to fix it but wasn't successful so far.

[schweikart]

I don't mind you using our pipeline but you can also test this locally through yarn build (which is probably faster)

[schweikart]

I tried some things to fix it but wasn't successful so far.

Me too. We could revert the upgrade (or just the g6 part) but that would leave us with an unfixed vulnerability...

[schweikart]

I've fixed the issue by downgrading d3-interpolate to 2.0.1. However, this exposes us to the following security vulnerability since d3-interpolate depends on an old version of d3-color: GHSA-36jr-mh4h-2g58

I'm unsure if this actually leads to a vulnerability in our application since the corresponding code might never be called...

In the long run, we should definitely resolve this issue but for now we could as well work with a downgrade. Any opinions on this @Elscrux ?

[schweikart]

The use of require lies in a closed-source dependency of g6. The source-code of the g-base package can be seen here: https://www.npmjs.com/package/@antv/g-base?activeTab=code

For some reason, node uses the common-js distribution of that package instead of the ESM distribution

[Elscrux]

I've fixed the issue by downgrading d3-interpolate to 2.0.1. However, this exposes us to the following security vulnerability since d3-interpolate depends on an old version of d3-color: GHSA-36jr-mh4h-2g58

I'm unsure if this actually leads to a vulnerability in our application since the corresponding code might never be called...

In the long run, we should definitely resolve this issue but for now we could as well work with a downgrade. Any opinions on this @Elscrux ?

I think that would be a good solution for now.