Can Webpack Create Bundles That Use xk6 Extensions?

Grafana k6 Extensions
1

Is it possible to create a webpack bundle of k6 tests that utilize the k6 extensions?

As an example, I’m trying to to use the xk6-sql extension GitHub - grafana/xk6-sql: k6 extension to load test RDBMSs (PostgreSQL, MySQL, MS SQL and SQLite3) and when I try to bundle my tests after adding the line import sql from 'k6/x/sql', I get the following error:

> webpack

assets by status 8.71 KiB [cached] 1 asset
orphan modules 10.8 KiB [orphan] 6 modules
runtime modules 937 bytes 4 modules
./src/my-project.test.ts + 6 modules 15.7 KiB [not cacheable] [built] [code generated]

ERROR in /Users/mjourard/git_repos/my-project/k6/src/my-project.test.ts
9:16-26
[tsl] ERROR in /Users/mjourard/git_repos/my-project/src/my-project.test.ts(9,17)
      TS2307: Cannot find module 'k6/x/sql' or its corresponding type declarations.
ts-loader-default_e3b0c44298fc1c14

webpack 5.68.0 compiled with 1 error in 7787 ms

I noticed there is no entry in the DefinitelyTyped repo, and no types folder in the repo of the extension. Is this feature not supported when using extensions?

2

Hi @mjourard, welcome to the forum and sorry for the really slow reply.

I don’t know why exactly but if you use the template repository we have created it works without problems.

Probably due to defining externals :thinking:

Hope this helps you and sorry again for the really slow response :frowning:

3

Hi @mstoykov, thank you for your response.

I think you’re spot on with the cause being externals. I cloned the template repository and started playing around with it here: GitHub - mjourard/k6-webpack-extensions-example: An example repo showing how to package k6 with webpack that is using extension data.

I found that I was able to transpile with webpack the examples from the xk6-sql repo just fine. It failed to transpile when I removed k6 from the externals, which just about confirms it.

Thanks again, this will let me continue forward with our testing project.

As an aside, any chance you’ve got some magic to get intellisense working with the xk6 libraries in typescript?

Edit: after further digging, I also determined that using the babel transpiler was required, moving away from ts-loader. Not sure what it was about babel but it had something that the ts-loader did not.

4

As an aside, any chance you’ve got some magic to get intellisense working with the xk6 libraries in typescript?

As an extension to the answer from the community call, I guess it’s possible for type definitions to be extracted from an extension. But no such work has been done. I also am not familiar with how that will then need to be integrated with intellisense to make it work and whether that will be easily doable.

A k6 LSP kind of project might work better I guess, but I have no idea what that will entail as well.

You should probably try to open a feature request and hopefully someone with more knowledge on this front will be able to weight in.

5

It needs a Typescript extension as k6 does: https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/k6

I don’t expect to have Typescript definitions for all the extensions, but more mature extensions might have. I suggest providing one for xk6-browser as requested here.

@mjourard, double-checking: did you get working the SQL extension with Typescript using the provided template?

6

@ppcano Yes I did get the SQL extension working with Typescript, thank you for double checking.

1 Like