Introduce failing test cases for emberjs#423, emberjs#425

Author: chriskrycho

node-tests/addon-test.js

@@ -127,6 +127,52 @@ describe('ember-cli-babel', function() {
       });
     }));
 
+    describe('decorators and class fields', function() {
+      it(
+        "can compile decorators",
+        co.wrap(function* () {
+          input.write({
+            "foo.js": `import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nexport default class Foo extends Component { @tracked thisIsTracked = true; }`,
+          });
+  
+          this.addon.project.targets = {
+            browsers: ["last 2 chrome versions"],
+          };
+  
+          subject = this.addon.transpileTree(input.path(), {});
+  
+          output = createBuilder(subject);
+  
+          yield output.build();
+          expect(output.read()["foo.js"]).not.to.include(
+            "_initializerWarningHelper(_descriptor, this)"
+          );
+        })
+      );
+
+      it(
+        "can compile class fields",
+        co.wrap(function* () {
+          input.write({
+            "foo.js": `import Component from '@ember/component';\n\nexport default class Foo extends Component { thisIsAField = true; }`,
+          });
+
+          this.addon.project.targets = {
+            browsers: ["last 2 chrome versions"],
+          };
+
+          subject = this.addon.transpileTree(input.path(), {});
+
+          output = createBuilder(subject);
+
+          yield output.build();
+          expect(output.read()["foo.js"]).not.to.include(
+            "Decorating class property failed"
+          );
+        })
+      );
+    });
+
     describe('ember modules API polyfill', function() {
       it("does not transpile deprecate debug tooling import paths", co.wrap(function* () {
         input.write({

node-tests/get-babel-options-test.js

@@ -71,7 +71,7 @@ describe("get-babel-options", function () {
       expect(
         _addDecoratorPlugins([], {}, {}, this.addon.parent, this.addon.project)
           .length
-      ).to.equal(2, "plugins added correctly");
+      ).to.equal(4, "plugins added correctly");
     });
 
     it("should include only fields if it detects decorators plugin", function () {
@@ -91,7 +91,7 @@ describe("get-babel-options", function () {
           this.addon.parent,
           this.addon.project
         ).length
-      ).to.equal(2, "plugins were not added");
+      ).to.equal(4, "plugins were not added");
     });
 
     it("should include only decorators if it detects class fields plugin", function () {
@@ -123,7 +123,7 @@ describe("get-babel-options", function () {
         this.addon.project
       );
 
-      expect(strictPlugins[1][1].loose).to.equal(
+      expect(strictPlugins[strictPlugins.length - 1][1].loose).to.equal(
         false,
         "loose is false if no option is provided"
       );
@@ -136,7 +136,7 @@ describe("get-babel-options", function () {
         this.addon.project
       );
 
-      expect(loosePlugins[1][1].loose).to.equal(
+      expect(loosePlugins[loosePlugins.length - 1][1].loose).to.equal(
         true,
         "loose setting added correctly"
       );
@@ -157,7 +157,7 @@ describe("get-babel-options", function () {
         "@babel/plugin-transform-typescript",
         "typescript still first"
       );
-      expect(plugins.length).to.equal(3, "class fields and decorators added");
+      expect(plugins.length).to.equal(5, "class fields and decorators added");
     });
 
     it("should include class fields and decorators before typescript if not handling typescript", function () {
@@ -172,8 +172,8 @@ describe("get-babel-options", function () {
         this.addon.project
       );
 
-      expect(plugins.length).to.equal(3, "class fields and decorators added");
-      expect(plugins[2]).to.equal(
+      expect(plugins.length).to.equal(5, "class fields and decorators added");
+      expect(plugins[4]).to.equal(
         "@babel/plugin-transform-typescript",
         "typescript is now last"
       );

tests/acceptance/simple-test.js

@@ -14,5 +14,8 @@ module('Acceptance | ES6 features work correctly', function(hooks) {
     assert.equal('dog', this.element.querySelector('#animal-value').textContent, 'Has class and getters/setters and decorators as ES6 feature');
     assert.equal('mammal', this.element.querySelector('#animal-type').textContent, 'Has class decorators as ES6 feature');
     assert.equal('mammal', this.element.querySelector('#static-animal-type').textContent, 'static and fields as an ES6 class feature');
+    assert.equal('123', this.element.querySelector('#uses-decorators').textContent, 'decorated class fields work in the app')
+    assert.equal('private field', this.element.querySelector('#gets-private-field').textContent, 'private class fields work in the app')
+    assert.equal('private method', this.element.querySelector('#calls-private-method').textContent, 'private methods work in the app')
   });
 });

tests/dummy/app/components/basic.js

@@ -0,0 +1,20 @@
+import Component from "@glimmer/component";
+import { tracked } from "@glimmer/tracking";
+
+export default class Basic extends Component {
+  @tracked someField = 123;
+
+  #privateField = "private field";
+
+  #privateMethod() {
+    return "private method";
+  }
+
+  get getsPrivateField() {
+    return this.#privateField;
+  }
+
+  get callsPrivateMethod() {
+    return this.#privateMethod();
+  }
+}

tests/dummy/app/templates/application.hbs

@@ -8,4 +8,6 @@
 <div id="animal-type">{{animal.type}}</div>
 <div id="static-animal-type">{{staticAnimalType}}</div>
 
+<Basic />
+
 {{outlet}}