Use environmentVisitor

packages/babel-plugin-proposal-private-methods/src/index.js

@@ -105,20 +105,35 @@ export default declare((api, options) => {
         readonly: new Set(oldState.readonly),
         accessors: new Set(oldState.accessors),
       };
+      const stateDiff = {
+        ...oldState,
+        readonly: new Set(),
+        accessors: new Set(),
+      };
 
       for (const elt of path.get("body")) {
         if (elt.isPrivate()) {
           const { name } = elt.node.key.id;
-          state.readonly.delete(name);
-          state.accessors.delete(name);
+          if (state.readonly.delete(name)) stateDiff.readonly.add(name);
+          if (state.accessors.delete(name)) stateDiff.accessors.add(name);
         }
       }
 
       path.traverse(privateUsageVisitor, state);
+      // We only run the visitor for shadowed private names because
+      // we must be careful not to transform accessors twice:
+      // this.#foo shouldn't became this.#foo._._
+      path.traverse(privateUsageEnvironmentVisitor, stateDiff);
+
       path.skip();
     },
   };
 
+  const privateUsageEnvironmentVisitor = traverse.visitors.merge([
+    environmentVisitor,
+    privateUsageVisitor,
+  ]);
+
   const accessorThisUsageVisitor = traverse.visitors.merge([
     environmentVisitor,
     {

packages/babel-plugin-proposal-private-methods/test/fixtures/accessors-to-private-property/shadowed-nested-class-key/input.js

@@ -0,0 +1,31 @@
+class A {
+  get #foo() {}
+  set #foo(x) {}
+
+  get #bar() {}
+  set #bar(x) {}
+
+  #baz;
+
+  test() {
+    class B {
+      #foo;
+
+      get #baz() {}
+      set #baz(x) {}
+
+      [this.#foo]() {
+        this.#foo = 1;
+        this.#bar = 2;
+      }
+      [this.#bar]() {
+        this.#foo = 3;
+        this.#bar = 4;
+      }
+      [this.#baz]() {
+        this.#foo = 3;
+        this.#bar = 4;
+      }
+    }
+  }
+}

packages/babel-plugin-proposal-private-methods/test/fixtures/accessors-to-private-property/shadowed-nested-class-key/output.js

@@ -0,0 +1,48 @@
+var _get_foo, _set_foo, _get_bar, _set_bar;
+
+class A {
+  #foo = Object.defineProperty({
+    t: this
+  }, "_", {
+    get: _get_foo || (_get_foo = function () {}),
+    set: _set_foo || (_set_foo = function (x) {})
+  });
+  #bar = Object.defineProperty({
+    t: this
+  }, "_", {
+    get: _get_bar || (_get_bar = function () {}),
+    set: _set_bar || (_set_bar = function (x) {})
+  });
+  #baz;
+
+  test() {
+    var _get_baz, _set_baz;
+
+    class B {
+      #baz = Object.defineProperty({
+        t: this
+      }, "_", {
+        get: _get_baz || (_get_baz = function () {}),
+        set: _set_baz || (_set_baz = function (x) {})
+      });
+      #foo;
+
+      [this.#foo._]() {
+        this.#foo = 1;
+        this.#bar._ = 2;
+      }
+
+      [this.#bar._]() {
+        this.#foo = 3;
+        this.#bar._ = 4;
+      }
+
+      [this.#baz._]() {
+        this.#foo = 3;
+        this.#bar._ = 4;
+      }
+
+    }
+  }
+
+}