Skip to main content

Code share - Test Run Summary Table with collapsible point of failure details

Video is here.

Code is here:

File: myscript1.js

function repeatTest($scope) {
  $scope.tests = [
    {testName: "Test1", overallResult: "Pass", firstError: "-", lastError: "-"},
    {testName: "Test2", overallResult: "Fail", firstError: "Page not found", lastError: "Page not found"},
    {testName: "Test3", overallResult: "Fail", firstError: "Could not select value in combobox - EmpAgeRange", lastError: "Could not find editbox - EmpAddressLine2"}
  ];
}


File: index.html

<!DOCTYPE html>
<html>

  <head>
    <script src="http://code.angularjs.org/1.2.0-rc.2/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="myscript1.js"></script>

   </head>

  <body ng-app="">
    <h1>Test Run Summary</h1>
    <div ng-controller="repeatTest">
      <table>
        <thead style="background-color: lightgray;">
          <tr>
            <td style="width: 30px;"></td>
            <td>Test Name</td>
            <td>Overall Result</td>
          <td>Point of Failure</td>
          </tr>  
        </thead>
        
        
        
        <tbody>
          <tr ng-repeat-start="test in tests">
            <td>
              <button ng-if="test.expanded" ng-click="test.expanded = false">-</button>
              <button ng-if="!test.expanded" ng-click="test.expanded = true">+</button>
            </td>
            <td>{{test.testName}}</td>
            <td>{{test.overallResult}}</td>
          </tr>
          <tr ng-if="test.expanded">
          <td />
          <td />
          <td />
            <td colspan="1">First Error: <br>{{test.firstError}}</td>
          </tr>
          <tr ng-if="test.expanded" ng-repeat-end="">
          <td />
          <td />
          <td />
            <td colspan="1">Last Error: <br>{{test.lastError}}</td>
          </tr>
        </tbody>
      </table>
    </div>
  </body> 
</html> 
Labels:

Comments

Post a Comment

Popular posts from this blog

Experimenting with Visio and VBScript

This diagram is created:               using this code:                                                                         Copy the code: Option Explicit Dim strVSDPath, filesys Dim vsoApplication, vsoDocument, vsoPages, vsoPage Dim vsoMaster1, vsoMaster2, vsoStencil Dim vsoShape1, vsoShape2, vsoConnector1 Dim itr Const visAutoConnectDirDown = 2     'Connect down. Const visAutoConnectDirLeft = 3     'Connect to the left. Const visAutoConnectDirNone = 0     'Connect without relocating the shapes. Const visAutoConnectDirRight = 4     'Connect to the right. Const visAutoConnectDirUp = 1         'Connect up....
Post a Comment
Read more

QTP – search sub-folders for existence of QTP scripts

  Suppose we want to report on all subfolders in a specific root folder that contain script files. Consider the example folder structure here – ODBC_MYSQL, ODBC_SQLEXPRESS and Test1 are the folders that have QTP scripts: Here’s a VBScript program that takes the root (start) folder as input, and iterates all subfolders recursively to report on the ones that are actual QTP script folders: Note: This program can be run directly as a VBScript program, or from within a QTP script by toggling the comment between lines 17 and 18. (p.s.: if Print statement does not work on specific version of QTP, use the Msgbox statement. For real world test automation projects, do not use either – to avoid human intervention!) On running the program, Folders across various levels (Level 2, 3) get reported!
2 comments
Read more

Study of an AngularJS application: Feeding Excel based data into an SVG Flowchart with AngularJS and NodeJS

Reference article Implementing a Flowchart with SVG and AngularJS Source code from original article is here .   Customization goals a) Feed the SVG flowchart nodes from excel datasheet b) Understand a bit of the AngularJS and NodeJS client-server communication c) Learn javascript debugging on server side as well as client side using VS Code editor As a beginner to AngularJS-NodeJS, the customization is based on a partial study of the original article .   Most challenging challenge as a dummy There was a space of time when I thought I was publishing the server side JSON data to the same URL as the front-end html page. And then trying to debug it and not knowing why: in one case the data was coming from the server side only, while in the other case it was coming from mocked data on client side. Kept on looking for whether data was getting lost, or did I need routing. There were debug sessions where both server side and client side individually appear...
1 comment
Read more