kiota with angular error

[marcioatws]

Sorry for my english, it's not my native language.

kiota version: 1.19.1+d294e04ba7f756896878a7015df1648f9dc0bcde
kiota bundle version: 1.0.0-preview.70

angular cli: 18.2.10
angular dev kit: 18.2.10

angular builder configuration:
production: "builder": "@angular-devkit/build-angular:application"
development: "builder": "@angular-devkit/build-angular:dev-server"

tsconfig

/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
  "angularCompilerOptions": {
    "enableI18nLegacyMessageIdFormat": false,
    "strictInjectionParameters": true,
    "strictInputAccessModifiers": true,
    "strictTemplates": true
  },
  "compileOnSave": false,
  "compilerOptions": {
    "declaration": false,
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "forceConsistentCasingInFileNames": true,
    "importHelpers": true,
    "isolatedModules": true,
    "lib": [
      "ESNext",
      "dom"
    ],
    "module": "ESNext",
    "moduleResolution": "Bundler",
    "noFallthroughCasesInSwitch": true,
    "noImplicitOverride": true,
    "noImplicitReturns": true,
    "noPropertyAccessFromIndexSignature": true,
    "outDir": "./dist/out-tsc",
    "paths": {

    },
    "skipLibCheck": true,
    "sourceMap": true,
    "strict": true,
    "target": "ES2022",
    "useDefineForClassFields": false,
  },
}

I can run in dev without errors, but when i try run production:

X [ERROR] Could not resolve "zlib"

    node_modules/@microsoft/kiota-http-fetchlibrary/dist/es/src/middlewares/compressionHandler.js:176:32:
      176 │       const zlib = await import("zlib");
          ╵                                 ~~~~~~

  The package "zlib" wasn't found on the file system but is built into node. Are you trying to bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

and

X [ERROR] TS2322: Type '(writer: SerializationWriter, multipartBody?: Partial<MultipartBody> | undefined) => void' is not assignable to type 'PrimitiveTypesForDeserialization | ModelSerializerFunction<Parsable> | undefined'.
  Type '(writer: SerializationWriter, multipartBody?: Partial<MultipartBody> | undefined) => void' is not assignable to type 'ModelSerializerFunction<Parsable>'.      
    Types of parameters 'multipartBody' and 'value' are incompatible.
      Type 'Partial<Parsable> | null | undefined' is not assignable to type 'Partial<MultipartBody> | undefined'.
        Type 'null' is not assignable to type 'Partial<MultipartBody> | undefined'. [plugin angular-compiler]

my temporary solution was to fix the signature and remove the node compression code. Is it supposed to be like that, or is it some bug?

thanks in advance.

[baywet]

Hi @marcioatws ,
Thank you for using kiota and for reaching out.

First off, can you try upgrading the kiota bundle to preview 71 please? We realized we had some version requirements misalignment. See #1440 for more context.

We also recently fixed the multipart issue in #1423, and I believe the reason you're not seeing the fix on your end is because of the versioning issue mentioned above, hopefully this should also go away with the upgrade.

As for zlib, it's strange the code is going down this path since that's the path for a node/backend application.

kiota-typescript/packages/http/fetch/src/middlewares/compressionHandler.ts

Line 178 in e8b88a3

if (!inNodeEnv()) {

Maybe we'd need to add || !!window in the condition of the function or something like that. @rkodev what do you think?

[marcioatws]

Hello!

Upgrading to version 71 did not resolve the issue. The fix is ​​not in the package yet.

As for zlib, I think the problem is not in the function that validates whether it is Node or not. The Angular builder simply complains about the existence of the code, whether it is used or not. It is related to the new builder used: esbuild. I adjusted it more cleanly, adding to the Angular configuration that zlilb is an external dependency, I'll leave the code here in case anyone faces the same problem

 "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:application",
          "options": {
            "externalDependencies": ["zlib"],

[baywet]

Thank you for the additional information.

To be clear, after adjusting the configuration, you were able to build and run the application?

[TheDusty01]

@baywet Using the configuration mentioned above with Kiota TS Version 74 and Kiota v1.20.0 this works. But this seems more like workaround.

[marcioatws]

Thank you for the additional information.

To be clear, after adjusting the configuration, you were able to build and run the application?

yes it works, but as mentioned it seems to be a workaround.

[baywet]

Thank you for the additional information.

This is most likely caused by this dynamic import and the way angular applications are built.

kiota-typescript/packages/http/fetch/src/middlewares/compressionHandler.ts

Line 193 in 9a58d21

const zlib = await import("zlib");

(which is in fact node:zlib, only available for node applications)

What I don't understand is why do we need any of that at all, since the browser compression is implemented with CompressionStream which has been available since nodejs 18 and since node 17 and below have been EOL for over a year now

I believe the most straightforward solution here is to remove the nodeJS specific implementation, and make sure the browser implementation works in both contexts.

Since @rkodev is the one who implemented the feature, I'd like him to provide input to this discussion.

[rkodev]

@baywet, we can drop the node specific implementation and only keep the compression stream as mentioned.

[baywet]

Thanks for your input. Can you start a pull request please?