Search code examples
javascriptsahi

How to assert that image contains required text in Sakuli?

I want to monitor a Dashboard, example as given below : I want to assert that it contains the below specified text, would taking a junk of small screenshots and then asserting the image has the below text works? or is there any better way to do this?

enter image description here

Solution

  • The answer depends on the dashboard implementation. It would be helpful to know which text should be asserted.

    If it is a web application
    I'd recommend using _assertContainsText from the assertion API.

    Sakuli V2 sample:

    (async () => {
  const testCase = new TestCase();
  try {
    await _navigateTo("https://stackoverflow.com");
    const contentHeading = await _fetch(_heading1(0, _in(_div("content"))))
    await _highlight(contentHeading)
    await _assertContainsText("We <3 people who code", contentHeading)
  } catch (e) {
    await testCase.handleException(e);
  } finally {
    await testCase.saveResult();
  }
})();

    If it is a native UI application
    Sakuli 2 is currently not capable of finding text on the screen. It is planned but not finished yet. Asserting the existence of sections on the screen is possible indeed.

    Given the following image as needle.png.
    enter image description here

    (async () => {
  const testCase = new TestCase();
  const url = "https://your-dashboard.com";
  const screen = new Region();
  const env = new Environment();
  try {
    await _navigateTo(url);
    await env.setSimilarity(0.95);
    await screen
      .exists("needle.png", 1)
      .highlight(1);
  } catch (e) {
    await testCase.handleException(e);
  } finally {
    await testCase.saveResult();
  }
})();

    When reusing this snippet, it will be most likely required to create a new needle image as I took it from your provided screenshot.