The JavaScript exception "invalid property name in regular expression" or "invalid class property name in regular expression" oc…

PEP 823 và PEP 824, do Marc Mueller soạn thảo và Guido van Rossum bảo trợ, đề xuất bốn toán tử nhận biết None cho Python: ?., ?[], ?? và ??=. Cả hai PEP hiện vẫn là bản nháp — cú pháp này vẫn gây lỗi SyntaxError trên mọi phiên bản đã phát hành, kể cả bản alpha đầu tiên của Python 3.16.

I have validated the JSON and I'm certain it is clean. I'm loading it from a web server (using Node.js). The Firefox error is "Uncaught SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data". Chrome reports the unexpected character to be "

Quoting Bi (@Bituider) 🎉

はじめに React+Vite+Supabaseで作ったアプリをFirebase Hostingデプロイしました。 CI/CDの学習のためにGitHub Actionsでgit pushされたらビルドとデプロイを自動化するワークフローを作成しました。 しかしNode.js...

Currently trying to build the UXP example app. I have MozillaBuild 3.4 installed at C:\uxp-build. Here is the error I get: CODE: 0:01.66 c:\uxp-build\bin\mozmake.EXE -f client.mk MOZ_PARALLEL_BUILD=8 -s configure 0:09.84 File "c:/Users/Aubrey/src/xim/platform/config/pythonpath.py", line 12 0:09.84 print("pythonpath.py -I directory script.py [args...]", file=sys.stderr) 0:09.84 ^ 0:09.84 SyntaxError: invalid syntax 0:09.84 client.mk:196: c:/Users/Aubrey/src/xim/obj-x86_64-pc-mingw32/.mozconfig.mk: No such file or directory 0:09.84 mozmake.EXE: *** [client.mk;338: c:/Users/Aubrey/src/xim/obj-x86_64-pc-mingw32/CLOBBER] Error 1 And my mozconfig: CODE: # Tell the build system if we're building 64-bit.# Set this to `BUILD_64=` for 32-bit, leave as-is for default 64-bitBUILD_64=1# Processor architecture specific build optionsif [ -n "$BUILD_64" ]; then BUILD_ARCH=x64 ac_add_options --target=x86_64-pc-mingw32 ac_add_options --host=x86_64-pc-mingw32else BUILD_ARCH=x86fi# Automatically clobber if CLOBBER was touchedmk_add_options AUTOCLOBBER=1# Application and targetac_add_options --enable-application=palemoon# Build options# Adjust the -j parameter if you need more or fewer parallel build tasks# Maximum supported without build errors is around 32, and it's recommended to set this to # number of cores in your CPU -2mk_add_options MOZ_MAKE_FLAGS="-j8"ac_add_options --enable-optimize="-O2 -GTs -GS- -Qspectre -utf-8"# Please see https://www.palemoon.org/redist.shtml for restrictions when using the official branding.ac_add_options --enable-official-brandingexport MC_OFFICIAL=1export MOZILLA_OFFICIAL=1# Only enable the internal updater if you supply automatic update infrastructure# and have configured the relevant preferences in your branding!ac_add_options --enable-update-channel=releaseac_add_options --disable-updater# Enabling this only offers marginal benefits on first start and may not work on own buildsac_add_options --disable-precompiled-startupcacheac_add_options --enable-jemallocac_add_options --enable-stripac_add_options --disable-parental-controlsac_add_options --disable-accessibilityac_add_options --disable-gamepadac_add_options --enable-webrtcac_add_options --enable-av1WIN32_REDIST_DIR="C:/Program Files/Microsoft Visual Studio/18/Community/VC/Redist/MSVC/14.44.35112/$BUILD_ARCH/Microsoft.VC143.CRT"WIN_UCRT_REDIST_DIR="C:/Program Files (x86)/Windows Kits/10/Redist/10.0.26100.0/ucrt/DLLs/$BUILD_ARCH" It is also worth noting that I have a newer version of MozillaBuild installed at C:\mozilla-build for building projects based on the newer Mozilla codebase. That shouldn't conflict with my 3.4 install, should it? * * *

Why you get "SyntaxError: Cannot use import statement outside a module" and how to fix it in the browser, Node.js, TypeScript and Jest, with the exact change for each case.

You copy a neat snippet from an LLM chat window. You paste it into VS Code. Everything looks completely fine. The indentation is right, the variable names are clear, and there is no red squiggle in your editor. Then you run your build: SyntaxError: Unexpected token '​' (U+200B) in JSON at position 142 Or in Python: SyntaxError: invalid character '​' (U+200B) You stare at line 14. There is nothing there. You backspace the whitespace, retype it, and suddenly the error disappears. If you have spent any time copying code from conversational AI assistants over the past two years, you have almost certainly encountered this phantom bug. Here is what is actually going on, why compilers hate it, and how to sanitize your code before it lands in a pull request. ## The Phantom Characters: Unicode Zero-Width Tokens When large language models generate text or format markdown tables and fenced code blocks, the clipboard content frequently inherits non-printable Unicode characters. The most common culprits include: Unicode Hex | Name | Purpose in Text | Why Compilers Choke ---|---|---|--- `\u200B` | Zero-Width Space | Word break opportunity without visible space | Read as an unexpected literal token `\uFEFF` | Byte Order Mark (BOM) | UTF byte order marker | Breaks JSON parsers and strict headers `\u200C` | Zero-Width Non-Joiner | Prevents typographic ligatures | Invalids identifier syntax `\u200D` | Zero-Width Joiner | Combines complex emoji/scripts | Breaks regexes expecting ASCII `\u00A0` | Non-Breaking Space | Prevents automatic line wrapping | Breaks Python indentation levels Because these characters have **zero advance width** , modern font renderers draw them with a width of exactly zero pixels. To your eyes, the code is spotless. To the lexical scanner in your compiler, an alien byte is sitting right between your variable and its semicolon. ## 3 Places Zero-Width Spaces Cause Real Havoc ### 1. JSON Configuration Files (`package.json`, CI configs) Standard JSON parsers (including Node.js's built-in `JSON.parse` and Python's `json.loads`) are strictly defined around RFC 8259. They do not allow unescaped control characters or foreign Unicode whitespace inside keys or values. A single `\u200B` inside a GitHub Actions YAML or `tsconfig.json` will fail the build with a cryptic parsing error. ### 2. Regular Expressions If your code validates usernames, slugs, or emails: const usernameRegex = /^[a-zA-Z0-9_]{3,16}$/; const input = "kyiron\u200B"; console.log(usernameRegex.test(input)); // false! The test fails even though `input` visibly prints as `"kyiron"`. In production, this leads to bizarre bugs where users cannot log in or forms reject valid inputs. ### 3. Git Diffs and Code Review When invisible characters get committed, Git treats the line as modified. If another developer's editor automatically strips trailing whitespace or normalizes Unicode on save, you end up with noisy ghost diffs where lines change without any visible difference. ## How to Detect Them in Terminal If you suspect a file has contaminated invisible characters, you can inspect it in your shell using `cat` or `od`: # Print non-printable characters visually (shows \u200B as M-BM-^K or similar) cat -v config.json # Or find exact hex positions: grep -P "[\x{200B}\x{FEFF}\x{200C}\x{200D}]" src/index.ts In Node.js, you can test a string with a simple regex: const hasZeroWidth = /[\u200B-\u200D\uFEFF]/.test(copiedCode); if (hasZeroWidth) { console.warn("Contaminated code snippet detected!"); } ## The Instant In-Browser Solution If you copy snippets frequently from ChatGPT, Claude, or Gemini, having to write terminal regexes every time is tedious. I built a free utility within **UnmarkPro** specifically to handle this: the **AI Text Sanitizer & Zero-Width Scrubber**. * **What it does:** You paste your copied code or markdown. It immediately highlights invisible characters in red, shows you their exact Unicode hex identifiers, strips them cleanly, and lets you copy the sanitized code with one click. * **Privacy:** Runs 100% locally in your browser. No text is sent to any server, making it safe for proprietary codebases, API configs, and client deliverables. * **Zero sign-up:** No accounts, no paywalls, no tokens. You can read the deep-dive guide on zero-width spaces in AI code here. ## Best Practices for AI-Assisted Development 1. **Enable Unicode Highlight in VS Code:** In VS Code settings, search for `editor.unicodeHighlight.invisibleCharacters` and set it to `true`. This will outline zero-width tokens with a small yellow box. 2. **Sanitize Prompt Dumps:** Before saving AI boilerplate into shared config files, run it through a sanitizer or inspect it via `cat -v`. 3. **Add Linter Rules:** Add an ESLint rule like `no-irregular-whitespace` to catch foreign spaces at the pull-request stage before they reach production.

A SyntaxError from a sed one-liner took down the store backend for about 17 minutes on Day 206. The fix was one command that should have run first.

A SyntaxError from a sed one-liner took down the store backend for about 17 minutes on Day 206. The fix was one command that should have run first.

SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON Everyone knows what this means by now: the server sent HTML, your `res.json()` tried to parse it, the parser quit on the first character. What I had never thought about is the quoted part. `"<!DOCTYPE "` is not a canned string V8 prints for HTML responses. It is **the literal first ten characters of whatever you handed the parser**. Which makes it a free, zero-effort peek at the response body — and it is more precise than I assumed. ## Where the cut happens I grew the input one character at a time on node v24.13.0 (V8 13.6.233.17): for (let n = 8; n <= 24; n++) { const s = '<' + 'x'.repeat(n - 1); try { JSON.parse(s); } catch (e) { console.log(n, e.message); } } 20 -> Unexpected token '<', "<xxxxxxxxxxxxxxxxxxx" is not valid JSON 21 -> Unexpected token '<', "<xxxxxxxxx"... is not valid JSON **20 characters or fewer: quoted whole. 21 or more: first ten, then`...`.** One threshold, one prefix width. Except the ten is not measured from the start of the string. It is measured from **where parsing failed**. Push the failure point inward with a value that starts out valid, and the quote grows to match: for (const pad of [0, 1, 2, 5, 10]) { const s = '[' + ' '.repeat(pad) + 'o'.repeat(40); // '[' opens an array, then junk try { JSON.parse(s); } catch (e) { console.log(e.message); } } fails at 1 -> "[oooooooooo"... 11 chars fails at 2 -> "[ oooooooooo"... 12 fails at 3 -> "[ oooooooooo"... 13 fails at 6 -> "[ oooooooooo"... 16 fails at 11 -> " oooooooooo"... 20 <- and now it slides So the actual rule: **the quoted window ends ten characters past the failure point and is capped at 20 characters wide** , sliding forward once it hits the cap — and if the whole input fits in 20, you get all of it with no `...`. For an HTML response none of that matters, because `<` fails at index 0 and the window is just the first ten. But it explains why the same error sometimes quotes eleven characters, or a run of text from the middle of the payload. The message still gives you two free readings: * A trailing `...` means the body was longer than 20 characters. * **No** `...` means the quotes contain the entire response. Whatever is between them is everything the server sent. The second one is the useful half. A short body is fully diagnosed from the error line alone, without opening DevTools. ## The prefix is a fingerprint Ten characters is enough to identify most things that show up where JSON should be. Each row below is the message that body actually produced: Quoted prefix | Body started as | Typically ---|---|--- `"<!DOCTYPE "...` | an HTML document | 404/500 page, login page, SPA `index.html` `"<script sr"...` | HTML starting with `<script src=` | a script injected ahead of the page, a CDN or WAF interstitial `"<?xml vers"...` | XML | `<Error><Code>` from object storage `"Internal S"...` | one line of plain text | a proxy or gateway wrote the 500 itself `"undefined"` | the string `"undefined"` | not the server — you passed a missing value `"[object Object]"` | a stringified object | `JSON.parse` on something already parsed The last two are worth internalising, because they print **without** any `Unexpected token` prefix — just `"undefined" is not valid JSON`. There is no token to name, so V8 skips that clause entirely. If you see that shape, stop looking at the network tab; nothing came off the wire. ## Meanwhile, nobody honours your Accept header I assumed a framework would at least try to answer JSON when you ask for it explicitly. It does not. Against this site's own Next.js 16 dev server: curl -s -i -H "Accept: application/json" http://localhost:3000/api/nope HTTP/1.1 404 Not Found Content-Type: text/html; charset=utf-8 <!DOCTYPE html><html lang="ko"> <- 26,283 bytes 26,283 bytes of rendered 404 page, in reply to a request that said it wanted JSON. Production, on Vercel, sent 20,672 bytes of the same thing. The `Accept` header changed nothing on either. ## And `fetch` hands it to you as a success Same call against five targets: Target | status | ok | redirected | Content-Type | `res.json()` ---|---|---|---|---|--- missing API route, dev | 404 | false | false | text/html | SyntaxError missing API route, prod | 404 | false | false | text/html | SyntaxError http -> https redirect | 404 | false | **true** | text/html | SyntaxError healthy JSON API | 200 | true | false | application/json | parsed port with nothing on it | — | — | — | — | TypeError In the first four rows `fetch` never threw. Every exception came from `res.json()`. So the message points at JSON while the actual evidence — `status`, `Content-Type`, `redirected` — was already sitting in your hand one line earlier. Two of those rows deserve a note: **`redirected: true`** is the login-page case. `fetch` follows redirects silently, so an expired session gets you a 200 with a login page in the body and no indication that you went somewhere else. `res.url` is the tell. **The last row is a different error entirely.** No `res` exists. Node says `TypeError: fetch failed`, Chrome 152 says `TypeError: Failed to fetch`. Same situation, two strings, and only one of them is searchable alongside the other. ## The wrapper The fix is to look at the body before the parser does, and to put the body in the error when it is not JSON: async function getJson(url) { const res = await fetch(url, { headers: { Accept: 'application/json' } }); const type = res.headers.get('content-type') || ''; const body = await res.text(); // text first, not json if (!type.includes('application/json')) { throw new Error( `Not JSON: ${res.status} ${type}\n` + `final URL: ${res.url}${res.redirected ? ' (redirected)' : ''}\n` + `first 200 chars: ${body.slice(0, 200)}` ); } if (!res.ok) throw new Error(`${res.status}: ${body.slice(0, 200)}`); return JSON.parse(body); } `res.text()` first is the part that matters. The body is a stream you get **once** , so calling `res.text()` after `res.json()` already failed throws a second, less interesting error about the body being disturbed. Reverse the order and the body is still yours at the moment you need it. The `Content-Type` check also catches the case an `res.ok` guard cannot: a dev server or proxy answering `/api/...` with `index.html` at status **200**. ## Python tells you nothing Worth knowing if you move between the two. Four bodies that fail for four different reasons, through `json.loads` on python 3.11.9: '<!DOCTYPE html>\n<html>' -> Expecting value: line 1 column 1 (char 0) '' -> Expecting value: line 1 column 1 (char 0) 'Internal Server Error' -> Expecting value: line 1 column 1 (char 0) 'undefined' -> Expecting value: line 1 column 1 (char 0) Identical. `char 0` says the first character was not the start of a value and stops there — it never says which character. The V8 message is doing real work that `json` does not, so on the Python side you have to print `r.text[:200]` yourself. One more asymmetry in the same direction: `urllib` **raises** `HTTPError` on a 404, where `fetch` resolves happily. `requests` behaves like `fetch` and leaves `r.ok` to you. The long version, with the five causes and how the headers separate them, is here: https://www.coding-now.com/en/guides/unexpected-token-doctype-json?utm_source=devto If anyone knows whether that 20/10 window is stable across V8 versions, I would like to hear it — I only measured one, and I did not check SpiderMonkey or JavaScriptCore at all. And if you have seen a prefix that is not in the table above, post it; the fingerprint list is the part that gets more useful with more eyes.