Join 34,000+ subscribers and receive articles from our
blog about software quality, testing, QA and security.

[UI Script] Mark test as passed and forward to the next


#1

In our team, we usually don’t add any information to test results when the test is successful. Previously, on an individual test page we had to click “Add Test Result”, then submit it, and then click one more button to navigate to the next test in the run. To make this a one-click experience I wrote the following script:

name: Mark test as passed and go to next
description: Adds a button to a test page that allows to mark it as passed and proceed to the next test in one click
author: Paul Danyliuk
version: 1.0
includes: ^tests/view
excludes:

js:
var passAndForward = function(onSuccess, onFailure) {
    // Get testId from UI Scripts context (see the doc)
    var testId = uiscripts.context.test.id;

    // Mock the data as collected from the form and passed to App.Tests.addChange as "c" parameter
    var postData = {
        test_id     : testId,
        status_id   : '1',
        is_result   : true,
        comment     : '',
        defect      : '',
        assignedto  : '',
        attachments : '',
        version     : '',
        elapsed     : ''
    };

    // Hook to the "tests.changed" event that fires after request is completed along with visual feedback
    $.subscribe('tests.changed', 'qaextensions', function(data) {
        App.Tests.loadNext(testId);
    });

    // Invoke the "add test result" method from TestRail's client-side JavaScript
    App.Tests.addChange(postData, {
        success : onSuccess,
        error   : onFailure
    });
};

$(document).ready(function() {
    // Create the button
    var passAndForwardButton = $('<a id="passAndForwardButton"><img src="images/icons/accept.png"/> <span>Mark as passed and go to next</span></a>');

    // Define behavior (make button disabled after click etc)
    var onClick = function(button) {
        var $btn = $(button);
        if (!$btn.hasClass('disabled')) {
            $btn.addClass('disabled');
            var cachedSrc = $btn.find('img').attr('src');
            $btn.find('img').attr('src', 'images/animations/progressStandard.gif');
            passAndForward(
                function() {
                    // On success, make the button react (don't re-enable it)
                    $btn.find('img').attr('src', cachedSrc);
                    $btn.find('span').text("Done!");
                    $btn.attr('title', "If redirect doesn't happen, check if this is the last test in this suite");
                },
                function(err) {
                    // On failure - show alert, then re-enable the button
                    alert(err.error);
                    $btn.removeClass('disabled');
                    $btn.find('img').attr('src', cachedSrc);
                }
            );
        }
    };

    // Add event listener to the button
    passAndForwardButton.on('click', function() {
        onClick(this)
    });

    // Add it to the left of Add Test Result button in the bottom
    $('a#addResult').before(passAndForwardButton);
});

Note: This script uses TestRail’s client-side code, which can be altered any time unlike REST API, so if/when it’s changed, the user script will probably break. But going this way was preferable because it didn’t require coding REST handling, and gave the usual animated feedback out of the box.

With best regards,
Paul


TestRail 5.1 released
#2

Hello Paul,

This looks great, thanks for sharing this! Like you already mentioned, this will probably break with a larger TestRail update but it should be straightforward to modify this then.

Regards,
Tobias


#3

UPD: The script has been updated to work with TestRail 4.0 (in fact, just markup change)

name: Mark test as passed and go to next
description: Adds a button to a test page that allows to mark it as passed and proceed to the next test in one click
author: Paul Danyliuk
version: 1.1
includes: ^tests/view
excludes: 

js:
var passAndForward = function (onSuccess, onFailure) {
    var testId = uiscripts.context.test.id;
    // Data as collected from results form and passed to App.Tests.addChange as "c" parameter
    var postData = {
        test_id: testId,
        status_id: '1',
        is_result: true,
        comment: '',
        defect: '',
        assignedto: '',
        attachments: '',
        version: '',
        elapsed: ''
    };

    // Add listener to "tests.changed" event (will fire on success)
    $.subscribe('tests.changed', 'qaextensions', function (data) {
        App.Tests.loadNext(testId);
    });

    // Invoke native method to add test result
    App.Tests.addChange(postData, {
        success: onSuccess,
        error: onFailure
    });
};

// Create the button, add listeners and append to HTML
$(document).ready(function () {
    var passAndForwardButton = $('<a id="passAndForwardButton" href="javascript:void(0)" class="button button-left button-ok">Mark as passed and go to next</a>');

    var onClick = function (button) {
        var $btn = $(button);
        if (!$btn.hasClass('disabled')) {
            $btn.addClass('disabled');
            $btn.removeClass('button-ok');
            $btn.addClass('button-busy');
            var cachedCaption = $btn.text();
            passAndForward(
                function () {
                    // Success
                    $btn.addClass('button-ok');
                    $btn.removeClass('button-busy');
                    $btn.text("Done!");
                    $btn.attr('title', "If redirect doesn't happen, check if this is the last test in this suite");
                },
                function (err) {
                    // Failure
                    alert(err.error);
                    $btn.removeClass('disabled');
                    $btn.addClass('button-ok');
                    $btn.removeClass('button-busy');
                }
            );
        }
    };

    passAndForwardButton.on('click', function () {
        onClick(this)
    });

    // Add it to the left of Add Result button in the bottom
    $('a#addResult').before(passAndForwardButton);
});

#4

Thanks, Paul!

Regards,
Tobias


#5

It would be great if you can post some code on, How can we add " Pass and Forward to the next" button on “Add Test Result” page .

Thanks,
sujatha.


#6

@sujatha, you mean, adding the button to the “add test result” dialog itself? Why?
For this script it wasn’t required to fill any fields, just mark test passed and go to next, therefore opening a dialog and placing a button there would be redundant.

If you just want to automatically go to the next test when saving the result from the dialog, you can try throwing out everything from the JS section except this part:

var testId = uiscripts.context.test.id;
$.subscribe('tests.changed', 'qaextensions', function (data) {
    App.Tests.loadNext(testId);
});

#7

Hello Actine,

My requirement is to add the elapsed time for each test case while executing it. So i use the Start Progress button > In the Add Rest Result page add the result and then use the arrow mark to go to next test case

So i was thinking if we place a “Mark as passed and go to next” button in the Add Rest Results page it will save me a click to go to the next testcase.

As you mentioned “i just want to automatically go to the next test when saving the result from the dialog”. I tried your code but getting following error when i tried to add as a UI script.

“Line 1 uses an invalid format (“name: value” expected).”

Please let me know if i need to make any corrections in your code.

Thanks for your help.
Sujatha.


#8

@sujatha, I got what you mean. Unfortunately I don’t have time these days, then I’ll look into that. Regarding your error - you need to keep the header with UI script name, author etc, and remove everything except aforementioned lines under “js:” line.


#9

@Actine, Thanks for your info, I tired modifying the script as you mentioned.
But It is not working as expected. When i click “Add Test Results” in the Add Test Result page its not going to the next test case.

Please help me with this when ever you have some time.

Thanks,
Sujatha.


#10

@sujatha
Sorry for taking that long to respond. I advised you to “try throwing out everything from the JS section except this part” but forgot to mention that you should leave it wrapped inside “$(document).ready(…)” :slight_smile:

Here’s your code:

name: Automatically go to next when test result is added
description: For sujatha
author: Paul Danyliuk
version: 0.1
includes: ^tests/view
excludes: 

js:
$(document).ready(function () {
    var testId = uiscripts.context.test.id;
    $.subscribe('tests.changed', 'qaextensions', function (data) {
        App.Tests.loadNext(testId);
    });
});

#11

@Actine , Thanks a lot it is now working as expected.

Thanks,
Sujatha.


#12

Hello Actine,

The above script stopped working after my upgrade to 5.0 can you please check and let me know if there are any changes in the code ( Also planning for upgrade to 5.1 this week)


#13

Hello @sujatha (and everyone else who needs this functionality):

You no longer need this script in 5.1 — this feature is now in TestRail out of the box.


#14

Hello Sujatha,

This was added with TR 5.1:

Cheers,
Tobias