How to import a javascript class and extend it in another script unit
- 6 years ago
Hi Robert,
Thanks for the prompt response. I did help to reconsider what I was doing because the code I shared with you was OK. But I realised something - the issue was not due to these being in different projects - in fact I had shared the Parent.js into the project containing the Child.js. It was because of circular references. Though the TestComplete documentation says Javascript supports circular references, there is catch here:
My example question did not mention the full context - here's the code that I had issues with:
PARENT.JS
// In Parent.js - In Project 1, but shared into Project 2 using Add Existing Item... var child = require("Child") class ParentApp { constructor(x) { this.name = x; } } function initializeGlobal() { var childObj = new child.ChildClass("Me", 3); } module.exports = {ParentClass: ParentApp}
CHILD.JS
// In Child.js - in Project 2 - also shared into Project 1 var parent = require("Parent") class ChildApp extends parent.ParentClass { constructor(y, z) { super(y); this.age = z; } } function test() { var myChild = new ChildApp('Bill', 25); Log.Message(myChild.age); } module.exports = { ChildClass: ChildApp }
What was happening was that in Parent.js when the first .... var child = require("Child").... was called, the require tried to load Child.JS - and in this was trying to execute "class ChildApp extends parent.ParentClass" which threw an error. This was because parent.ParentClass wasn't loaded yet. If I removed the extends all was well.
So what I did was to refactor the code so that the function "initializeGlobal()" was in another common script that avoided the circular referencing. It seems circular referencing fails with extends.
SAMPLE WORKING CODE:
INIT.JS
// In Init.js, in Project 1 var parent = require("Parent") var child = require("Child") function initializeGlobal() { var childObj = new child.ChildClass("Me", 3); }
PARENT.JS
// In Parent.js - In Project 1, but shared into Project 2 using Add Existing Item... class ParentApp { constructor(x) { this.name = x; } } module.exports = {ParentClass: ParentApp}
CHILD.JS
// In Child.js - in Project 2 - also shared into Project 1 var parent = require("Parent") class ChildApp extends parent.ParentClass { constructor(y, z) { super(y); this.age = z; } } function test() { var myChild = new ChildApp('Bill', 25); Log.Message(myChild.age); } module.exports = { ChildClass: ChildApp }
So it's resolved now. Please try it and let me know if this works.
Sorry for getting back this late - the response is a tad too long if you see.
And yeah, I did not need the "import" keyword.
Thanks for the help. And thanks to Tanya for following-up.
Maybe I should accept my own answer as solution, I don't know.