How to mock local function in Karma? - javascript

I have to test a js file that looks like the following:
const varA = document.A;
// some action with foo and bar
return varA;
function foo() {
}
function bar() {
}
I can mock document.A property this way:
sandbox.stub(document, 'A').value('test value');
But is there any way to mock local foo and bar functions?

Related

Test if function of object has been called inside another function in jest

My code looks somewhat like this :
Class A :{
Object foo = new foo;
function (){
...
let var = this.foo.bar()
...
}
And I would like to test with jest that foo.bar() has been called. I've tried with
barSpy = jest.spyOn(function, 'foo.bar');
but it doesn't work, can someone guide me toward the good syntax ?
The parameters for jest.spyOn are the object that contains the function you want to spy on, and the name of the function to spy on (see: https://jestjs.io/docs/en/jest-object.html#jestspyonobject-methodname). It's a little hard to say with the given syntax above, but if foo is available as a property on an instance of A (for this example let's say your instance is called a), then a.foo is the object, and 'bar' is the name of the function.
Here's some code to better illustrate:
class A {
constructor() {
this.foo = new foo();
}
function myFunction() {
...
this.foo.bar();
....
}
}
...
let a = new A();
let barSpy = jest.spyOn(a.foo, 'bar');

How to spy on function from another module

I have two functions in one module:
export function foo() {
console.log('foo');
}
export function bar() {
foo()
}
Now I want to test bar(), set a spy on foo() and assert for it to be called. How can this be achieved?
EDIT/update: Sorry had bar and foo backwards.
The way the module is currently structured.
When the code is executed, the bar reference inside function bar is resolved against the local implementation. You can't modify that since it's outside of the module code. There's no access to the intervals.
Have you tried using code like this for the test file?
let obj = {};
obj.bar = function () {
this.foo();
}
obj.foo = function() {
...
}
export default obj;

how to override a javascript closure function call

I have the following scenario
var bar = (function () {
function foo() {
console.log("Hello World");
}
function bar() {
foo();
}
return bar;
} ());
// override foo before the call
bar();
Since foo is being called from the bar function which is returned from inside the a closure, it can be considered that foo is acting like a private property.
I want to know if it is possible to override the foo function before the bar is called? How many ways can it be achieved?
Here is something that is tried but I was unable to achieve the result.
var bar = (function () {
function foo() {
console.log("Hello World");
}
function bar() {
foo();
}
return bar;
} ());
var _bar = (function () {
function foo() {
console.log("Hey there");
}
return bar;
} ());
_bar();
I want to know If it is possible to override the foo function before the bar is called? How many ways can it be achived?
No, not and keep/reuse the current functionality of bar. You could completely replace bar, but that's not particularly useful.
foo is entirely private to the context in which it was created. bar has access to it, but nothing else does (well, okay, foo has access to itself). There's no way to reach into the execution context bar closes over and change its foo binding unless something explicitly enables that, which nothing in your example does.

JavaScript design patterns: Injecting a dependency that is not yet created

I have a CommonJS module:
// main-module
module.exports = function () {
var foo,
someModule = require('other-module')(foo);
// A value is given to foo after other-module has been initialised
foo = "bar";
}
As you can see, this requires other-module:
// other-module.js
module.exports = function (foo) {
function example() {
console.log(foo);
// > "bar"
}
}
I would like the example function inside of other-module to be aware of the foo variable inside of main-module, even though is it established after the module is required.
When other-module runs, foo will not be undefined. However, the point is that by time my example function runs, foo will have been given a value of bar.
The pattern above obviously does not work. What design pattern do I need to implement?
I'm not super-familiar with CommonJS, so this might not be the idiomatic way to do it, but using a function instead of a variable should work:
// main-module
module.exports = function () {
var foo,
someModule = require('other-module')(function() { return foo; });
foo = "bar";
}
// other-module.js
module.exports = function (fooFn) {
function example() {
console.log(fooFn());
}
}
The foo value (a string) will be passed by value, so it's undefined inside other-module. You could use an options object that is passed by reference:
var options = {},
someModule = require('other-module')(options);
options.foo = "bar";

How to get 'this' value of caller function?

If I have a function like this:
function foo(_this) {
console.log(_this);
}
function bar() {}
bar.prototype.func = function() {
foo(this);
}
var test = new bar();
test.func();
then the test instance of bar gets logged.
However, for this to work I have to pass the this in the bar.prototype.func function. I was wondering whether it is possible to obtain the same this value without passing this.
I tried using arguments.callee.caller, but this returns the prototype function itself and not the this value inside the prototype function.
Is it possible to log the test instance of bar by only calling foo() in the prototype function?
If the question is 'without passing this (by any means)' then answer is no
value can be passed by alternative methods though. For example using global var (within Bar class) or session or cookies.
function bar() {
var myThis;
function foo() {
console.log(myThis);
}
bar.prototype.func = function() {
myThis = this;
foo();
}
}
var test = new bar();
test.func();
I think calling foo within the context of bar should work:
function foo() {
console.log(this.testVal);
}
function bar() { this.testVal = 'From bar with love'; }
bar.prototype.func = function() {
foo.call(this);
}
var test = new bar();
test.func(); //=> 'From bar with love'
You can do this without changing the external function, but you must change the way you call it.
You can't get the context of the caller, but you can set the this property on a function you call with the method apply or call. See this reference for an explanation on this.
function foo()
{
console.log( this );
}
function bar()
{
bar.prototype.func = function func()
{
foo.apply( this );
};
}
var test = new bar();
test.func();
Usually if this is used, it's in an object oriented context. Trying to call a method of an object with another this might indicate poor design. Explain a bit more what you are trying to achieve for more applicable design patterns.
For an example of a javascript OOP paradigm, check my answer here.
What about this?
"use strict";
var o = {
foo : function() {
console.log(this);
}
}
function bar() {}
bar.prototype = o;
bar.prototype.constructor = bar;
bar.prototype.func = function() {
this.foo();
}
var test = new bar();
test.func();
Or this:
"use strict";
Function.prototype.extender = function( o ){
if(typeof o == 'object'){
this.prototype = o;
}else if ( typeof o == 'function' ) {
this.prototype = Object.create(o.prototype);
}else{
throw Error('Error while extending '+this.name);
}
this.prototype.constructor = this;
}
var o = {
foo : function() {
console.log(this);
}
}
function bar() {}
bar.extender(o);
bar.prototype.func = function() {
this.foo();
}
var test = new bar();
test.func();

Categories