Using QUnit for testing on dynamic view, determine whether an element has been rendered in the DOM

37 Views Asked by At

In my application, which uses jQuery, I'm working on unit testing. For my application I am creating unit test cases using QUnit , which I am still learning. I am returning a dynamic view from my controller method via an AJAX call. The challenge is that the Test case assertion function cannot locate the Element in the DOM. Here is the code I have so far attempted.

QUnit.module('Lookup', function () {
    // GLOBAL VARS TO BE USED FOR TESTING
    var userId = "johnDoe";
    const userType = { type: "user" };
    $.ajax({
        url: '/search?id=' + userId + '',
        type: 'GET',
        success: function (res) {
            console.log("User Profile Found" + res);
        },
        error: function (err) {
            console.log("Error Fetching Record..." + err);
        }
    });

    // CALLING THE Search CONTROLLER METHOD TO GET User PROFILES
    QUnit.test("Search for User Profile UI with user details", function (assert) {
        var done = assert.async();
        Promise.resolve().then(function (res) {
            assert.equal($("#user-search").is(":visible"), true, "User Search Result Shown");
        });
        done();
    })

I have tried async methods and tried placing the script above the DOM but it still is not able to give a success result.

0

There are 0 best solutions below