Actually, both atob() and btoa().
This Is Specifically in VS Code
Because if I said "... on VS Code", that would sound like I was physically standing on top of VS Code, like a skateboard 🛹 😂 🤔
At the moment, it is a bug 🪲, until it is not 🔧, in their IntelliSense for JavaScript. I noticed it since few years behind. Indeed it is harmless. But since last week, when I opened my certain Node.js project (monolithic — frontend and backend in one project), I kept on noticing the struck through function, therefore, here's how to fix it.
For your information, the JavaScript (ECMAScript) here is actual browser (client — frontend) language, not server-side or backend (Node.js). But also in this post, we'll see implementation in Node.js 🤔🙂
This is deprecation notice for atob():
This is deprecation notice for btoa():
Fix: Attach Window Object
For atob()
For btoa()
Fixed 👍
History
The methods atob() and btoa() are actually part of HTML standard and not included in ECMAScript (JavaScript) specification, hence the awkwardness.
The Node.js Whoopsie Timeline™
Initially didn't include them ➡️ but then included them ➡️ finally, deprecated them.
Node.js (Server-Side)
We can use Buffer function to achieve either one.
Decoding ➡️ atob() equivalency in Node.js:
Method to decode a Base64-encoded string to a binary string.
base64String is the Base64-encoded string input.
Encoding ➡️ btoa() equivalency in Node.js:
Method to encode a binary string into a Base64-encoded ASCII string.
regularString is the string input.
Binary
Encoding ➡️ Binary to ASCII (Base64-encoded) ➡️ B to A ➡️ btoa
Decoding ➡️ ASCII (Base64-encoded) to Binary ➡️ A to B ➡️ atob
You might wonder, binary? What binary?
It does not actually mean raw binary data (like 0s and 1s). Instead, it means a normal string, but in a way that the browser sees as binary-safe.
A binary-safe function means that it handles all possible byte values correctly (from 0x00 to 0xFF).
In another words:
- It does not break if there are weird characters, null bytes (
\0), or non-printable data. - It preserves data exactly as it is, without corrupting or truncating anything.
🙂
Magnum Opus
In my opinion, VS Code is like that. But specifically for developers' civilizations. Grand masterpiece of developers' civilizations 🏆
There are multiple groups of developers, each having their own separate civilizations: Frontend Civilization, Backend Civilization, DevOps Civilization — all thriving like ancient empires.
Summary
To summarize, the false deprecation information is because IntelliSense prioritizes the first-found definition — and in a Node.js-based project, the Node.js version of atob() and btoa() gets loaded first.
React.js, Angular.js, Nuxt.js, Next.js, and so forth are Node.js in different suits 🤔 ... In a way 🙂... They all have package.json? There you go.
Even when we make a folder with just one index.html, write thousands of lines on that particular HTML file, and we do npm init in the folder, then install auto-reload package for the Lone Ranger HTML file ➡️ Welcome, good sir, to Node.js.
☑️ The example above actually has no problem, the IntelliSense will use frontend or browser language definition.
🪲 It will show the false deprecation notice when you have packages which are specifically server-side.
This leads to VS Code mistakenly strikes them through, even though they are actually sacred and functional in the browser.
Thus, if your project is Node.js-based, expect this awkwardness.
But then again, it stays awkward until it is not — whenever the VS Code team decides to fix it.
🪲 atob() in VS Code
The signature '(data: string): string' of 'atob' is deprecated.ts(6387)
buffer.d.ts(2208, 12): The declaration was marked as deprecated here.
function atob(data: string): string (+2 overloads)
Decodes a string of Base64-encoded data into bytes, and encodes those bytes into a string using Latin-1 (ISO-8859-1).
The data may be any JavaScript-value that can be coerced into a string.
This function is only provided for compatibility with legacy web platform APIs and should never be used in new code, because they use strings to represent binary data and predate the introduction of typed arrays in JavaScript. For code running using Node.js APIs, converting between base64-encoded strings and binary data should be performed using Buffer.from(str, 'base64') andbuf.toString('base64').
✅ Solution for atob()
🪲 btoa()
The signature '(data: string): string' of 'btoa' is deprecated.ts(6387)
buffer.d.ts(2224, 12): The declaration was marked as deprecated here.
function btoa(data: string): string (+2 overloads)
Decodes a string into bytes using Latin-1 (ISO-8859), and encodes those bytes into a string using Base64.
The data may be any JavaScript-value that can be coerced into a string.
This function is only provided for compatibility with legacy web platform APIs and should never be used in new code, because they use strings to represent binary data and predate the introduction of typed arrays in JavaScript. For code running using Node.js APIs, converting between base64-encoded strings and binary data should be performed using Buffer.from(str, 'base64') andbuf.toString('base64').
✅ Solution for btoa()
Too Specific, It's Funny
Foodies review meals, ambiance, and the entire dining experience.
And then there's this post.
This post, in the foodies' field, is like, about the right bottom corner of a particular customer restroom's footstool... in a restaurant from a lost civilization... explaining the uncle of the plumber...
That is exquisitely interesting.
🤣
One Last Bit
Do you wonder why in horse's hoof it's called JavaScript if it's actually ECMAScript?
ECMA stands for European Computer Manufacturers Association.
Timeline™
- 1995 ➡️ Brendan Eich creates a language in 10 days (YES, 10 DAYS 🤯) at Netscape.
-
Netscape wants marketing hype ➡️ Java is hot! Let's name it JavaScript!
Actuality: Java and JavaScript have NOTHING in common.
- 1997 ➡️ Standardized under ECMAScript (ES1) because the industry needed a neutral name.
- The whoopsie was already done. The name JavaScript stuck.
So Why Not Just Call It ECMAScript?
- Because ECMAScript sounds like a pharmaceutical drug. 💊
- Because JavaScript was already burned into everyone's brain.
- Because reasons.
Comments
Post a Comment