utf8 confuses browserify

[gpersoon]

Expected behavior

web3 can be browserified to use in browser

Actual behavior

Uncaught SyntaxError: Unexpected identifier in chrome developer console

Steps to reproduce the behavior

browserify web3.js and use it in an application

Open https://github.com/ethereum/web3.js/blob/1.x/packages/web3-utils/src/index.js in an editor that can show files in multiple formats (like notepad++)
Switch the format to ASCII.
Observe the last 10 lines, start at toTwosComplement.
Here you see multiples instances of Â, which are utf8 characters

    toTwosComplement: utils.toTwosComplement,

    isBloom: utils.isBloom,
    isUserEthereumAddressInBloom: utils.isUserEthereumAddressInBloom,
    isContractAddressInBloom: utils.isContractAddressInBloom,
    isTopic: utils.isTopic,
    isTopicInBloom: utils.isTopicInBloom,
    isInBloom: utils.isInBloom
};

Logs

Environment

windows 10, chrome, web3.js 1.2.9, installed via npm install web3

[cgewecke]

@gpersoon Thanks for reporting.

This is very odd - it looks like those characters may have been introduced in #3291. (We should also check #3137).

Could you clarify when and how you see this error? Does the entire package fail to load?

Web3.js uses browserify to generate the minified bundle it publishes to CDN and we run tests using it in Chrome and Firefox headless browsers. Everything works there but it's likely these whitespace chars are being removed during the uglification step.

(That might be a work-around in your case as well.)

[gpersoon]

Could you clarify when and how you see this error? Does the entire package fail to load?

I see the error in a website that includes a bundle.js that is created with browserify.
The executing of the javascript in the website stops at:

bundle.js:81190 Uncaught SyntaxError: Unexpected identifier

This is exactly the location where the  characters are located

I also checked on firefox, where i saw this message:

The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol.

I figured out putting the following line in the HTML file is a workaround to recognize & ignore the special characters:

<meta charset="utf-8" />