Integration testing a Jira Cloud Application

Hello,

We’re trying to create integration tests for our Jira Cloud Applications, as recommended by the “synthetic tests” part of the Cloud Fortified program, and ran into some issues.

We have a button in the issue glance, that opens a dialog when pressed.
I tried Cypress and Testcafe, and both failed to open the dialog, if I understand correctly, this might be related to the fact that Jira Cloud uses iframes, and the iframes have an X-FRAME-OPTIONS header for security.

As for Cypress, I know that it has some issues handling iframes, but that should be about finding elements inside the frame, and manipulating them, and there are workarounds and plugins for it, but we can’t even get the dialog to show, so it seems to be a more fundamental problem.
Of course, I set the “chromeWebSecurity”: false in the cypress.json.

As for Testcafe, it shouldn’t have any issues with iframes, but it couldn’t open the dialog either.

Note: I know this forum is not for finding help about these particular testing frameworks, so I’m not expecting to get an answer about how to use these properly, I’m only describing the scenario for context. But if someone did use any of these frameworks successfully, I’d love to get some tips.

I also tried Playwright, and it opened the dialog, so this is most likely more about choosing the right tool, than having a wrong configuration.

So my question for Atlassian or the app vendors who are already in the Cloud Fortified program:

  • Which tool do you use for integration tests? (either for the synthetic tests, or anything else)
  • Do we have people here who actually did the synthetic tests, even though it’s not required, just a recommendation?

I’m not expecting a full solution, just looking for pointers on where to look, possibly from people who have more experience with this than I do.
I see that Webdriver is listed as an example in the Cloud Fortified documentation, I’ll try this as well, and see if it works better.
I avoided it initially, because it’s based on Selenium, and that’s notorius for having stability issues…
But if someone here uses it, and it seems stable, that’s would also be a good source of information.

Thank you.

3 Likes

have you solved your issue?

I cannot even login into Jira Cloud with testcafe or cypress.io.
Can you possibly share your login test code?

would be very appreciated :slight_smile:

thanks
Bernhard

1 Like

The login did work for me in both mentioned frameworks, I only had trouble with the iframes.
But sadly I don’t have the POC code anymore, we use WebdriverIO instead, which works without issues.

Here’s our login page code, but it’s nothing out of the ordinary:

import { ChainablePromiseElement } from 'webdriverio';

class LoginPage  {
    public get inputUsername(): ChainablePromiseElement<Promise<WebdriverIO.Element>>  {
        return $('#username');
    }

    public get inputPassword(): ChainablePromiseElement<Promise<WebdriverIO.Element>> {
        return $('#password');
    }

    public get btnSubmit(): ChainablePromiseElement<Promise<WebdriverIO.Element>> {
        return $('#login-submit');
    }

    public async open(): Promise<void> {
        await browser.url('/login');
    }

    public async login (username: string, password: string): Promise<void> {
        await this.inputUsername.setValue(username);
        await this.btnSubmit.click();
        await this.inputPassword.setValue(password);
        await this.btnSubmit.click();
        await expect(browser).toHaveUrlContaining('/jira/your-work'); // do NOT remove the await! (it's necessary, ts spec is wrong)
    }
}

export default new LoginPage();
1 Like

Thanks a lot. I had trouble with the cross-site-origin problem because you need to login on id.atlassian.com and on the site is on something.atlassian.net and Chrome prevents that.

For cypress.io, I got the following working:

plugins/index.js

module.exports = (on, config) => {
  on('before:browser:launch', (browser = {}, args) => {
    if (!!args.args) {
      // NOTE: ALLOW id.atlassian.com CORS LOGIN!
      args.args.push('--disable-features=CrossSiteDocumentBlockingIfIsolating,CrossSiteDocumentBlockingAlways,IsolateOrigins,site-per-process');
    }
    return args;
  });
};

cypress.config.js

const { defineConfig } = require('cypress');
require('dotenv').config();

module.exports = defineConfig({
  viewportHeight: 1080,
  viewportWidth: 1920,
  chromeWebSecurity: false, // NOTE: ALLOW id.atlassian.com CORS LOGIN!
  defaultCommandTimeout: 30000,
  ....

Then it is the same logic as you posted :slight_smile:

Now that you mention it, I think I did have some similar issues with cypress, and I had to use some kind of configuration switch just like you. My memory is very hazy about this, because we switched to wdio after just 1-2 days of research, and it was a long time ago.

Anyway, thanks for sharing, it might help others to get started with cypress.

1 Like