otplib 12 broke angular karma tests

[pickfire]

Describe the bug A clear and concise description of what the bug is.

ReferenceError: buffer is not defined

To Reproduce Steps to reproduce the behavior:

1. Run karma tests in angular ng t --browsers Firefox

Expected behavior A clear and concise description of what you expected to happen.

Does not break any tests.

Screenshots If applicable, add screenshots to help explain your problem.

Details (please provide any relevant information):

• otplib version: 12.0.1
• os: Linux arch 5.5.10-zen1-1-zen #1 ZEN SMP PREEMPT Wed, 18 Mar 2020 08:40:41 +0000 x86_64 GNU/Linux
• browser: firefox 74.0
• node / yarn: 1.22.4
• frameworks (if any): ionic 4.11.5 / angular 8.2.14 / karma 4.4.1 / jasmine 2.8.0

Additional context Add any other context about the problem here.

Source code https://github.com/ctiteam/apspace

[yeojz]

Hi @pickfire

That is expected as you're using the browser version. v12 has marked buffer as an external module. So you'll need to import buffer separately.

You can refer to: https://github.com/yeojz/otplib#in-browser

[pickfire]

@yeojz Is there a way to do that without:

<script src="https://unpkg.com/@otplib/preset-browser@^12.0.0/buffer.js"></script>
<script src="https://unpkg.com/@otplib/preset-browser@^12.0.0/index.js"></script>

[yeojz]

you probably can import buffer within your code: i.e.

import buffer from 'buffer';
window.Buffer = buffer

or use the node version

import { authenticator } from 'otplib'; // instead of otplib-browser

[pickfire]

@yeojz Do you mean do that inside the test?

import { authenticator } from 'otplib'; // instead of otplib-browser

Isn't that how to do it in version 11? Version 11 works this way using otplib-browser but version 12 doesn't for tests.

[yeojz]

No I meant when changing to v12, consider using the main entry and relay on your own bundler to package the module.

The difference between v11 and v12 is that it doesn't bundle in Buffer, and you'll have to ensure your build provides it.

[pickfire]

Ah, but why does it depends on Buffer? Is it a requirement? And shouldn't the preset browser includes a buffer?

[yeojz]

The initial thought was that the package will probably be used in a bundler. Packaging buffer would mean the end-users might bundle buffer twice, increasing the final output size.

After much thought, I acknowledge that the package should be plug and play. Will include that in v13.

[Myzel394]

I'm also facing the same issue; @yeojz will there be a v13?

you probably can import buffer within your code: i.e. import buffer from 'buffer'; window.Buffer = buffer

Doesn't seem to do the trick unfortunately :/