diff --git a/devtools/client/debugger/bin/module-manifest.json b/devtools/client/debugger/bin/module-manifest.json
index 1bd71fb4cdd5..d4c0682045be 100644
--- a/devtools/client/debugger/bin/module-manifest.json
+++ b/devtools/client/debugger/bin/module-manifest.json
@@ -2212,7 +2212,7 @@
"byName": {},
"byBlocks": {},
"usedIds": {
- "1": 1
+ "0": 0
}
}
}
@@ -2233,7 +2233,7 @@
"byName": {},
"byBlocks": {},
"usedIds": {
- "1": 1
+ "0": 0
}
}
}
@@ -2254,7 +2254,7 @@
"byName": {},
"byBlocks": {},
"usedIds": {
- "1": 1
+ "0": 0
}
}
}
diff --git a/devtools/client/debugger/dist/pretty-print-worker.js b/devtools/client/debugger/dist/pretty-print-worker.js
index 9a9e7fda7e02..066b105572d9 100644
--- a/devtools/client/debugger/dist/pretty-print-worker.js
+++ b/devtools/client/debugger/dist/pretty-print-worker.js
@@ -3615,7 +3615,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__;/* -*- indent-
*/
function isIdentifierLike(token) {
var ttl = token.type.label;
- return ttl == "name" || ttl == "num" || !!token.type.keyword;
+ return ttl == "name" || ttl == "num" || ttl == "privateId" || !!token.type.keyword;
}
/**
@@ -3981,7 +3981,16 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__;/* -*- indent-
token.loc.start.line,
token.loc.start.column);
} else {
- write(String(token.value != null ? token.value : token.type.label),
+ let value;
+ if (token.value != null) {
+ value = token.value;
+ if (token.type.label === "privateId") {
+ value = `#${value}`;
+ }
+ } else {
+ value = token.type.label;
+ }
+ write(String(value),
token.loc.start.line,
token.loc.start.column);
}
diff --git a/devtools/client/debugger/package.json b/devtools/client/debugger/package.json
index 78fa226d6360..5f9b0c34a2a8 100644
--- a/devtools/client/debugger/package.json
+++ b/devtools/client/debugger/package.json
@@ -28,7 +28,7 @@
"lodash-move": "^1.1.1",
"lodash.kebabcase": "^4.1.1",
"parse-script-tags": "github:loganfsmyth/parse-script-tags#d771732ca47e1b3554fe67d609fd18cc785c5f26",
- "pretty-fast": "^0.2.5",
+ "pretty-fast": "^0.2.6",
"react": "16.8.6",
"react-aria-components": "^0.0.4",
"react-dom": "16.8.6",
diff --git a/devtools/client/debugger/test/mochitest/browser_dbg-pretty-print.js b/devtools/client/debugger/test/mochitest/browser_dbg-pretty-print.js
index 9ebaedad2302..035e11309e4f 100644
--- a/devtools/client/debugger/test/mochitest/browser_dbg-pretty-print.js
+++ b/devtools/client/debugger/test/mochitest/browser_dbg-pretty-print.js
@@ -3,6 +3,7 @@
* file, You can obtain one at . */
// Tests basic pretty-printing functionality.
+requestLongerTimeout(2);
add_task(async function() {
const dbg = await initDebugger("doc-minified.html", "math.min.js");
@@ -38,3 +39,86 @@ add_task(async function() {
await selectSource(dbg, "math.min.js");
ok(findElement(dbg, "prettyPrintButton"), "Pretty Print Button is visible");
});
+
+add_task(async function testPrivateFields() {
+ // Create a source containing a class with private fields
+ const httpServer = createTestHTTPServer();
+ httpServer.registerContentType("html", "text/html");
+ httpServer.registerContentType("js", "application/javascript");
+
+ httpServer.registerPathHandler(`/`, function(request, response) {
+ response.setStatusLine(request.httpVersion, 200, "OK");
+ response.write(`
+
+ Test pretty-printing class with private fields
+
+ `);
+ });
+
+ httpServer.registerPathHandler("/class-with-private-fields.js", function(
+ request,
+ response
+ ) {
+ response.setHeader("Content-Type", "application/javascript");
+ response.write(`
+ class MyClass {
+ constructor(a) {
+ this.#a = a;this.#b = Math.random();this.ab = this.#getAB();
+ }
+ #a
+ #b = "default value"
+ static #someStaticPrivate
+ #getA() {
+ return this.#a;
+ }
+ #getAB() {
+ return this.#getA()+this.
+ #b
+ }
+ }
+ `);
+ });
+ const port = httpServer.identity.primaryPort;
+ const TEST_URL = `http://localhost:${port}/`;
+
+ info("Open toolbox");
+ const dbg = await initDebuggerWithAbsoluteURL(TEST_URL);
+
+ info("Select script with private fields");
+ await selectSource(dbg, "class-with-private-fields.js", 2);
+
+ info("Pretty print the script");
+ clickElement(dbg, "prettyPrintButton");
+
+ info("Wait until the script is pretty-printed");
+ await waitForSelectedSource(dbg, "class-with-private-fields.js:formatted");
+
+ info("Check that the script was pretty-printed as expected");
+ const prettyPrintedSource = await findSourceContent(
+ dbg,
+ "class-with-private-fields.js:formatted"
+ );
+
+ is(
+ prettyPrintedSource.value.trim(),
+ `
+class MyClass {
+ constructor(a) {
+ this.#a = a;
+ this.#b = Math.random();
+ this.ab = this.#getAB();
+ }
+ #a
+ #b = 'default value'
+ static #someStaticPrivate
+ #getA() {
+ return this.#a;
+ }
+ #getAB() {
+ return this.#getA() + this.#b
+ }
+}
+ `.trim(),
+ "script was pretty printed as expected"
+ );
+});
diff --git a/devtools/client/debugger/yarn.lock b/devtools/client/debugger/yarn.lock
index aa3193ead644..5eb9c88b73c7 100644
--- a/devtools/client/debugger/yarn.lock
+++ b/devtools/client/debugger/yarn.lock
@@ -6292,10 +6292,10 @@ preserve@^0.2.0:
resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b"
integrity sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=
-pretty-fast@^0.2.5:
- version "0.2.5"
- resolved "https://registry.yarnpkg.com/pretty-fast/-/pretty-fast-0.2.5.tgz#b4dbc37a945d0de52eb268f81f6ca696623aa96b"
- integrity sha512-olVM1CpLIrLhD0q8ZW42dMdTFuEfHynJhmuWirTS5EmWwN2w/v1Dl3WV4PeBLU7SH/a70Hy/HdeztVaLTqwaJw==
+pretty-fast@^0.2.6:
+ version "0.2.6"
+ resolved "https://registry.yarnpkg.com/pretty-fast/-/pretty-fast-0.2.6.tgz#1f3077331805080eefe345b52da45a816a361695"
+ integrity sha512-mMRZ/SY5k//EDjrRD88hfrByU4Tjn869gbEU3Nj0zspMddrIn4ZyNr/Cw65tpq4mYM/T6ZKBwWgqb/d3QU6gVw==
dependencies:
acorn "~8.2.4"
optimist "~0.6.1"