Develop Reference

Test static methods with Mocha

We have a javascript class with some static methods.
export default class TestUtils {
static test1() {
return 42;
}
}
I'm trying to write tests with mocha, but I stucked. My test looks like here:
const TestUtils = require("path to TestUtils");
describe("TestUtils", function () {
it("test1 returns 42", function () {
expect(TestUtils.test1()).is.equal(42);
});
});
But by running this I get an error:
TypeError: TestUtils.test1 is not a function
Do you have an idea what am I doing wrong?

Maybe it's kind obvious, but I hope it will help someone else.
The solution was to use following import
const {
default: TestUtils,
} = require("path to TestUtils");

Javascript const object syntax - what is this doing? (using in a Vue script)

What is the following statement doing, and why use const vs var?
const { SearchIcon } = myApp.icons;
For context, I am learning Vue and new to Javascript. I saw this in an example. The SearchIcon is an icon that is being imported from heroicons, MyApp.icons is being defined in a different script file like this:
window.MyApp = {
app: null,
icons: {},
...

Looks like your issue is that you're storing MyApp under window, but then trying to access it directly. You've also got a capital M in the definition, and a lowercase when your accessing it.
Here's a working example:
window.MyApp = {
app: null,
icons: {
SearchIcon : 'Hello!'
},
};
const { SearchIcon } = window.MyApp.icons;
console.log(SearchIcon);
For more info, see the docs on object destructuring.
Hope that helps :)

Jasmine Data Provider is not working (jasmine_data_provider_1.using is not a function)

I am trying to achieve Data Driven testing in my project by using jasmine data providers.
I have a data.ts file like below
export const hardshipTestData = {
scenarios: {
scenario1: {
isHome: 'Yes'
},
scenario2: {
isHome: 'No'
}
}
};
I am using above data in spec file
import { using } from 'jasmine-data-provider';
import { hardshipTestData } from '../../data/testdata';
using(hardshipTestData.scenarios, function (data, description) {
it('testing data providers', () => {
console.log(data.isHome);
});
});
My issue here is when I am trying to write data. intelligence is not even giving the option isHome. When I enforce it and run the test I am getting the following error
TestSuite encountered a declaration exception
configuration-parser.js:48
- TypeError: jasmine_data_provider_1.using is not a function
any help is appreciated

You need to change import type. Try to replace:
import { using } from 'jasmine-data-provider';
with:
const using = require('jasmine-data-provider');
Also, keep in mind that firstly should be describe block:
describe('example test', () => {
using(hardshipTestData.scenarios, (data) => {
it('should calc with operator -', () => {
console.log(data.isHome);
});
});
});

Adding to Oleksii answer, his answer is for typescript.
but If you want to use in plain javascript use below:
Add below in your code:
var using = require('jasmine-data-provider');
Example:
var jasminedatasetobj = require("./jasmineDataDrivenData");
var using = require('jasmine-data-provider');
using(jasminedatasetobj.datadrive, function (data, description) {
it('Open NonAngular js website Alerts', async() => {
await browser.get("https://qaclickacademy.github.io/protocommerce/");
element(by.name("name")).sendKeys(data.name);
});
});

You might need to give full path of Jasmine data provider for plain javascripts to avoid module not found error.
var jsondataobj = require('../../../../config/Jsoninput.json');//define the data source location
var using = require('C:/Users/sam/AppData/Roaming/npm/node_modules/jasmine-data-provider');
describe("Test Jasmine Data provider",function(){

you need to declare the variable for "jasmine-data-provider" , because import can use to import the properties/classes.
instead of using variable you can give any name to the varible (I tried use "post" instead of "using" and it is still working as expected)
your code should be like
import { hardshipTestData } from "../Test";
const using = require("jasmine-data-provider");
describe("Login TestCases", () => {
using(hardshipTestData.scenarios, (alldata: any, alldesc: any) => {
it("login with different credentials", async () => {
console.log(data.isHome);
})
})
})
this will resolve you problem.

error in unit test vue.js karma (webpack): undefined is not a constructor

I'm using the webpack template generated by Vue's CLI and have been trying to add some unit tests. And example has already been provided and it works perfectly:
import Vue from 'vue'
import Hello from '#/components/Hello'
describe('Hello.vue', () => {
it('should render correct contents', () => {
const Constructor = Vue.extend(Hello)
const vm = new Constructor().$mount()
expect(vm.$el.querySelector('.hello h1').textContent)
.to.equal('Welcome to Your Vue.js App')
})
})
Then I try to add another test which I copied straight from Vue's documentation (Documentation link) but something weird happened:
// Inspect the raw component options
it('has a created hook', () => {
console.log(typeof Hello.created)
expect(typeof Hello.created).toBe('function')
})
I got the following error:
LOG LOG: 'function'
✗ has a created hook
undefined is not a constructor (evaluating 'expect((0, _typeof3.default)(_Hello2.default.created)).toBe('function')')
webpack:///test/unit/specs/Hello.spec.js:16:38 <- index.js:75919:64
So it seems like Hello.created gives me an undefined, but as you can see, I also console.log it to double check, and it does give it the desired result: undefined
Can anyone give me some help on what happened and how to fix it? I've already tried the solution here and still couldn't make it work.
For your reference, here's how Hello.vue looks like:
<template>
<div class="hello">
<h1>{{ msg }}</h1>
</div>
</template>
<script>
export default {
name: 'hello',
data () {
return {
msg: 'Welcome to Your Vue.js App',
message: 'hello!'
}
},
created () {
console.log('oh crap')
this.message = 'bye!'
}
}
</script>

Turns out the template is actually using chai instead of jasmine to do unit test.
In this case,
expect(typeof Hello.created).to.equal('function')
or
expect(Hello.created).to.be.a('function')
both work.

For me to.be or toBe did not work. Instead I used .equal in the following way (to get the return of a component method) :
import Vue from 'vue'
import SingleTask from '#/components/SingleTask'
describe('SingleTask.vue', () => {
it('should return true', () => {
const Constructor = Vue.extend(SingleTask)
const vm = new Constructor().$mount()
expect(vm.forUnitTest()).equal(true);
})
})
That's what worked for me

How does 'require' operates differently from 'import' es6?

I am encountering a behaviour that I can't explain.
Depending on using import or require, this test successes (import) or fails (require).
In case of fail, I have the following error:
PhantomJS 2.1.1 (Windows 7 0.0.0) immutability a number is immutable FAILED undefined is not a constructor (evaluating 'expect((0, _immutable.List)([1])).toEqualImmutable((0, _immutable.List)([1]))')
Here is the code :
import { Map, List } from 'immutable';
const expect = require("expect");
// import expectImmutable from "expect-immutable";
const expectImmutable = require("expect-immutable");
expect.extend(expectImmutable);
describe("immutability", () => {
describe("a number", () => {
function increment(currentState) {
return currentState + 1;
}
it("is immutable", () => {
expect(List([1])).toEqualImmutable(List([1]));
expect(Map({ a: 1 })).toEqualImmutable(Map({ a: 1 }));
let state = 42;
let nextState = increment(state);
expect(List([nextState])).toEqualImmutable(List([43]));
expect(List([state])).toEqualImmutable(List([42]));
});
});
});
Does anyone have an explanation of what is happening behind the scene?

Thanks #zerkms and #maioman your advices have really helped.
You were right #maioman, It was due to the export syntax used by the library.
es6 :
export default foo;
require :
module.exports = foo;
So when needed to require an es6 written export, we should handle the default keyword.
require("foo").default;