Testing APEX apps At A Glance

1. 1

2. 2
Testing APEX Apps at a Glance
Kai Donato
KSCOPE 23, Aurora

3. 3
Ihr Partner für den digitalen Wandel.
Individuelle IT-Lösungen aus einer Hand.
Facts and Numbers.
Founded 1994
Headquarters: Ratingen
Branches:
Frankfurt a.M., Köln,
München, Hamburg
> 360 Employees
ca. 48 Mio. €
Revenue in 2022
Training company
> 125 Customers
across industries
Vendor neutral
certified partner
of leading technology
comanies

4. 4
About me
• Employee at MT GmbH in Ratingen since January
2014
• Department Manager APEX & JavaScript @ MT GmbH
• Project Leader and Developer (JavaScript & APEX)
• DOAG-Initiator – JavaScript
• Systems Integrations Specialist
UNIX-Server and Networkadministration
• Host on Devs on Tape Podcast
Kai Donato
@_KaiDonato

5. 5
• 1
• 2
1. About Me
Why perform (automated) UI tests?
2.
What's out there?
3.
Testing APEX Applications
4.
Reporting
5.
Flakiness in automated UI testing
6.
Agenda

6. Why automated UI-Testing?

7. 7
Why perform (automated) UI tests?
Required Information is provided
All Workflows work correctly
Save time
Error-Message validation
Ensure User Authorization works correctly

8. What‘s out there?

9. 9
What's out there?
?
(…)

10. Testing APEX-Applications

11. 11
Testing APEX Apps - Requirements
Offer extensive reporting options
Session management
Handle Flakiness
Handle different page contexts
Make interactions with page elements easy

12. 12
Testing APEX Applications
Locating Page Elements – How can we find this button?
<button id="submit_bttn" data-test-id="submit" class="t-Button--hot">Submit</button>
Element Type Element Id Id only for testing CSS class Element text
(what the user sees)
Using…
• CSS selector syntax
• #submit_bttn
• button[data-test-
id=submit]
• .t-Button--hot
• Xpath selector syntax
• //button[@id=‘submit_bttn’]
• //button[@data-test-id=‘submit’]
• //button[@class=‘t-Button--hot’]
• //button[text()=‘Submit’]

13. 13
Testing APEX Applications
<button id="submit_bttn" data-test-id="submit" class="t-Button--hot">Submit</button>
Element Type Element Id Id only for testing CSS class Element text
(what the user sees)
Locating Page Elements – Cypress
cy.get('#submit_bttn'); // CSS selector support
cy.xpath("//button[text()='Submit']"); // XPath selector support (*)
cy.get('.t-Button--hot').contains('Submit'); // Use CSS selectors, still query by text

14. 14
Testing APEX Applications
<button id="submit_bttn" data-test-id="submit" class="t-Button--hot">Submit</button>
Element Type Element Id Id only for testing CSS class Element text
(what the user sees)
Locating Page Elements – Playwright
await page.locator("#submit_bttn"); // CSS selector support
await page.locator("//button//span[text()='Submit']"); // Xpath selector support
await page.locator('button:has-text("Submit")'); // CSS selector + query by text
await page.locator('text="Submit"'); // Get element only by text

15. 15
Testing APEX Applications
Page Contexts

16. 16
Testing APEX Applications
Page Contexts

17. 17
Testing APEX Applications
Dealing with Iframes - Playwright
const iframe = await page.frameLocator('iframe');
await iframe.locator('#P7_CUST_FIRST_NAME').type('Max');
await iframe.locator('#P7_CUST_LAST_NAME').type('Mustermann');
await iframe.locator('#P7_CUST_STATE').selectOption({ label: 'Hawaii' });
await iframe.locator('#P7_CUST_POSTAL_CODE').type('44789');
await iframe.locator('#P7_CREDIT_LIMIT').type('5000');
await iframe.locator('text=Add Customer').click();

18. 18
Testing APEX Applications
Dealing with Iframes - Cypress
cy.getIframe().find('#P7_CUST_FIRST_NAME').type('Max');
cy.getIframe().find('#P7_CUST_LAST_NAME').type('Mustermann');
cy.getIframe().find('#P7_CUST_STATE').select('Hawaii');
cy.getIframe().find('#P7_CUST_POSTAL_CODE').type('44789');
cy.getIframe().find('#P7_CREDIT_LIMIT').type('5000');
cy.getIframe().xpath("//button/span[text()='Add Customer']").click();
Cypress.Commands.add('getIframe', () => {
return cy
.get('div[role=dialog] iframe', {log: false})
.its('0.contentDocument.body', {log:false}).should('not.be.empty’)
.then(cy.wrap, {log: false});
});

19. 19
Testing APEX Applications
Session Management - Navigating within the current session
Standard URLs
Friendly URLs
https://hostname:port/ords/f?p=<app_id>:<page_number>:<session_id>
https://hostname:port/ords/path_prefix/r/app_alias/page_alias?session=13766599855150

20. 20
Testing APEX Applications
Navigating within the current session - Cypress
describe('sample test', () => {
beforeEach(() => {
cy.visit('https://apex.generationcode.de/ords/f?p=100:LOGIN_DESKTOP’);
cy.get('#P101_USERNAME').type('user');
cy.get('#P101_PASSWORD').type('*********', {log: false});
cy.get('#P101_LOGIN').click();
cy.url().should('contain', 'f?p=100:1:').then($url => {
window.app_url = $url
});
})
it('go to customers page', () => {
cy.visit(app_url.replace(':1:', ':2:'));
})
})
Approach from Hayden Hudson, see: https://www.youtube.com/watch?v=QFzN_0soxiQ&t=4641s

21. 21
Testing APEX Applications
Navigating within the current session - Playwright
test.describe('demo', () => {
test.beforeEach(async ({ page}) => {
await page.goto('https://apex.generationcode.de/ords/f?p=100:');
await page.locator('#P101_USERNAME').type('user');
await page.locator('#P101_PASSWORD').type('*********');
await page.locator('text=Sign In').click();
await expect(page).toHaveURL(/(?<=.)(f?p=100:1:)(?=.)/gm);
});
test('go to page 2', async ({ page }) => {
await page.goto(page.url().replace(':1:', ':2:'))
});
});

22. Reporting

23. 23
Reporting and Dashboards
Cypress

24. 24
Reporting and Dashboards
Playwright

25. Flakiness

26. 26
Flakiness
Flakiness = The test outcome can switch between pass and fail throughout multiple runs
without any changes to the test code.
Time

27. 27
Thoughts on Flakiness
Flakiness can never be reduced to zero
Flaky tests can be useful (initially)

28. 28
Solutions to Flakiness - Playwright
Auto-waiting and actionability checks
Before an element is being interacted with, Playwright makes sure that it
is ready for the interaction.
await page.locator("//button//span[text()='Sign In']").click();
• Retries until element is found or timeout is reached
• Performs actionabilty checks before “click”-action is executed

29. 29
Solutions to Flakiness - Playwright
Actionability checks
• Element is attached to the DOM/ a Shadow Root
• Element is visible
• Element is stable
#sign_in_bttn {
visibility: hidden;
display: none;
}

30. 30
Solutions to Flakiness - Playwright
Actionability checks
• Element is enabled and editable
<button type="button" class="a-Button" disabled data-action="reset-report">Reset</button>
• Element receives events
Overlay

31. 31
Our approach to automated testing

32. 32
LCT
LCT in a nutshell
Node.js Server
APEX
Database

33. 33
LCT
Interacting with page elements
 Simply select the element you want to interact
with
 No need to worry about selectors
 Select Interactive Grid columns as well
 For custom page elements, manually entering
Xpath or CSS selector is also supported

34. 34
LCT
Working with iframes

35. 35
LCT
Reporting (Preview)
 Screenshots on step
failure
 Get extensive
information on what
went wrong
 See execution times of
each step

36. 36
LCT
Test APEX Standard Components easily and quickly
await page.locator('#P630_POPUP_LOV_DEFAULT_MULTI_COL_lov_btn').click();
await page.locator('.a-PopupLOV-searchBar input').type('Display1’);
await page.locator('#PopupLov_630_P630_POPUP_LOV_DEFAULT_MULTI_COL_dlg button').click();
await page.locator('//span[@class="popup-lov-highlight"][text()="Display1"]', ).click();

37. 37
Get in touch!
@lct-
apex
@LowCodeTesting
lct.software

38. 38
Flows for APEX
BPMN 2.0 Workflows for APEX • Open Source
• Community Driven
• Support available

39. 39
Subscribe to get notified!
You heard
it here first!
#kscope23

40. 40
Questions?
Kai Donato
Department Manager APEX & JavaScript
Telefon: +49 2102 30 961-0
Mobil: +49 173 8937790
Mail: kai.donato@mt-itsolutions.com
MT GmbH
Balcke-Dürr-Allee 9
40882 Ratingen
www.mt-itsolutions.com

41. 41