Wsrtjtyk

I have a few javascript files which are define helper classes which used in some of my pages which use Angular for the user interaction. I just require these files in manifest for the controllers that need them, and it's all working fine.

The problem has come in trying to test these classes using Jasmine. My Jasmine tests were throwing type errors until I put the "export" keyword in front of the javascript class definitions in these files. Then the tests worked fine, but the web pages that use these classes would throw a syntax error on encountering the export keyword.

The javascript classes are pretty straightforward, just two ES6 class definitions like this;

class ProjectBudget {

  constructor() {



    this._map = new Map();

    this._total = 0;

    this._postedTotal = 0;   

  }

  load(rowObject) {

    [...]

  }

  //other methods

}



class ProjectBudgetItem {



  constructor(id, name, amount, parent, hasBudgetDetail = false) {

    this._accountId = id;

    this._accountName = name;

    this._rowState = "loaded";



  }

  //various methods

  } 

The test looks like this:

import   {ProjectBudget, ProjectBudgetItem} from "../../app/assets/javascripts/budgeting_scripts/project_budget_classes.js"



describe("ProjectBudgets", () => {

    it("can create a projectBudget", () => {

       // expect(foo).toEqual("Foo");



        let pb = new ProjectBudget();



        expect(pb.dirty).toEqual(false);

        let obj={accountId: 3, name: "Carpenters", budgetAmount: 1000, hasDetailedbudget: false}

        pb.load(obj)

        expect(pb.total).toEqual(1000);

    })

});

The only way I can get the test to run is to change
'class ProjectBudget' to 'export class ProjectBudget' otherwise I get an error like this:

 FAILED TESTS:





 ProjectBudgets

    ✖ can create a projectBudget

      Chrome 70.0.3538 (Mac OS X 10.13.6)

    TypeError: o.ProjectBudget is not a constructor

        at <Jasmine>

        at UserContext.<anonymous> (webpack:///spec/javascripts/budget_spec.js:7:17 <- spec/javascripts/budget_spec-2f776bfad8fdb52497f7.js:1:711)

        at <Jasmine>

Unfortunately once I do this, when the my application loads the webpage which uses these classes, the browser throws a syntax error on the word "export".

Not sure how to resolve this conflict.

The solution in this case was to eliminate the import statement and include the scripts I need (without the 'export' keyword) under the 'files' key in karma.conf.js. Maybe not the best solution as it would be nice to be able to specify in the test what files to load rather than in the configuration file, but at least it worked.