Kotlin/JS-modules no longer work in browser after #256

[fzhinkin]

trafficstars

In #256 I refactored the interop with nodeJs modules providing filesystem support. If previously, only functionality related to files and filesystem didn't work in a browser (with UnsupportedOperationException being thrown), now an attempt to use anything declared in kotlinx-io-core leads to errors like this:

> Task :gradle-core-multiplatform:jsBrowserTest
Module not found: Error: Can't resolve 'buffer' in '/Users/Filipp.Zhinkin/Development/kotlinx-io-release-tests/build/js/packages/kotlinx-io-release-tests-gradle-core-multiplatform-test/kotlin'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "buffer": require.resolve("buffer/") }'
        - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "buffer": false }
Module not found: Error: Can't resolve 'fs' in '/Users/Filipp.Zhinkin/Development/kotlinx-io-release-tests/build/js/packages/kotlinx-io-release-tests-gradle-core-multiplatform-test/kotlin'
Module not found: Error: Can't resolve 'os' in '/Users/Filipp.Zhinkin/Development/kotlinx-io-release-tests/build/js/packages/kotlinx-io-release-tests-gradle-core-multiplatform-test/kotlin'

It's a blocker as it makes kotlinx-io-core useless in nodeJs-less environments.

[lppedd]

This really shows how much we need https://youtrack.jetbrains.com/issue/KT-47038.

This type of issue would be entirely avoidable.

[joffrey-bion]

Is there any workaround for this?

[joffrey-bion]

I just realized #256 was not released yet. I'm using 0.3.1 and I'm experiencing these errors already. So I'm not sure they are caused by the change you mention @fzhinkin

[fzhinkin]

@joffrey-bion I checked it with 0.3.1 and got error messages, but the code using the library worked fine (modulo UnsupportedOperationExcepion on an attempt to use a filesystem). Could you please elaborate on what kind of error you're facing?

[joffrey-bion]

For now I just noticed the webpack errors during the build (the ones mentioned in your original post). I haven't pin-pointed any runtime error, but since my build is not 100% working I am trying to get rid of every warning/error that looks fishy. If you say it's not cause for trouble, then I'm ok to wait until a new version of kotlinx-io fixes this 😉

[fzhinkin]

I'll investigate it further, but for now, it seems like warnings don't cause actual problems in runtime.

[StefanOltmann]

Nice this got fixed.

@fzhinkin When can we expect an v0.3.2 release with this fix?

I just released introduced JS support in Ashampoo Kim v0.16, but got a report of error messages.

I have kotlinx-io in my commonMain and it does not produce error messages for wasmJS: https://github.com/Ashampoo/kim/blob/main/src/commonMain/kotlin/com/ashampoo/kim/common/KotlinIoExtensions.kt

[fzhinkin]

@StefanOltmann v0.3.2 should be deployed to the central repository within an hour.

However, error messages will remain. #283 only solved an issue (introduced in #256) with an actual error being raised a prevented execution within a browser when kotlinx-io was imported.

[joffrey-bion]

By the way, why isn't the filesystem-related functionality part of another module (not kotlinx-io-core) that doesn't have the browser among its targets? This would avoid "lying" on the supported platforms, and solve some of those issues, right?

[fzhinkin]

@joffrey-bion, right. The plan is to phase it out from core module in subsequent releases.

[StefanOltmann]

@fzhinkin Thanks for the quick release.

However, error messages will remain.

I don't fully understand this. That Module not found: Error: Can't resolve 'buffer' in error message should not appear if we don't use the Path in an browser environment, right? Only if we actually try to use it.

[fzhinkin]

@StefanOltmann, these warnings are produced by the webpack which bundles sources, not by the app itself. I'll check if it could be fixed on the library side, but for your app, you can place a webpack config file into <projectRootDir>/webpack.conf.d/config.js:

config.module.rules.push({
    'resolve': {
        fallback: {
            path: false,
            os: false,
            buffer: false,
            fs: false
        }
    }
})

Such a config will instruct weback to abandon any attempts to import aforementioned modules.

You can find more info about weback configuration for K/JS here: https://kotlinlang.org/docs/js-project-setup.html#webpack-configuration-file

[whyoleg]

I'll check if it could be fixed on the library side

I might have a solution here: instead of js("require(\"path\")") use js("eval('require')('path')"). I'm sure that it works (at least with latest Kotlin versions) for both js and wasm, browser and node without any warnings/errors at my side in cryptography-kotlin (js and wasm), but I'm not sure, how it affects some optimisations, but at least it doesn't spam users with unrelated to them warnings

[fzhinkin]

@whyoleg it works, thanks! I'll incorporate the fix.

[StefanOltmann]

Thank you.

For now I just move kotlinx-io extensions out of commonMain, so they are not supported on wasmJS & js targets.

My library does not need kotlinx-io to work, it's just there for convenience so users can read image metadata from a kotlinx-io Path instead of having to get the ByteArray first.

https://github.com/Ashampoo/kim/commit/991cd4cf2b520d38754cbd10b5d828ce5c2c3112