CODEWITHSUNDEEP
javascriptjavaselenium-webdriverautomationcucumber-jvm
Moaad
Moaad

Reputation: 137

Cucumber generates blank html report

Cucumber Version : 1.2.5

The Feature:

@SSS

Feature: Login

  Scenario: Login And Logout

    * UI Login with user "moaada" and password "moaada12"
    * UI Logout

I'm running a feature file using junit:

@RunWith(Cucumber.class)
@CucumberOptions(
        format = {"pretty", "html:target/cucumber", "json:target/cucumber.json"},
        glue = {"com.webuiauto.bddtests"},
        features = {"src/test/resources/Features"},
        strict = true,
        tags = {"@SSS"})
public class RunViBddTests {
}

After opening the index.html file in the browser I see nothing; just a blank page. I have inspected on the browser and I got the following error in the console:

formatter.js:112 Uncaught TypeError: Cannot read property 'append' of undefined
    at CucumberHTML.DOMFormatter.write (formatter.js:112)
    at HTMLDocument.<anonymous> (report.js:15)
    at k (jquery-1.8.2.min.js:2)
    at Object.fireWith [as resolveWith] (jquery-1.8.2.min.js:2)
    at Function.ready (jquery-1.8.2.min.js:2)
    at HTMLDocument.D (jquery-1.8.2.min.js:2)

Upvotes: 2

Views: 3306

Answers (2)

Marit
Marit

Reputation: 3026

As answered by brasmusson (https://github.com/cucumber/cucumber-jvm/issues/1303)

"Calling write on the Scenario argument of a hook will add a formatter.write call in the report.js file. The javascripts functions of https://github.com/cucumber/cucumber-html will display the content of the formatter.write call below the preceding step. For before hooks of the first scenario executed, there does not exist any preceding step, since no (gherkin) step has been executed yet, therefore the report will be blank from this point on (for formatter.write calls from before hooks of subsequent scenarios, the content will be displayed below the last step of the preceding scenario, which is incorrect but the report will at least not be blank).

To fix this the https://github.com/cucumber/cucumber-html project need to be updated. However, since the plan is to replace that project, see cucumber/cucumber-html#44, I'm not sure anyone in the core team will take on that work.

The workaround is to not call write on the Scenario argument of before hooks, if the html-formatter is used."

Upvotes: 2

Moaad
Moaad

Reputation: 137

This is what i figured out :

Cucumber reports generates some js files, the issue was in the report.js

this is how it looked like : 

$(document).ready(function() {var formatter = new CucumberHTML.DOMFormatter($('.cucumber-report'));formatter.uri("test.feature");
    formatter.feature({
      "line": 3,
      "name": "Login",
      "description": "",
      "id": "login",
      "keyword": "Feature",
      "tags": [
        {
          "line": 1,
          "name": "@SSS"
        }
      ]
    });
    **formatter.write("11:43:49: WebDriver navigating to:\u0027https://1.1.1.1/\u0027");**
    formatter.before({
      "duration": 16696372480,
      "status": "passed"
    });
    formatter.before({
      "duration": 93668,
      "status": "passed"
    });
    formatter.scenario({
      "line": 5,
      "name": "Login And Logout",
      "description": "",
      "id": "login;login-and-logout",
      "type": "scenario",
      "keyword": "Scenario"
    });
    formatter.step({
      "line": 7,
      "name": "UI Login with user \"moaada\" and password \"moaada12\"",
      "keyword": "* "
    });
    formatter.step({
      "line": 8,
      "name": "UI Logout",
      "keyword": "* "
    });
    formatter.match({
      "arguments": [
        {
          "val": "moaada",
          "offset": 20
        },
        {
          "val": "moaada12",
          "offset": 42
        }
      ],
      "location": "BasicOperationsSteps.login(String,String)"
    });
    formatter.write("11:43:59: Finding web element By.id: gwt-debug-Dialog_Box");
    formatter.write("11:43:59: Web element found By.id: gwt-debug-Dialog_Box");
    formatter.write("11:43:59: Finding web element By.id: gwt-debug-Login_UserName");
    formatter.write("11:43:59: Web element found By.id: gwt-debug-Login_UserName");
    formatter.write("11:43:59: WebDriver changing value in element found By.id: gwt-debug-Login_UserName from \u0027\u0027 to \u0027\u0027");
    formatter.write("11:43:59: WebDriver changing value in element found By.id: gwt-debug-Login_UserName from \u0027\u0027 to \u0027moaada\u0027");
    formatter.write("11:43:59: Finding web element By.id: gwt-debug-Dialog_Box");
    formatter.write("11:43:59: Web element found By.id: gwt-debug-Dialog_Box");
    formatter.write("11:43:59: Finding web element By.id: gwt-debug-Login_Password");
    formatter.write("11:43:59: Web element found By.id: gwt-debug-Login_Password");
    formatter.write("11:43:59: WebDriver changing value in element found By.id: gwt-debug-Login_Password from \u0027\u0027 to \u0027\u0027");
    formatter.write("11:43:59: WebDriver changing value in element found By.id: gwt-debug-Login_Password from \u0027\u0027 to \u0027moaada12\u0027");
    formatter.write("11:43:59: Finding web element By.id: gwt-debug-userInfo");
    formatter.write("11:43:59: Web element found By.id: gwt-debug-userInfo");
    formatter.write("11:44:00: Finding web element By.id: gwt-debug-userInfo");
    formatter.write("11:44:00: Web element found By.id: gwt-debug-userInfo");
    formatter.write("11:44:00: Finding web element By.id: gwt-debug-DeviceControlBar_Help");
    formatter.write("11:44:00: Web element found By.id: gwt-debug-DeviceControlBar_Help");
    formatter.embedding("image/png", "embedded0.png");
    formatter.write("11:44:01: 11:44:00 Screenshot. Locator: By.id: gwt-debug-userInfo");
    formatter.result({
      "duration": 3237037562,
      "status": "passed"
    });
    formatter.match({
      "location": "BasicOperationsSteps.logout()"
    });
    formatter.write("11:44:02: Finding web element By.id: gwt-debug-userInfo");
    formatter.write("11:44:02: Web element found By.id: gwt-debug-userInfo");
    formatter.write("11:44:02: Clicking on td");
    formatter.write("11:44:02: Finding web element By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
    formatter.write("11:44:02: Web element found By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
    formatter.write("11:44:02: Finding web element By.id: gwt-debug-Global_Logout-0-0");
    formatter.write("11:44:02: Web element found By.id: gwt-debug-Global_Logout-0-0");
    formatter.write("11:44:02: Clicking on td");
    formatter.write("11:44:02: Finding web element By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
    formatter.write("11:44:02: Web element found By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
    formatter.embedding("image/png", "embedded1.png");
    formatter.write("11:44:03: 11:44:02 Screenshot. Locator: By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
    formatter.write("11:44:03: Finding web element By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
    formatter.write("11:44:12: Web element found By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
    formatter.embedding("image/png", "embedded2.png");
    formatter.write("11:44:12: 11:44:12 Screenshot. Locator: By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
    formatter.result({
      "duration": 13063106597,
      "status": "passed"
    });
    formatter.after({
      "duration": 173543,
      "status": "passed"
    });
    formatter.after({
      "duration": 45551,
      "status": "passed"
    });
    });

I took this line : formatter.write("11:43:49: WebDriver navigating to:\u0027https://1.1.1.1/\u0027");

and put it right before second formatter.write

So the file would be like this :

$(document).ready(function() {var formatter = new CucumberHTML.DOMFormatter($('.cucumber-report'));formatter.uri("test.feature");
formatter.feature({
  "line": 3,
  "name": "Login",
  "description": "",
  "id": "login",
  "keyword": "Feature",
  "tags": [
    {
      "line": 1,
      "name": "@SSS"
    }
  ]
});

formatter.before({
  "duration": 16696372480,
  "status": "passed"
});
formatter.before({
  "duration": 93668,
  "status": "passed"
});
formatter.scenario({
  "line": 5,
  "name": "Login And Logout",
  "description": "",
  "id": "login;login-and-logout",
  "type": "scenario",
  "keyword": "Scenario"
});
formatter.step({
  "line": 7,
  "name": "UI Login with user \"moaada\" and password \"moaada12\"",
  "keyword": "* "
});
formatter.step({
  "line": 8,
  "name": "UI Logout",
  "keyword": "* "
});
formatter.match({
  "arguments": [
    {
      "val": "moaada",
      "offset": 20
    },
    {
      "val": "moaada12",
      "offset": 42
    }
  ],
  "location": "BasicOperationsSteps.login(String,String)"
});
**formatter.write("11:43:49: WebDriver navigating to:\u0027https://1.1.1.1/\u0027");**
formatter.write("11:43:59: Finding web element By.id: gwt-debug-Dialog_Box");
formatter.write("11:43:59: Web element found By.id: gwt-debug-Dialog_Box");
formatter.write("11:43:59: Finding web element By.id: gwt-debug-Login_UserName");
formatter.write("11:43:59: Web element found By.id: gwt-debug-Login_UserName");
formatter.write("11:43:59: WebDriver changing value in element found By.id: gwt-debug-Login_UserName from \u0027\u0027 to \u0027\u0027");
formatter.write("11:43:59: WebDriver changing value in element found By.id: gwt-debug-Login_UserName from \u0027\u0027 to \u0027moaada\u0027");
formatter.write("11:43:59: Finding web element By.id: gwt-debug-Dialog_Box");
formatter.write("11:43:59: Web element found By.id: gwt-debug-Dialog_Box");
formatter.write("11:43:59: Finding web element By.id: gwt-debug-Login_Password");
formatter.write("11:43:59: Web element found By.id: gwt-debug-Login_Password");
formatter.write("11:43:59: WebDriver changing value in element found By.id: gwt-debug-Login_Password from \u0027\u0027 to \u0027\u0027");
formatter.write("11:43:59: WebDriver changing value in element found By.id: gwt-debug-Login_Password from \u0027\u0027 to \u0027moaada12\u0027");
formatter.write("11:43:59: Finding web element By.id: gwt-debug-userInfo");
formatter.write("11:43:59: Web element found By.id: gwt-debug-userInfo");
formatter.write("11:44:00: Finding web element By.id: gwt-debug-userInfo");
formatter.write("11:44:00: Web element found By.id: gwt-debug-userInfo");
formatter.write("11:44:00: Finding web element By.id: gwt-debug-DeviceControlBar_Help");
formatter.write("11:44:00: Web element found By.id: gwt-debug-DeviceControlBar_Help");
formatter.embedding("image/png", "embedded0.png");
formatter.write("11:44:01: 11:44:00 Screenshot. Locator: By.id: gwt-debug-userInfo");
formatter.result({
  "duration": 3237037562,
  "status": "passed"
});
formatter.match({
  "location": "BasicOperationsSteps.logout()"
});
formatter.write("11:44:02: Finding web element By.id: gwt-debug-userInfo");
formatter.write("11:44:02: Web element found By.id: gwt-debug-userInfo");
formatter.write("11:44:02: Clicking on td");
formatter.write("11:44:02: Finding web element By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
formatter.write("11:44:02: Web element found By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
formatter.write("11:44:02: Finding web element By.id: gwt-debug-Global_Logout-0-0");
formatter.write("11:44:02: Web element found By.id: gwt-debug-Global_Logout-0-0");
formatter.write("11:44:02: Clicking on td");
formatter.write("11:44:02: Finding web element By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
formatter.write("11:44:02: Web element found By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
formatter.embedding("image/png", "embedded1.png");
formatter.write("11:44:03: 11:44:02 Screenshot. Locator: By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
formatter.write("11:44:03: Finding web element By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
formatter.write("11:44:12: Web element found By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
formatter.embedding("image/png", "embedded2.png");
formatter.write("11:44:12: 11:44:12 Screenshot. Locator: By.xpath: .//div[contains(@id,\u0027gwt-debug-Dialog_Box\u0027) and contains(@class,\u0027MessagesFrame\u0027)]");
formatter.result({
  "duration": 13063106597,
  "status": "passed"
});
formatter.after({
  "duration": 173543,
  "status": "passed"
});
formatter.after({
  "duration": 45551,
  "status": "passed"
});
});

Is this bug in cucumber ?

Upvotes: 0

Related Questions