Search jQuery

jQuery Forum

QUnit test function select

in QUnit and Testing • 7 years ago

Hi everyone! Im going to try once again :)
Im working with Qunit for testing javascript functions in a web site. I did a couple of test but im not sure if im doing it right or wrong, I dont get errors but im suspecting that Im not really testing the function it self but just simulating functionalities in the test....
Can someone tell me if im right or wrong? Im so very new in QUnit that I dont know whwere should I start...

But if somene has the time to explain very shortly if Im on the right way would be so great and helpful!
Thank you very much to everyone!!!

here is my function:

        tsrSelect: function () {
            return $(this).each(function() {
                var $this = $(this),
                span = $this.next("span.selectSpan").get(0),
                selectedText = $this.children().filter(":selected").text();
                if ($this.attr('readonly') || $this.find('option').length < 2) {
                    if (span) $(span).text(selectedText);
                    else $this.after($("<span>").text(selectedText).addClass("selectSpan"));
                    if ($this.hasClass("select2-hidden-accessible")) $this.select2('destroy');
                    $this.hide();
                } else {
                    if (!$this.hasClass("select2-hidden-accessible")) {
                        if (span) $(span).remove();
                        $this.select2({
                            minimumResultsForSearch: 15,
                            width: '100%'
                        });
                    }
                }
            });
        }

and my test:

test('tsrSelect', function () {
        var fixture = $('#qunit-fixture'),
            Element = $('<select class="select2-hidden-accessible" id="Element" readonly><option value="1">One</option><option value="2">Two</option></select>');
        ok($(Element).find('option'), "Expected tsrSelect has options");

        actual = $(Element).find('option').first().text(), expected = 'One';
        ok(actual == expected, 'Expected '+Element+' has a first text ' );

        actual = $(Element).find('option').first().val(), expected = "1";
        ok(actual == expected, "ok");

        actual = $(Element).find('option').last().val(), expected = "2";
        ok(actual == expected, "triple ok");

        ok($(Element).text('One'), "Expected selectbox has options");
        ok($(Element).children().filter(':selected'), 'Expected that the ' +Element+ ' Element has a default filter :selected');
        ok($(Element).hasClass('select2-hidden-accessible'), "okay");
    });

Replies(2)

kbwood.au

Re: QUnit test function select

7 years ago

You don't appear to be testing the tsrSelect function at all since there is no call to it in your test.

Add an expect call at the start of your test to indicate the number of assertions to be made. Then you'll know when any/all are missed.

test('tsrSelect', function() {
expect(7);
...
});

FernandoL..

Re: Re: QUnit test function select

7 years ago

Thanks for your replay!! After googeling a while I realized that I was doing it wrong, Im doing something like this now (same tsrSelect function):

Im learning to use fixture instead of create bodys all the time and Im calling the function .tsrSelect() to check that Im testing the function and not creating functions on the test itself. What do you think, is it going well? Thank you very much for the replay I think Im geting it better now but still confuse in a couple of things.

test('tsrSelect', function () {
      var fixture = $('#qunit-fixture'),
          Element = $('<select id="Element"><option value="1" selected>a</option><option value="2">b</option></select>'),
          $select = $('<select />');

        Element = $('#Element');
        fixture.append($select).tsrSelect();

        $select.setOptions(['a|1', 'b|2']);
        $('.select2.options').eq(0).click();
        ok($select.val()==='1', 'set value ok');

        $select.val('1').click('change');
        ok($(".selectSpan").length == 1, "there should be a span");

    });

Top Reply

Response title

Attachments

jQuery Forum

QUnit test function select

Replies(2)

Re: QUnit test function select

Re: Re: QUnit test function select

Statistics

Tags

Actions