Develop Reference

Javascript Protractor - Seeing outside functions as undefined

In specs/Test.js is a test definition: "regex2"
In pages/TablePage.js is a page object
in regex2 there is a try to use a function from TablePage.js
it('regex2', function(){
table_page.matchPriceRegex(table_page.workingBalanceField)
});
it is saying table_page.matchPriceRegex is not a function
The function itself from TablePage.js:
var TablePage = (function () {
function TablePage() {
this.workingBalanceField = element(By.xpath('//*[#id="root"]/main/section/div/div/div[5]/div/div[1]'));
}
TablePage.prototype.matchPriceRegex = function (locator) {
this.text = locator.getText();
expect(this.text).toMatch("\d{0,3}?,?\d{0,3}?\.?\d{0,3}?");
};
});
module.exports = TablePage;
The require's are incorporated with the spec file so it should see it
var TablePage = require("./../pages/TablePage");
var table_page = new TablePage();
var protractor = require("protractor");
var jasmine = require("jasmine-node");
var browser = protractor.browser;
var number = 0;
When in my IDE(WebStorm) I hold ctrl and click on the function name it redirects me correctly, as it sees it
The typeof the functions or variables form TablePage is undefined
Do you know where is the problem?

The error comes from TablePage.js, it should be.
var TablePage = (function () {
function TablePage() {
this.workingBalanceField = element(By.xpath('//*[#id="root"]/main/section/div/div/div[5]/div/div[1]'));
}
TablePage.prototype.matchPriceRegex = function (locator) {
this.text = locator.getText();
expect(this.text).toMatch("\d{0,3}?,?\d{0,3}?\.?\d{0,3}?");
};
return TablePage; // return the class as outer function return value
})();
// `(function(...){})` return a function, you should use `()` to execute the
// return function to get the returned class: TablePage.
module.exports = TablePage;

JavaScript "Class" Structure to avoid using x = new widget();

I would like use the following syntax where the parameter is an ID of HTML element, very similar as to how you setup JWPlayer but I can't figure out how they did it. This is so I can make it as simple as possible for someone else to use.
myWidget("htmlTargetId");
I'm trying to avoid having to do:
myWidget = new MyWidget("htmlTargetId");
I know that I can create the first by doing:
var myWidget = function(target) {
// Do something here
}
myWidget("htmlTargetId");
I need to add methods and properties etc but I would like a "constructor" that will create elements in the "htmlTargetId". What would be the best way to do this?
I tried a few variations, this is the latest attempt:
var myWidget = (function () {
var _target = undefined;
// constructor
var widget = function (target) {
_target = target;
version = 12;
};
widget.prototype = {
constructor: widget,
doSomething: function () {
console.log("I will so something to", target);
}
};
return widget;
})();
// Try out the new code
myWidget("htmlTargetId");
console.log(myWidget.version);
myWidget.doSomething();
But this gives me "undefined" and "Uncaught TypeError: undefined is not a function" I assume this is because the return statement is returning a function rather than an object because I'm not using "new"?
// Trying to avoid having to do this
superWidget = new myWidget("htmlTargetId");
Many thanks!

If you want to have multiple Widget instances,
var myWidget = (function () {
// constructor
var Widget = function (target) {
this._target = target;
};
Widget.prototype = {
constructor: Widget,
version: 12,
doSomething: function () {
console.log("...", this._target);
}
};
return function init(target) {
return new Widget(target);
};
})();
var widget1 = myWidget("foo"),
widget2 = myWidget("bar");
console.log(widget1.version); // 12
widget1.doSomething(); // "..." "foo"
widget2.doSomething(); // "..." "bar"
However, if you only need one "instance", you don't need any constructor:
var myWidget = function (target) {
myWidget._target = target;
};
myWidget.version = 12;
myWidget.doSomething = function () {
console.log("...", myWidget._target);
}
myWidget("foo");
console.log(myWidget.version); // 12
myWidget.doSomething(); // "..." "foo"

Memory leak example

Explain please step by step a reason of memory leak in the following part of code:
var theThing = null;
var replaceThing = function () {
var priorThing = theThing; // hold on to the prior thing
var unused = function () {
// 'unused' is the only place where 'priorThing' is referenced,
// but 'unused' never gets invoked
if (priorThing) {
console.log("hi");
}
};
theThing = {
longStr: new Array(1000000).join('*'), // create a 1MB object
someMethod: function () {
console.log(12);
}
};
};
setInterval(replaceThing, 10);

How to pass a singleton to another Object such that all instance of that object refer to same singleton

Please refer the following fiddle : http://jsfiddle.net/hBvSZ/5/
var NewObject = function () {
//Singleton should be accessible here
this.method1 = function() { }
};
Also can we pass singleton in such a way that the methods of singleton are just accessible to the NewObject ?

Store the singleton in a variable:
var singleton;
function NewObject () {
if (typeof singleton == 'undefined') {
// initialize new object here.
}
}
That's the basic idea.
To avoid global namespace pollution you can use a closure:
var NewObject = (function(){
var singleton;
return function () {
if (typeof singleton == 'undefined') {
// initialize new object here.
}
}
})();

Even though I doubt you actually need the Singleton pattern in JavaScript, here's how I'd do it:
var Client = (function() {
var instance;
var Client = function() {
};
Client.prototype.hello = function() {
console.log("hello");
};
return {
getInstance: function() {
if (!instance) {
instance = new Client();
}
return instance;
},
otherHelper: function() {
console.log("look i'm helping!");
},
};
})();
var a = Client.getInstance();
var b = Client.getInstance();
a.hello(); // "hello"
b.hello(); // "hello"
console.log("a === b", a === b); // true
Client.otherHelper(); // look i'm helping!
If you're using this server-side (node.js for example), you could do this
// client.js
var instance;
var getInstance = function getInstance() {
if (!instance) {
instance = new Client();
}
return instance;
};
var Client = function Client() {
};
Client.prototype.hello = function() {
console.log("hello");
};
exports.getInstance = getInstance;
Then usage is simple
// app.js
var Client = require("./client");
var myClient = Client.getInstance();

In javascript, how do I call a class method from another method in the same class?

I have this:
var Test = new function() {
this.init = new function() {
alert("hello");
}
this.run = new function() {
// call init here
}
}
I want to call init within run. How do I do this?

Use this.init(), but that is not the only problem. Don't call new on your internal functions.
var Test = new function() {
this.init = function() {
alert("hello");
};
this.run = function() {
// call init here
this.init();
};
}
Test.init();
Test.run();
// etc etc

Instead, try writing it this way:
function test() {
var self = this;
this.run = function() {
console.log(self.message);
console.log("Don't worry about init()... just do stuff");
};
// Initialize the object here
(function(){
self.message = "Yay, initialized!"
}());
}
var t = new test();
// Already initialized object, ready for your use.
t.run()

Try this,
var Test = function() {
this.init = function() {
alert("hello");
}
this.run = function() {
// call init here
this.init();
}
}
//creating a new instance of Test
var jj= new Test();
jj.run(); //will give an alert in your screen
Thanks.

var Test = function() {
this.init = function() {
alert("hello");
}
this.run = function() {
this.init();
}
}
Unless I'm missing something here, you can drop the "new" from your code.