State:
I've got an application, that is built with Angular (as Front-End) and Quarkus as (Back-End). The application first redirects the user to KeyCloak, and redirects back to the application (does not matter if online or localhosted) after a successful login.
For CI/CD I use Drone CI. Drone builds the applications first and runs the application in the container, but instead of localhost it has a customized url, lets call it app-url.
For End-To-End Testing I use Cypress. The test I want to do is a login test. There are no other npm packages, only cypress and newman in this project. Locally the test can be executed successfully, it makes 2 requests, 1 for authentification and 1 for getting the redirect url which is needed to access the content inside the application.
Here is the test in code that works on localhost:
describe('simple login test', () => {
beforeEach(() => {
cy.clearCookies();
cy.clearLocalStorage();
});
it('login', () => {
cy.log('login start')
function createUUID() {
const s = [];
const hexDigits = '0123456789abcdef';
for (let i = 0; i < 36; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
s[14] = '4';
s[19] = hexDigits.substr((parseInt(s[19]) & 0x3) | 0x8, 1);
s[8] = s[13] = s[18] = s[23] = '-';
return s.join('');
}
cy.request({
url: '{keycloak-url}',
qs: {
client_id: '{clientid}',
redirect_uri: 'http://localhost:8360',
scope: 'openid',
state: createUUID(),
nonce: createUUID(),
response_type: 'code',
response_mode: 'fragment',
}
})
.then((response) => {
cy.log('login first request')
const _el = document.createElement('html');
_el.innerHTML = response.body;
const loginForm = _el.getElementsByTagName('form');
const isAlreadyLoggedIn = !loginForm.length;
if (isAlreadyLoggedIn) {
return;
}
cy.wait(1000)
cy.request({
form: true,
method: 'POST',
url: loginForm[0].action,
followRedirect: false,
body: {
username: "user",
password: "pwd"
}
})
.then((res) => {
cy.log('login second request')
cy.log(res);
cy.wait(1000)
cy.log("RedirectToUrl ist " + res.redirectedToUrl)
cy.visit(res.redirectedToUrl);
cy.log('Login Redirect complete')
})
})
});
})
Error:
The error is with the redirect uri. Cypress does make an attempt to command a visit but everytime, the redirect cannot be accessed with Cy.Visit().
https://app-url:8360/
We attempted to make an http request to this URL but the request failed without a response.
We received this error at the network level:
> Error: connect ECONNREFUSED {ip for app-url}:8443
Common situations why this would fail:
- you don't have internet access
- you forgot to run / boot your web server
- your web server isn't accessible
- you have weird network configuration settings on your computer" type="CypressError"><![CDATA[CypressError: `cy.visit()` failed trying to load:
https://app-url:8443/
We attempted to make an http request to this URL but the request failed without a response.
We received this error at the network level:
> Error: connect ECONNREFUSED 192.168.208.6:8443
Common situations why this would fail:
- you don't have internet access
- you forgot to run / boot your web server
- your web server isn't accessible
- you have weird network configuration settings on your computer
at http://app-url:8080/__cypress/runner/cypress_runner.js:138876:23
at visitFailedByErr (http://app-url:8080/__cypress/runner/cypress_runner.js:138235:12)
at http://app-url:8080/__cypress/runner/cypress_runner.js:138875:11
at tryCatcher (http://app-url:8080/__cypress/runner/cypress_runner.js:10791:23)
at Promise._settlePromiseFromHandler (http://app-url:8080/__cypress/runner/cypress_runner.js:8726:31)
at Promise._settlePromise (http://app-url:8080/__cypress/runner/cypress_runner.js:8783:18)
at Promise._settlePromise0 (http://app-url:8080/__cypress/runner/cypress_runner.js:8828:10)
at Promise._settlePromises (http://app-url:8080/__cypress/runner/cypress_runner.js:8904:18)
at _drainQueueStep (http://app-url:8080/__cypress/runner/cypress_runner.js:5498:12)
at _drainQueue (http://app-url:8080/__cypress/runner/cypress_runner.js:5491:9)
at Async.../../node_modules/bluebird/js/release/async.js.Async._drainQueues (http://app-url:8080/__cypress/runner/cypress_runner.js:5507:5)
at Async.drainQueues (http://app-url:8080/__cypress/runner/cypress_runner.js:5377:14)
From Your Spec Code:
at Context.eval (http://app-url:8080/__cypress/tests?p=cypress/integration/tests/simple-login.spec.js:162:12)
From Node.js Internals:
Error: connect ECONNREFUSED 192.168.208.6:8443
at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1146:16)
]]></failure>
</testcase>
</testsuite>
</testsuites>
This is the yml with the steps for drone:
- name: test ui
image: image for test ui
volumes:
- name: cypress_results
path: app/cypress/results
- name: cypress_screenshots
path: app/cypress/screenshots
- name: cypress_videos
path: app/cypress/videos
commands:
- ./docker/app/wait-for.sh http://app-url:8360/ --> Bash file that makes drone wait until that url can be reached
- cd test
- npm install
- npx cypress run --config baseUrl=http://app-url:8360/ --spec "cypress/integration/**/*" --env testuser=user,testuserpw=pwd
Attempts to solve the problem:
- Checked ports, even changed ports to match them
- Removed cy.visit(), which leads to a pass
- Checked for correct Cypress Version
- Checked in KeyCloak for the redirection url.
- Project tested locally with CLI. Test could also be executed successfully
- Internet connection has been established with a bridge in docker compose
- Checked for availability of the website. In the yml file you can see the marking for a bash file which makes drone wait until the website has been established
Question: Are there any workarounds? If yes, what will it be? Has it to do with the container itself?
