Functional intern tests for Dojo5

Dojo 2+ users
1

I am used to write FUNCTIONAL Intern tests for “regular” webpages and only basic knowledge of tests of dojo1 applications. Now I’m supposed to write tests for a dojo5 app and I am at my limit of understanding how to get those up and running.

I created the demo application for Dojo5 and did a few tweaks to the pages, so I do have a few more elements that can be identified by className.

So my Test “theoretically” works using bdd Interface. But it does not really work e.g. during switching pages. I need a poll function. But “usual” poll functions do not work, since the test can not reach the navigator. Because it’s using the virtual DOM?

I am aware, that I need to change my thinking for dojo5 since I am used to work with the DOM on the java pages I usually test. But I really don’t know how and I am unable to find ANY documentation on functional tests for dojo5. I found ONE documentation for a unit test but that’s not what I am looking for.

Here is what I am trying to do:

I changed Menu.ts from the generated first-dojo-app:

	return v('div', { }, [
		v('p', {class: css.title}, ['My Dojo App!']),

		w(
			Link,
			{...

to have a css.title up there.

I have a BasicHelper.ts in functional tests:

import pollUntil from “@theintern/leadfoot/helpers/pollUntil”;
import { Remote } from “intern/lib/executors/Node”;

export function checkForSelector(selector: string, pollForDisappear: Boolean = false): boolean | null{
let selectorNodeList;
let selectorList;
try {
selectorNodeList = document.querySelectorAll(selector);
selectorList = [].slice.call(selectorNodeList);
} catch (e) {
return null;
}
return ((selectorList.length === 0 && !pollForDisappear) || (selectorList.length !== 0 && pollForDisappear)) ? null : true;
}

class BasicHelper {

public static async pollUntilCss(remote: Remote, cssSelector: string, pollForDisappear: Boolean = false): Promise<void> {
    await remote.end(Infinity).then(pollUntil(checkForSelector, [cssSelector, pollForDisappear]));
}

}
export default BasicHelper;

My Testcase in main.ts:

import Test from “intern/lib/Test”;
import Element from “@theintern/leadfoot/Element”;
import * as toolbarCss from “…/…/…/src/widgets/styles/Menu.m.css”;
import BasicHelper from “…/utils/tasks/BasicHelper”;

const { describe, it } = intern.getInterface(“bdd”);
const { assert } = intern.getPlugin(“chai”);

describe(“Evaluate Page Home”, () => {

it("Evaluate Title", async ({ remote }: Test) => {
    await remote.get("http://localhost:9999");
    await BasicHelper.pollUntilCss(remote, `.${toolbarCss.title}`);
    let title: Element = await remote.end(Infinity).findByClassName(toolbarCss.title);
    let titleTxt: string = await title.getVisibleText();
    assert.equal(titleTxt, "My Dojo App!");
});

})

2

Have you checked out the functional test examples at https://github.com/dojo/examples/blob/master/todo-mvc/tests/functional/main.ts ?