title,body,link,tags,view_count,is_answered,score,answer_count
"end to end testing React, puppeteer serve command fails","<p>I am following the tutorial react e2e testing.</p>
<p><a href=""https://blog.logrocket.com/end-to-end-testing-react-jest-puppeteer/#:%7E:text=To%20run%20the%20end%2Dto,%2Dscripts%20test%20%2D%2DtestPathIgnorePatterns%3D"" rel=""nofollow noreferrer"">https://blog.logrocket.com/end-to-end-testing-react-jest-puppeteer/#:~:text=To%20run%20the%20end%2Dto,%2Dscripts%20test%20%2D%2DtestPathIgnorePatterns%3D</a>.</p>
<p>I get stuck in the line serve -s build<a href=""https://i.stack.imgur.com/0LS8c.png"" rel=""nofollow noreferrer"">serve command not working</a> as shown in the attached image.</p>
<pre><code>C:\tutorials\react-puppeteer&gt;yarn global add serve
yarn global v1.22.19
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Installed &quot;serve@14.1.2&quot; with binaries:
      - serve
Done in 0.81s.

C:\tutorials\react-puppeteer&gt;serve -s build
'serve' is not recognized as an internal or external command,
operable program or batch file.
</code></pre>
<p>I am using windows 11 with vscode as my ide. My node version is 16.19.0. '</p>
<p>I have tried another stack overflow suggest which said using &quot;npx serve -s&quot; instead of &quot;serve -s build&quot; with no success.
<a href=""https://stackoverflow.com/questions/55815956/serve-is-not-recognized-as-an-internal-or-external-command-to-run-react-app"">&#39;serve&#39; is not recognized as an internal or external command to run react app</a></p>
<p>I was expecting that the server will run on localhost:5000 but that did not happen.</p>
",https://stackoverflow.com/questions/74987316/end-to-end-testing-react-puppeteer-serve-command-fails,"['reactjs', 'puppeteer', 'e2e-testing']",25,False,0,0
How to disable devtools on electron.lauch() in playwright end-to-end testing,"<p>Playwright electronApp.firstWindow() sometimes returned the DevTools window and sometimes the actual main window.</p>
<p>If the DevTools window is returned, the test waits indefinitely for the selector.</p>
<p>Error: expect(received).toContain(expected) // indexOf</p>
<pre><code>Expected substring: &quot;ecommerce&quot;
Received string:    &quot;DevTools&quot;

  23 |   });
  24 |   test('App launches and quits', async () =&gt; {
&gt; 25 |     await expect(await page.title()).toContain('ecommerce');
     |                                      ^
  26 |   });
</code></pre>
",https://stackoverflow.com/questions/76316656/how-to-disable-devtools-on-electron-lauch-in-playwright-end-to-end-testing,"['electron', 'playwright']",20,False,0,0
"Expected to find element: undefined, but never found it","<p>I'm performing E2E testing and trying to select the two check box from this list.</p>
<p><img src=""https://i.stack.imgur.com/4MZvf.png"" alt=""enter image description"" /></p>
<pre class=""lang-js prettyprint-override""><code>export class SignupPage {

  select_cuisine='.anchor'


  selectcuisine(){
    cy.get(this.select_cuisine.type=&quot;checkbox&quot;).check('Coffee &amp; Tea')
    
    }
}
</code></pre>
<pre class=""lang-js prettyprint-override""><code>import { SignupPage } from &quot;./Pages/signup_page&quot;


it.only('Sign up', function () {
  
  signupage.selectcuisine()
})
</code></pre>
<p>Error message.</p>
<p><img src=""https://i.stack.imgur.com/Gv74S.png"" alt=""enter image description here"" /></p>
<p>I want to select at least two checkboxes from the list to complete my end-to-end testing flow.</p>
",https://stackoverflow.com/questions/75061479/expected-to-find-element-undefined-but-never-found-it,"['javascript', 'automation', 'cypress', 'checkboxlist']",96,True,1,1
Cypress auth0 redirect to login on successful auth,"<p>Trying to make the auth0 authenticate login with cypress, followed this instructions (<a href=""https://auth0.com/blog/end-to-end-testing-with-cypress-and-auth0/"" rel=""nofollow noreferrer"">https://auth0.com/blog/end-to-end-testing-with-cypress-and-auth0/</a>)
I got a successful 200 response on POST but keep getting redirected to the login page whenever I do a cy.visit()</p>
<p>Tried encapsulating the code on cy.session</p>
<pre><code>Cypress.Commands.add('logint', (overrides = {}) =&gt; {
    Cypress.log({
      name: 'loginViaAuth0',
    });
  
    const options = {
      method: 'POST',
      url: Cypress.env('auth_url'),
      body: {
        grant_type: 'password',
        username: Cypress.env('auth_username'),
        password: Cypress.env('auth_password'),
        audience: Cypress.env('auth_audience'),
        scope: 'openid profile email',
        client_id: Cypress.env('auth_client_id'),
        client_secret: Cypress.env('auth_client_secret'),
      },
    };
    cy.request(options);
  });
</code></pre>
<pre><code>import logint from '../support/commands'

describe('login', () =&gt; {
beforeEach(() =&gt; {
    cy.session(&quot;User session&quot;,()=&gt;{
        cy.logint()
        .then((resp) =&gt; {
          return resp.body;
        })
        .then((body) =&gt; {
          const {access_token, expires_in, id_token} = body;
          const auth0State = {
            nonce: '',
            state: 'some-random-state'
          };
          const callbackUrl = `/callback#access_token=${access_token}&amp;scope=openid&amp;id_token=${id_token}&amp;expires_in=${expires_in}&amp;token_type=Bearer&amp;state=${auth0State.state}`;
          cy.visit(callbackUrl, {
            onBeforeLoad(win) {
              win.document.cookie = 'com.auth0.auth.some-random-state=' + JSON.stringify(auth0State);
            }
          });
        })
        
    })

});

    it('should successfully log into our app', () =&gt; {
       
     
    cy.visit('/app/projects/personal')
   

    });
  });

</code></pre>
",https://stackoverflow.com/questions/75616781/cypress-auth0-redirect-to-login-on-successful-auth,"['javascript', 'cypress', 'auth0']",161,False,2,1
Heroku release phase - per environment set-up,"<p>We use Cypress for end-to-end testing, triggered by a call in the Heroku release phase of our app (the script is in <code>bin/release</code>).</p>
<p>However, this release phase runs both for deployment to staging and production. We'd like it to only run in staging, to cut down on Cypress costs.</p>
<p>Is there any way to make this happen?</p>
",https://stackoverflow.com/questions/76242063/heroku-release-phase-per-environment-set-up,['heroku'],8,False,-1,0
Testcafe fails with ECONNREFUSED in GitLab CI running in a Ubuntu-Container,"<p>For a project, I using the glubuntu-php docker image from <a href=""https://git.var-lab.com/dev-tools/glubuntu-php"" rel=""nofollow noreferrer"">https://git.var-lab.com/dev-tools/glubuntu-php</a>. There are some packages pre-installed, including the <code>chromium-browser</code> package.</p>
<p>In the pipeline, I want to run testcafe for end-to-end-testing using the pre-installed chromium-browser in headles mode:</p>
<pre class=""lang-json prettyprint-override""><code>variables:
  DOCKER_DRIVER: overlay2
  JOB_IMAGE: git.var-lab.com:5050/dev-tools/glubuntu-php:latest-php-8.1
  GIT_STRATEGY: clone

e2e_tests:
  rules:
    - if: $CI_PIPELINE_SOURCE == 'merge_request_event'
    - if: ($CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH)
  image: $JOB_IMAGE
  variables:
    BACKEND_SERVICE_URL: http://localhost
    PUBLIC_BACKEND_SERVICE_URL: http://localhost
  before_script:
    - apt update
    - apt install -y x11-apps
  script:
    - mysql -h database -u root -proot &lt;&lt;&lt; &quot;SET GLOBAL sql_mode = '';&quot;
    - mysql -h database -u root -proot symfony &lt; data/sql_dump.sql
    - git clone https://gitlab-ci-token:${CI_JOB_TOKEN}@git.xxx.de/xxx/xxx-software.git
    - cd xxx-software
    - composer install
    - php -d variables_order=EGPCS -S $BACKEND_SERVICE_URL public/index.php &amp;
    - cd ../
    - git clone https://gitlab-ci-token:${CI_JOB_TOKEN}@git.xxx.de/xxx/xxx-frontend.git
    - cd xxx-frontend
    - npm install
    - npm run dev &amp;
    - cd ../
    - npm install
    - chromium --headless --no-sandbox --remote-debugging-port=34135 http://localhost:3000 &amp;
    - ps aux
    - npm run test-ci -- -b
    - npm run test-ci -- --debug-on-fail
</code></pre>
<p>Testcafe-configuration:</p>
<pre class=""lang-json prettyprint-override""><code>{
  &quot;disableScreenshots&quot;: false,
  &quot;screenshots&quot;: {
    &quot;path&quot;: &quot;./screenshots/&quot;,
    &quot;takeOnFails&quot;: true
  },
  &quot;qrCode&quot;: true,
  &quot;color&quot;: true
}
</code></pre>
<p>packages.json:</p>
<pre class=""lang-json prettyprint-override""><code>{
  &quot;scripts&quot;: {
    &quot;test&quot;: &quot;testcafe chrome&quot;,
    &quot;test-ci&quot;: &quot;testcafe 'chromium --headless --no-sandbox'&quot;
  },
  &quot;dependencies&quot;: {
    &quot;testcafe&quot;: &quot;^2.2.0&quot;
  }
}
</code></pre>
<p>The pipeline fails with</p>
<pre><code>$ npm run test-ci -- --debug-on-fail
&gt; test-ci
&gt; testcafe 'chromium --headless --no-sandbox' --debug-on-fail
ERROR Unable to open the &quot;chromium: --headless --no-sandbox&quot; browser due to the following error:
Error: connect ECONNREFUSED 127.0.0.1:40635
    at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1487:16)
    at TCPConnectWrap.callbackTrampoline (node:internal/async_hooks:130:17)
Type &quot;testcafe -h&quot; for help.
</code></pre>
<p>Locally, the e2e-tests succeeds when I use the command <code>npm run test</code>.</p>
",https://stackoverflow.com/questions/75209159/testcafe-fails-with-econnrefused-in-gitlab-ci-running-in-a-ubuntu-container,"['testing', 'gitlab', 'automated-tests', 'chromium', 'testcafe']",143,False,0,0
Failed to find a DNS-record for the resource at &quot;localhost&quot; using Testcafe in Bitbucket Pipeline,"<p>I want to set up a bitbucket pipeline to run our end-to-end testing using testcafe for our angular application.</p>
<p>We are using the guide from this link: <a href=""https://testcafe.io/documentation/402821/guides/continuous-integration/bitbucket-pipelines"" rel=""nofollow noreferrer"">https://testcafe.io/documentation/402821/guides/continuous-integration/bitbucket-pipelines</a></p>
<p>But after running it in the bitbucket pipeline, we always get the below error. It is because locally, we are running it at the localhost:3200 which is not the case in bitbucket.</p>
<pre><code>Error in fixture.beforeEach hook -
      Failed to load the page at &quot;http://localhost:3200/projects/list&quot;.
      Increase the value of the &quot;pageRequestTimeout&quot; variable, enable the &quot;retryTestPages&quot; option, or use quarantine mode to perform additional attempts to execute this test.
      You can find troubleshooting information for this issue at &quot;https://go.devexpress.com/TestCafe_FAQ_ARequestHasFailed.aspx&quot;.
      Error details:
      Failed to find a DNS-record for the resource at &quot;http://localhost:3200/projects/list&quot;.
      Browser: Chrome 94.0.4606.81 / Linux 0.0
</code></pre>
",https://stackoverflow.com/questions/75630750/failed-to-find-a-dns-record-for-the-resource-at-localhost-using-testcafe-in-bi,"['testing', 'automation', 'automated-tests', 'e2e-testing', 'testcafe']",105,False,0,0
How to tap on Modal&#39;s Continue button without testIds in Detox E2E Testing for React Native app with Auth0 Universal Login?,"<p>In my React Native application, I am using Detox for end-to-end testing. My app's authorization flow includes Auth0 Universal Login, and I am struggling to find a way to tap on the &quot;Continue&quot; button within the Modal since there are no test IDs associated with either the Modal or the button. Can anyone suggest a solution or workaround for this issue? <a href=""https://i.stack.imgur.com/kuKnn.png"" rel=""nofollow noreferrer""><img src=""https://i.stack.imgur.com/kuKnn.png"" alt=""enter image description here"" /></a></p>
<p>I have tried the following code to access the modal but It's not working</p>
<pre><code>waitFor(element(by.traits(['modal']))).toBeVisible();
const continueButton = element(by.text('Continue'));
await expect(continueButton).toBeVisible();
await continueButton.tap();
</code></pre>
",https://stackoverflow.com/questions/76117247/how-to-tap-on-modals-continue-button-without-testids-in-detox-e2e-testing-for-r,"['react-native', 'detox']",48,False,0,0
Gitlab job does not extends another job correctly,"<p>I am trying to use a common configuration for two jobs in my gitlab ci pipeline.<br />
Purpose is to trigger end-to-end testing with firebase both locally and remotely.</p>
<p>.gitlab-ci.yml:</p>
<pre><code>before_script:
  - npm i
  - npm i -g firebase-tools

cache:
  key:
    files:
      - package-lock.json
  paths:
    - ~/node_modules

.e2e:
  stage: 'test'
  image: cypress/base:16.13.0
  script:
    - npm i -g firebase-tools
    - apt update
    - apt -y install default-jre # For firebase emulators
    - apt -y install default-jdk # For firebase emulators
    - firebase use test --token &quot;$FIREBASE_TOKEN&quot;
    - npm ci

e2e:local:
  extends: .e2e
  script:
    - npm run e2e:local
  cache:
    key: ${CI_COMMIT_REF_SLUG}
    paths:
      - .npm
      - cache/Cypress
  artifacts:
    paths:
      - cypress/videos
      - cypress/screenshots
    expire_in: 5 day

</code></pre>
<p>The problem here is that when the job e2e:local runs, it throws an error, because it does not find firebase command, which means the &quot;npm i -g firebase-tools&quot; command of the .e2e job is not triggered.</p>
<p>Where am I wrong ?
Thanks for help</p>
",https://stackoverflow.com/questions/75472383/gitlab-job-does-not-extends-another-job-correctly,"['gitlab', 'gitlab-ci']",88,True,0,1
Flutter automation test for web apps,"<p>i am new dart and flutter. My question is how to write automation test for flutter web projects?
Classic automation tests need to locate ui elements(html). Hovewer flutter does not let it. How can i do that in flutter web apps?</p>
<p>If my flutter app is hosted somewhere, and I want to do end-to-end testing. (Locating and clicking/interacting with elements on the page) is there a testing framework or driver that can work nicely with the shadow dom / setup that flutter creates?</p>
",https://stackoverflow.com/questions/75517691/flutter-automation-test-for-web-apps,"['flutter', 'unit-testing', 'testing', 'automated-tests']",186,False,0,1
How can I skip GitHub workflow for external collaborators?,"<p>We have a GitHub workflow for end-to-end testing. The tests require some API keys that are stored as repo secrets and exposed to the workflow. GitHub helpfully doesn‘t expose the secrets if the workflow is triggered by an external collaborator, so that untrusted parties cannot steal our API tokens through a malicious PR. Is there a way to skip the whole end-to-end workflow for these users? So far we skip the main step using an <code>if</code> rule and a special secret:</p>
<pre class=""lang-yaml prettyprint-override""><code>name: E2E Tests
on:
  push:
    branches: [master]
  pull_request:
    branches: [master]
jobs:
  test:
    runs-on: ubuntu-latest
    env:
      SECRETS_SET: ${{ secrets.SECRETS_SET }}
    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: 18
      - name: Install dependencies
        run: yarn install
      - name: Install Playwright Browsers
        run: npx playwright install --with-deps
      - name: Run Playwright tests
        # Only run this step if repo secrets are exposed
        if: ${{ env.SECRETS_SET != '' }}
        run: yarn test:e2e
</code></pre>
<p>But it would be much nicer if the workflow didn’t run at all.</p>
",https://stackoverflow.com/questions/75791260/how-can-i-skip-github-workflow-for-external-collaborators,['github-actions'],28,False,0,0
Vue router doesn&#39;t load with create-vue@3,"<p>i was trying out the vue router but i'm not getting the expected result.</p>
<p>I'm following the <a href=""https://router.vuejs.org/guide/"" rel=""nofollow noreferrer"">https://router.vuejs.org/guide/</a> tutorial, if i use the CDN and put it in a unique HTML file it works, but if i try in this way it doesn´t:</p>
<h2>Steps to reproduce:</h2>
<ul>
<li>run <code>npm create vue@3</code></li>
<li>Configuration:
<ul>
<li>Project name: … vue-project</li>
<li>Add TypeScript? Yes</li>
<li>Add JSX Support? Yes</li>
<li>Add Vue Router for Single Page Application development? Yes</li>
<li>Add Pinia for state management? … No</li>
<li>Add Vitest for Unit Testing? … No</li>
<li>Add an End-to-End Testing Solution? › No</li>
<li>Add ESLint for code quality? … No</li>
</ul>
</li>
<li>install all dependencies</li>
<li>Change <code>src/main.ts</code> to</li>
</ul>
<pre class=""lang-js prettyprint-override""><code>import * as Vue from 'vue'
import * as VueRouter from 'vue-router'

// 1. Define route components.
// These can be imported from other files
const Home = { template: '&lt;div&gt;Home&lt;/div&gt;' }
const About = { template: '&lt;div&gt;About&lt;/div&gt;' }

// 2. Define some routes
// Each route should map to a component.
// We'll talk about nested routes later.
const routes = [
  { path: '/', component: Home },
  { path: '/about', component: About },
//   { path: '/smm', component: About },
]

// 3. Create the router instance and pass the `routes` option
// You can pass in additional options here, but let's
// keep it simple for now.
const router = VueRouter.createRouter({
  // 4. Provide the history implementation to use. We are using the hash history for simplicity here.
  history: VueRouter.createWebHashHistory(),
  routes, // short for `routes: routes`
})

// 5. Create and mount the root instance.
const app = Vue.createApp({})
// Make sure to _use_ the router instance to make the
// whole app router-aware.
app.use(router)

app.mount('#app')
</code></pre>
<ul>
<li>Change <code>index.html</code> to</li>
</ul>
<pre class=""lang-html prettyprint-override""><code>&lt;!DOCTYPE html&gt;
&lt;html lang=&quot;en&quot;&gt;
  &lt;head&gt;
    &lt;meta charset=&quot;UTF-8&quot;&gt;
    &lt;link rel=&quot;icon&quot; href=&quot;/favicon.ico&quot;&gt;
    &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
    &lt;title&gt;Vite App&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;

&lt;div id=&quot;app&quot;&gt;

    &lt;h1&gt;Hello App!&lt;/h1&gt;
    &lt;p&gt;
      &lt;!-- use the router-link component for navigation. --&gt;
      &lt;!-- specify the link by passing the `to` prop. --&gt;
      &lt;!-- `&lt;router-link&gt;` will render an `&lt;a&gt;` tag with the correct `href` attribute --&gt;
      &lt;router-link to=&quot;/&quot;&gt;Go to Home&lt;/router-link&gt;
      &lt;router-link to=&quot;/about&quot;&gt;Go to About&lt;/router-link&gt;
    &lt;/p&gt;
    &lt;!-- route outlet --&gt;
    &lt;!-- component matched by the route will render here --&gt;
    &lt;router-view&gt;&lt;/router-view&gt;
&lt;/div&gt;

    &lt;script type=&quot;module&quot; src=&quot;/src/main.ts&quot;&gt;&lt;/script&gt;
  &lt;/body&gt;
&lt;/html&gt;

- run `yarn start`
</code></pre>
<p>Vue and vue-router versions:</p>
<pre class=""lang-json prettyprint-override""><code>  &quot;dependencies&quot;: {
    &quot;vue&quot;: &quot;^3.3.2&quot;,
    &quot;vue-router&quot;: &quot;^4.2.0&quot;
  },
</code></pre>
",https://stackoverflow.com/questions/76241963/vue-router-doesnt-load-with-create-vue3,"['typescript', 'vue.js', 'vue-router4']",43,True,0,1
cypress test in Jenkins CI/CD pipeline not working,"<p>I want to use cypress to do end-to-end testing in my web applications.</p>
<p>When I do them locally has been quite easy:</p>
<ol>
<li>Install cypress: <code>npm install cypress</code></li>
<li>Run tests: <code>npx cypress run</code></li>
</ol>
<p>I want to test it in Jenkins, in my CI/CD pipelinee. Following the <a href=""https://docs.cypress.io/guides/continuous-integration/ci-provider-examples"" rel=""nofollow noreferrer"">https://docs.cypress.io/guides/continuous-integration/ci-provider-examples</a>, they suggest to do it with this piece of code:</p>
<pre><code>pipeline {
  agent {
    // this image provides everything needed to run Cypress
    docker {
      image 'cypress/base:latest'
    }
  }

  stages {
    stage('build and test') {
      steps {
        sh 'npm ci'
        sh &quot;npm run test:ci:record&quot;
      }
    }
  }
}
</code></pre>
<p>I have my <code>package.json</code> and <code>package-lock.json</code> that I got from their repository and when I try run the pipeline and I get this error:</p>
<pre><code> npm ci

npm ERR! code EACCES

npm ERR! syscall mkdir

npm ERR! path /.npm

npm ERR! errno -13

npm ERR! 

npm ERR! Your cache folder contains root-owned files, due to a bug in

npm ERR! previous versions of npm which has since been addressed.

npm ERR! 

npm ERR! To permanently fix this problem, please run:

npm ERR!   sudo chown -R 109:115 &quot;/.npm&quot;

npm ERR! code EACCES

npm ERR! syscall mkdir

npm ERR! path /.npm

npm ERR! errno -13

npm ERR! 

npm ERR! Your cache folder contains root-owned files, due to a bug in

npm ERR! previous versions of npm which has since been addressed.

npm ERR! 

npm ERR! To permanently fix this problem, please run:

npm ERR!   sudo chown -R 109:115 &quot;/.npm&quot;

npm ERR! code EACCES

npm ERR! syscall mkdir

npm ERR! path /.npm

npm ERR! errno -13

npm ERR! 

npm ERR! Your cache folder contains root-owned files, due to a bug in

npm ERR! previous versions of npm which has since been addressed.

npm ERR! 

npm ERR! To permanently fix this problem, please run:

npm ERR!   sudo chown -R 109:115 &quot;/.npm&quot;

npm ERR! code EACCES

npm ERR! syscall mkdir

npm ERR! path /.npm

npm ERR! errno -13

npm ERR! 

npm ERR! Your cache folder contains root-owned files, due to a bug in

npm ERR! previous versions of npm which has since been addressed.

npm ERR! 

npm ERR! To permanently fix this problem, please run:

npm ERR!   sudo chown -R 109:115 &quot;/.npm&quot;

npm ERR! code EACCES

npm ERR! syscall mkdir

npm ERR! path /.npm

npm ERR! errno -13

npm ERR! 

npm ERR! Your cache folder contains root-owned files, due to a bug in

npm ERR! previous versions of npm which has since been addressed.

npm ERR! 

npm ERR! To permanently fix this problem, please run:

npm ERR!   sudo chown -R 109:115 &quot;/.npm&quot;

npm ERR! code EACCES

npm ERR! syscall mkdir

npm ERR! path /.npm

npm ERR! errno -13

npm ERR! 

npm ERR! Your cache folder contains root-owned files, due to a bug in

npm ERR! previous versions of npm which has since been addressed.

npm ERR! 

npm ERR! To permanently fix this problem, please run:

npm ERR!   sudo chown -R 109:115 &quot;/.npm&quot;

npm ERR! code EACCES

npm ERR! syscall mkdir

npm ERR! path /.npm

npm ERR! errno -13
</code></pre>
<p>I have tried to run <code>chown -R 109:115 &quot;/.npm&quot;</code> but I got an error saying tat this file was not found.</p>
<p>I have tried to run it without their image but I got this error:</p>
<pre><code>+ npm run cypress run



&gt; cypress-example-docker-gitlab@1.0.0 e2e /var/lib/jenkins/workspace/p.cafe_DP-446-cypress-in-jenkins

&gt; cypress run



It looks like this is your first time using Cypress: 12.2.0



[STARTED] Task without title.

[FAILED] Your system is missing the dependency: Xvfb

[FAILED] 

[FAILED] Install Xvfb and run Cypress again.

[FAILED] 

[FAILED] Read our documentation on dependencies for more information:

[FAILED] 

[FAILED] https://on.cypress.io/required-dependencies

[FAILED] 

[FAILED] If you are using Docker, we provide containers with all required dependencies installed.
</code></pre>
",https://stackoverflow.com/questions/75634957/cypress-test-in-jenkins-ci-cd-pipeline-not-working,"['jenkins', 'continuous-integration', 'cypress']",221,False,0,0
"end to end testing React, puppeteer serve command fails","<p>I am following the tutorial react e2e testing.</p>
<p><a href=""https://blog.logrocket.com/end-to-end-testing-react-jest-puppeteer/#:%7E:text=To%20run%20the%20end%2Dto,%2Dscripts%20test%20%2D%2DtestPathIgnorePatterns%3D"" rel=""nofollow noreferrer"">https://blog.logrocket.com/end-to-end-testing-react-jest-puppeteer/#:~:text=To%20run%20the%20end%2Dto,%2Dscripts%20test%20%2D%2DtestPathIgnorePatterns%3D</a>.</p>
<p>I get stuck in the line serve -s build<a href=""https://i.stack.imgur.com/0LS8c.png"" rel=""nofollow noreferrer"">serve command not working</a> as shown in the attached image.</p>
<pre><code>C:\tutorials\react-puppeteer&gt;yarn global add serve
yarn global v1.22.19
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Installed &quot;serve@14.1.2&quot; with binaries:
      - serve
Done in 0.81s.

C:\tutorials\react-puppeteer&gt;serve -s build
'serve' is not recognized as an internal or external command,
operable program or batch file.
</code></pre>
<p>I am using windows 11 with vscode as my ide. My node version is 16.19.0. '</p>
<p>I have tried another stack overflow suggest which said using &quot;npx serve -s&quot; instead of &quot;serve -s build&quot; with no success.
<a href=""https://stackoverflow.com/questions/55815956/serve-is-not-recognized-as-an-internal-or-external-command-to-run-react-app"">&#39;serve&#39; is not recognized as an internal or external command to run react app</a></p>
<p>I was expecting that the server will run on localhost:5000 but that did not happen.</p>
",https://stackoverflow.com/questions/74987316/end-to-end-testing-react-puppeteer-serve-command-fails,"['reactjs', 'puppeteer', 'e2e-testing']",25,False,0,0
Opening Cypress gives an error in not finding resource.pak,"<p>I'm trying to add End to End testing to my application through Cypress, however I've run into the issue that, after installing cypress through &quot;npm install cypress&quot; the command listed in their documentation &quot;npx cypress open&quot; will not work. It gives the following error.</p>
<p>`[35608:0112/105037.652:ERROR:resource_bundle.cc(991)] Failed to load C:\Users\User\AppData\Local\Cypress\Cache\12.3.0\Cypress\resources.pak
Some features may not be available.
Error: Cannot find module 'socket.io-client/dist/socket.io.js'
Require stack:</p>
<ul>
<li>C:\Users\User\AppData\Local\Cypress\Cache\12.3.0\Cypress\resources\app\packages\socket\index.js`</li>
</ul>
<p>What I've tried is a fresh reinstall of cypress, specifically adding socket.io and socket.io-client globally. I've also looked into the file path of resource.pak and have confirmed the folder is there.</p>
",https://stackoverflow.com/questions/75094471/opening-cypress-gives-an-error-in-not-finding-resource-pak,"['npm', 'cypress', 'npm-install']",232,False,1,1
RangeError: offset is out of bounds when trying to render 3d objects in Cypress,"<p>I am using Cypress test runner for end to end testing for an Angular application that uses threeJS to render 3d objects in the scene. Everything works fine until I ask for the 3d scene to be rendered, which is giving the error 'RangeError: offset is out of bounds' and the 3d objects are not rendered. Note, this particular error is only showing up when I am using the chrome browser/Electron for Cypress testing. Otherwise it is being rendered on chrome without Cypress.</p>
<p><img src=""https://i.stack.imgur.com/tu6p0.png"" alt=""Chrome being controlled by Cypress"" /></p>
<p>Using google chrome without Cypress:</p>
<p><img src=""https://i.stack.imgur.com/d06Td.png"" alt=""Chrome without Cypress"" /></p>
<p>I was just wondering what could be the reason for this issue?</p>
<p>I tried debugging using the chrome debugger (no error shown in the console) and everything seems to be working fine. I guess it is exclusively related to Cypress.</p>
",https://stackoverflow.com/questions/75108068/rangeerror-offset-is-out-of-bounds-when-trying-to-render-3d-objects-in-cypress,"['javascript', 'angular', 'three.js', 'cypress']",57,False,2,0
Cypress Test Authentication with Azure AAD,"<p>I am trying to test an Azure AAD Login with Cypress.</p>
<p>I tried to follow the steps from: <a href=""https://docs.cypress.io/guides/end-to-end-testing/azure-active-directory-authentication"" rel=""nofollow noreferrer"">https://docs.cypress.io/guides/end-to-end-testing/azure-active-directory-authentication</a></p>
<p>If I navigate to the home page with the following:</p>
<pre><code>describe('Azure Active Directory Authentication', () =&gt; {
  it('should verify the user logged in has the correct name', () =&gt; {
    cy.visit('/home')
  })
})
</code></pre>
<p>Then Cypress gets stuck in the Azure Login:
<a href=""https://i.stack.imgur.com/dz4Ir.jpg"" rel=""nofollow noreferrer""><img src=""https://i.stack.imgur.com/dz4Ir.jpg"" alt=""enter image description here"" /></a></p>
<p>Now when I use the cy.origin:</p>
<pre><code>describe('Azure Active Directory Authentication', () =&gt; {
    it('should verify the user logged in has the correct name', () =&gt; {
      cy.visit('/home')
      const username = 'juanito'

      cy.origin(
          'login.microsoftonline.com',
          {args: {username}},
          ({ username }) =&gt; {
            console.log(&quot;HELELLOOO: &quot; + username)
          }
      )
    })
})
</code></pre>
<p>The Login Page pops-up and after a few seconds it moves straight in the page behind the authentication. Looks to me Cypress/Browser is using some previously stored data, because it is bypassing the AZ Login.</p>
<p>I tried to clear the browser, reinstalled the npm packages, tried Cypress.session.clearAllSavedSessions() and Cypress.session.clearCurrentSessionData(), but with no success.</p>
<p>How do I fix this issue and make sure Cypress authenticate first with Azure AAD then moves into the pages behind the login?</p>
<p><a href=""https://i.stack.imgur.com/Rva8U.jpg"" rel=""nofollow noreferrer""><img src=""https://i.stack.imgur.com/Rva8U.jpg"" alt=""enter image description here"" /></a></p>
",https://stackoverflow.com/questions/76184316/cypress-test-authentication-with-azure-aad,"['azure-active-directory', 'cypress']",41,False,0,1
Firestore does not throw error but does not write data to the emulator,"<p>I try to setup the emulator for end-to-end testing on my angular application.</p>
<p>The application works well with the remote firestore database and authentication.
The following code is executed when init the app component:</p>
<pre><code>      const coll = collection(this.firestore ,'cities');
      const newDoc = doc(coll, 'LA');
  
      setDoc(newDoc, {
        name: 'Los angeles',
        country: 'United states'
      }).then(() =&gt; console.log('written'))
      .catch((err) =&gt; console.log('not written', err))

      const docRef = doc(this.firestore, &quot;cities&quot;, &quot;London&quot;);
      const docSnap = await getDoc(docRef);

      if (docSnap.exists()) {
        console.log(&quot;Document data:&quot;, docSnap.data());
      } else {
        console.log(&quot;No such document!&quot;);
      }
</code></pre>
<p>With the remote database, these operations are well working.<br />
The problem is that with the emulator, the writing operation logs 'written', while I cannot see any new document within the firestore database. I checked and it is not written in the remote database.<br />
Another strange thing is that if I write a new document in the emulator UI, I cannot see it into the application. The previous code logs 'No such document!'. I have to restart the emulator (data is persisting thanks to --import and --export-on-exit options), to see the new document data in the app.</p>
<p>Have somebody encountered strange behaviors like this ?</p>
<p>Thanks for help !</p>
<p>package.json:</p>
<pre><code>&quot;dependencies&quot;: {
    &quot;@angular/animations&quot;: &quot;~14.1.0&quot;,
    &quot;@angular/cli&quot;: &quot;^14.2.10&quot;,
    &quot;@angular/common&quot;: &quot;~14.1.0&quot;,
    &quot;@angular/core&quot;: &quot;~14.1.0&quot;,
    &quot;@angular/fire&quot;: &quot;^7.5.0&quot;,
    &quot;@angular/forms&quot;: &quot;~14.1.0&quot;,
    &quot;@angular/localize&quot;: &quot;~14.1.0&quot;,
    &quot;@angular/platform-browser&quot;: &quot;~14.1.0&quot;,
    &quot;@angular/platform-browser-dynamic&quot;: &quot;~14.1.0&quot;,
    &quot;@angular/router&quot;: &quot;~14.1.0&quot;,
    &quot;@fortawesome/angular-fontawesome&quot;: &quot;^0.11.0&quot;,
    &quot;@fortawesome/fontawesome-svg-core&quot;: &quot;^1.2.30&quot;,
    &quot;@fortawesome/free-regular-svg-icons&quot;: &quot;^5.14.0&quot;,
    &quot;@fortawesome/free-solid-svg-icons&quot;: &quot;^5.14.0&quot;,
    &quot;@ionic-native/core&quot;: &quot;^5.36.0&quot;,
    &quot;@ionic-native/splash-screen&quot;: &quot;^5.36.0&quot;,
    &quot;@ionic-native/status-bar&quot;: &quot;^5.36.0&quot;,
    &quot;@ionic/angular&quot;: &quot;^6.2.0&quot;,
    &quot;@ionic/cli&quot;: &quot;^6.20.8&quot;,
    &quot;@ionic/storage-angular&quot;: &quot;^3.0.6&quot;,
    &quot;@osdiab/io-ts-reporters&quot;: &quot;^1.3.2&quot;,
    &quot;@tweenjs/tween.js&quot;: &quot;^17.2.0&quot;,
    &quot;@types/tween.js&quot;: &quot;^17.2.0&quot;,
    &quot;deepcopy&quot;: &quot;^2.1.0&quot;,
    &quot;express-ws&quot;: &quot;^4.0.0&quot;,
    &quot;firebase&quot;: &quot;^9.9.1&quot;,
    &quot;flagpack-core&quot;: &quot;^2.0.0&quot;,
    &quot;fp-ts&quot;: &quot;^2.8.2&quot;,
    &quot;io-ts&quot;: &quot;^2.2.10&quot;,
    &quot;io-ts-reporters&quot;: &quot;^1.1.0&quot;,
    &quot;io-ts-types&quot;: &quot;^0.5.11&quot;,
    &quot;jsondiffpatch&quot;: &quot;^0.4.1&quot;,
    &quot;monocle-ts&quot;: &quot;^2.3.3&quot;,
    &quot;newtype-ts&quot;: &quot;^0.3.4&quot;,
    &quot;ng-cli&quot;: &quot;^0.7.0&quot;,
    &quot;numeric&quot;: &quot;^1.2.6&quot;,
    &quot;pako&quot;: &quot;^2.0.2&quot;,
    &quot;pixi.js&quot;: &quot;^4.8.7&quot;,
    &quot;rfdc&quot;: &quot;^1.1.4&quot;,
    &quot;rxjs&quot;: &quot;*&quot;,
    &quot;rxjs-compat&quot;: &quot;*&quot;,
    &quot;ts-md5&quot;: &quot;^1.2.7&quot;,
    &quot;tslib&quot;: &quot;^2.4.0&quot;,
    &quot;xstate&quot;: &quot;^4.32.1&quot;,
    &quot;zone.js&quot;: &quot;~0.11.7&quot;
  },
  &quot;devDependencies&quot;: {
    &quot;@angular-builders/custom-webpack&quot;: &quot;^14.1.0&quot;,
    &quot;@angular-builders/jest&quot;: &quot;^14.0.0&quot;,
    &quot;@angular-devkit/build-angular&quot;: &quot;^14.1.0&quot;,
    &quot;@angular/compiler&quot;: &quot;~14.1.0&quot;,
    &quot;@angular/compiler-cli&quot;: &quot;~14.1.0&quot;,
    &quot;@angular/language-service&quot;: &quot;~14.1.0&quot;,
    &quot;@cypress/schematic&quot;: &quot;^2.5.0&quot;,
    &quot;@ionic/angular-toolkit&quot;: &quot;^7.0.0&quot;,
    &quot;@types/jest&quot;: &quot;^28.1.6&quot;,
    &quot;@types/node&quot;: &quot;^12.11.1&quot;,
    &quot;@types/pako&quot;: &quot;^1.0.1&quot;,
    &quot;codelyzer&quot;: &quot;^6.0.2&quot;,
    &quot;cypress&quot;: &quot;latest&quot;,
    &quot;deepmerge&quot;: &quot;^4.2.2&quot;,
    &quot;firebase-tools&quot;: &quot;^11.22.0&quot;,
    &quot;jest&quot;: &quot;^28.1.3&quot;,
    &quot;jest-preset-angular&quot;: &quot;^12.2.0&quot;,
    &quot;protractor&quot;: &quot;~7.0.0&quot;,
    &quot;ts-jest&quot;: &quot;^28.0.7&quot;,
    &quot;ts-node&quot;: &quot;~10.9.1&quot;,
    &quot;tslint&quot;: &quot;~6.1.0&quot;,
    &quot;typescript&quot;: &quot;~4.7.4&quot;
  },
</code></pre>
<p>app.module:</p>
<pre><code>// Angular - Firebase
import { provideAuth, connectAuthEmulator, getAuth } from '@angular/fire/auth';
import { enableIndexedDbPersistence, getFirestore, provideFirestore, connectFirestoreEmulator } from '@angular/fire/firestore';
import { getApp, initializeApp, provideFirebaseApp } from '@angular/fire/app';
import { provideAnalytics, getAnalytics, UserTrackingService, ScreenTrackingService } from '@angular/fire/analytics';

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [
    BrowserModule,
    IonicModule.forRoot(),
    AppRoutingModule,
    provideFirebaseApp(() =&gt; initializeApp(environment.firebaseConfig)),
    provideAuth(() =&gt; {
      const auth = getAuth();

      if (environment.test) {
        console.log('connect auth emulator')
        connectAuthEmulator(auth, 'http://localhost:9099');
      }

      return auth;
    }),
    provideFirestore(() =&gt; {
      const firestore = getFirestore();
      console.log(environment)
      if (environment.test) {
        console.log('use firestore emulator')
        connectFirestoreEmulator(firestore, 'localhost', 8080);
      }

      return firestore;
    }),
    provideAnalytics(() =&gt; getAnalytics()),

    HttpClientModule,     
    CoreModule,
    HomePageModule,
    IonicStorageModule.forRoot(),
    ],
  providers: [
    StatusBar,
    SplashScreen,

    UserTrackingService,    // analytics listens for user changes
    ScreenTrackingService,  // analytics listens for screen changes
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  exports: [],
  bootstrap: [AppComponent],
})
export class AppModule {}
</code></pre>
",https://stackoverflow.com/questions/75447907/firestore-does-not-throw-error-but-does-not-write-data-to-the-emulator,"['angular', 'firebase', 'google-cloud-firestore', 'angularfire']",45,False,1,0
How to remove data-* attribute on production in Razor?,"<p>In many frontend frameworks (like Angular, Vue) I used to use approach of adding &quot;data-cy&quot; attribute for end-to-end testing purposes and removing it during production build (so that they don't pollute the application).</p>
<p>What approach should I use in Razor to achieve the same result?</p>
<p>When I run .NET MVC project locally, I'd like to write:</p>
<p><em>cshtml:</em> <code>@Html.LabelFor(model =&gt; model.Password, data_cy = &quot;here-is-my-label&quot;)</code></p>
<p><em>html:</em> <code>&lt;input class=&quot;form-control&quot; data-cy=&quot;here-is-my-label&quot;&gt;</code></p>
<p>When I deploy to production I'd like to have it to work like that:</p>
<p><em>cshtml:</em> <code>@Html.LabelFor(model =&gt; model.Password, data_cy = &quot;here-is-my-label&quot;)</code></p>
<p><em>html:</em> <code>&lt;input class=&quot;form-control&quot; &gt;</code></p>
<p>I know I can probably write some wrapper or I can overwrite the LabelFor method but I'm looking for a global and clean code solution that would be following good practices.</p>
<p>I'd appreciate especially help of ones who use Razor and Cypress together.</p>
<p>I tried to look at Stack Overflow for some threads about using Razor and Cypress and for general information about having attributes to be environment dependent in Razor but didn't find anything.</p>
<p>I don't want if-else solution like described here: <a href=""https://stackoverflow.com/questions/4696175/preprocessor-directives-in-razor"">Preprocessor directives in Razor</a></p>
",https://stackoverflow.com/questions/75226957/how-to-remove-data-attribute-on-production-in-razor,"['c#', 'html', '.net', 'razor', 'cypress']",104,False,0,0
testing programs that modify and rely on enviroment,"<p>I am writing a rust CLI tool for managing software configurations. Naturally this program relies heavily on the environment in which it runs, looking at certain files their locations and contents as well as environment variables, the users on the system, etc. With some basic functionality implemented I want to start thinking about more advanced tests than the basic unit tests i have implemented. I want to test my application using its CLI in different environments. I have researched end to end testing (i think this is what i want) but everything seems to be oriented toward web development. I have wondered if docker would be suited for this sort of thing, does it have mechanisms that would allow me to prototype an environment to test my application in? Overall i am wondering what the best way to approach this kind of problem is or even if it is a problem in the first place and i should take another approach when testing software like this.</p>
",https://stackoverflow.com/questions/76192762/testing-programs-that-modify-and-rely-on-enviroment,"['testing', 'rust', 'automated-tests']",28,False,0,0
ASP.NET Core WebApplicationFactory.CreateClient does not properly support client side streaming,"<p>I am trying to use WebApplicationFactory for end-to-end testing of a system that consists of few a services with gRPC communication between them, implemented via protobuf-net.grpc. My app logic relies on constantly open stream of client requests using via gRPC streaming.</p>
<p>My problem is that WebApplicationFactory 1) somehow prohibits host binding to local ports so I cannot have my apps under test communicate via regular gRPC, and 2) client created using WebApplicationFactory.CreateClient does not send requests to server until the request stream is closed.</p>
<p>Here are more details...</p>
<p>I create service client the following way:</p>
<ol>
<li>Create factory instance: <code>new WebApplicationFactory&lt;Program&gt;().WithWebHostBuilder(...)</code></li>
<li>Create gRPC channel: <code>channel = GrpcChannel.ForAddress(address, new GrpcChannelOptions { HttpClient = factory.CreateClient() })</code></li>
<li>Create service client: <code>client = channel.CreateGrpcService&lt;TService&gt;()</code></li>
</ol>
<p>What works:</p>
<ol>
<li>Unary call</li>
<li>Client streaming, but server method is being invoked after client closed request stream (in terms of protobuf-net.grpc - the IAsyncEnumerable is exhausted.</li>
</ol>
<p>Problem: in case client stream never closes, requests never make it to server. Perhaps it is related to the fact that WebApplicationFactory.CreateClient creates HTTP/1.1 client, and streaming requires HTTP/2.</p>
<p>For clarity, this is my simplified client stream implementation which I supply to client method, requestQueue a ConcurrentQueue being filled by a different thread:</p>
<pre><code>public async IAsyncEnumerable&lt;TRequest&gt; Write()
{
    while (!ct.IsCancellationRequested)
    {
        if (requestQueue.TryDequeue(out var request))
        {
            yield return request;
        }
        else
        {
            await Task.Delay(10);
        }
    }
}
</code></pre>
<p>Any thoughts are greatly appreciated.</p>
",https://stackoverflow.com/questions/76049574/asp-net-core-webapplicationfactory-createclient-does-not-properly-support-client,"['asp.net-core', 'testing', 'grpc']",51,False,1,0
wifi 6 module uplink single stream UDP with iperf only around 350 Mb/s data throughput,"<p>I use an intel x86 Linux PC and mount a wifi 6 module on it. The module is designed on the WCN6856 chipset.
The Linux kernel is version 5.17 with the ath11k wifi driver. I use the iperf/iperf3 utility to test the capability of the module. Since the HW supports 80MHz bandwidth and 2x2 mimo stream, the physical rate can reach up to 1200 Mb/s.
The uplink data throughput can only reach around 350 Mb/s. However, when I test the downlink, the data rate can reach up to 1 Gb/s and meets the physical capability. As a result, the RF channel should be fine.</p>
<p>Besides, if I use the multiple UDP streams with iperf command -P 6 or 8, the data throughput looks normal as the downlink, around 1 Gb/s.</p>
<p>I build up an end-to-end testing environment. To minimisze the interference from the exsting wifi signal, I have found a shielding environment to test. If everything is normal, the iperf result should be up to 1Gb/s due to some header is removed. I have used the latest wifi FW to conduct the experiment.</p>
<p>The following is the test setup.</p>
<p>|x86 Linux ubuntu 20.04 server|---ethernet---|wifi 6 AP|--- RF cable ---| x86 PC debian 11 with wifi6 module (client)|</p>
<p>command:
on server: iperf -s -u -i 1
on client: iperf -c [server ip] -u -i 1 -b 1200M -P 1</p>
",https://stackoverflow.com/questions/75854188/wifi-6-module-uplink-single-stream-udp-with-iperf-only-around-350-mb-s-data-thro,"['linux-kernel', 'udp', 'debian', 'wifi', 'iperf']",57,False,0,0
"Invoke JUnit 5 test enumeration and/or execute a test from main entry point, especially an AWS Lambda function","<p><strong>WHY</strong>:</p>
<p>Our organization uses JUnit as our test runner, not only for unit tests, but all test phases.  In an effort to accelerate end-to-end testing, especially UI tests, we are exploring ways to increase parallel execution by wrapping our test classes into AWS Lambda functions and invoking them in parallel.</p>
<p><strong>WHY LAMBDA</strong>:</p>
<p>The JUnit Console Launcher allows configuring multiple threads.  Why not just use that?  Short answer is scalability.  Adding threads only works until you exhaust your available CPU.  To increase beyond that, you need more expensive hardware that if underutilized is a waste of money.  But if we just configure the test as a lambda, we can invoke the tests with massive parallelism and reduce test times from hours to minutes.</p>
<p><strong>REQUIREMENTS</strong>:</p>
<p>Given a test class with some number of tests
I want to turn it into a lambda function that does one of two things (depending on how it is called):</p>
<ul>
<li>If called with no parameters, it should enumerate the test cases and return a JSON object that lists the test details</li>
<li>If called specifying a specific test to run, it should trigger that test (with all before and after hooks), and return the results</li>
</ul>
<p><strong>The Ask</strong>:</p>
<ul>
<li><em>Part 1</em> - Java code I can call from my main entry point function that asks JUnit to enumerate all the tests currently visible</li>
<li><em>Part 2</em> - Java code to tell JUnit to trigger a specific test</li>
</ul>
",https://stackoverflow.com/questions/76333739/invoke-junit-5-test-enumeration-and-or-execute-a-test-from-main-entry-point-esp,['junit5'],10,False,0,0
Cypress test setup for Azure AD B2C login with custom policy,"<h1>Setup</h1>
<ul>
<li>Azure AD B2C with custom policies (B2C_1A_SIGNIN)</li>
<li>React frontend</li>
<li>MSAL to implement the authentication (@azure/msal-browser: 2.37.0, @azure/msal-react:1.5.7) - using loginRedirect() (no MFA)</li>
<li>Cypress (v12.5.1) for e2e tests</li>
</ul>
<h1>What I did</h1>
<p>I implemented authentication for my frontend app via the MSAL library, created an app registration for my app, added the redirect URIs and the custom login policy. The whole login flow works pretty well, I get my token, everything is fine.</p>
<h1>The problem</h1>
<p>I'm using cypress for e2e tests and now (since I implemented authentication) I have to update all of my tests of course, as all of my tests expect to be already logged in.</p>
<p>And this is the part where it gets tricky. If I get things right, the preferred way is to add a login() command to my cypress config, that does the whole login stuff only once before the tests are executed.</p>
<h1>What I tried so far</h1>
<h2>1. Acquiring a token non-interactively</h2>
<p>I followed this guide <a href=""https://blog.mechanicalrock.io/2022/08/08/azure-ad-authentication-cypress.html"" rel=""nofollow noreferrer"">https://blog.mechanicalrock.io/2022/08/08/azure-ad-authentication-cypress.html</a> to request a token for my test user via api instead of interactively challenging the user for his credentials.</p>
<h3>Default endpoint</h3>
<p>At first I tested Microsofts default endpoint <a href=""https://login.microsoftonline.com"" rel=""nofollow noreferrer"">https://login.microsoftonline.com</a> via postman:</p>
<pre><code>POST: https://login.microsoftonline.com/&lt;b2cTenantId&gt;/oauth2/v2.0/token
body: {
  grant_type:password
  client_id:&lt;applicationId&gt;
  client_secret:&lt;clientSecret&gt;
  scope:openid profile email
  username:&lt;testUsername&gt;
  password:&lt;testUserPassword&gt;
}
</code></pre>
<p>This worked and I got an Id-Token and an access token. Problem here is that this token does not work with my custom sign in policy.</p>
<h3>Custom endpoint</h3>
<p>So I tried the same for my custom policies endpoint:</p>
<pre><code>POST: https://&lt;b2cDomain&gt;.b2clogin.com/&lt;b2cdomain&gt;.onmicrosoft.com/B2C_1A_SIGNIN/oauth2/v2.0/token?p=B2C_1A_SIGNIN
body: {
  grant_type:password
  client_id:&lt;applicationId&gt;
  client_secret:&lt;clientSecret&gt;
  scope:openid profile email
  username:&lt;testUsername&gt;
  password:&lt;testUserPassword&gt;
}
</code></pre>
<p>But for that request I get the following error:</p>
<pre><code>{
  &quot;error&quot;: &quot;invalid_request&quot;,
  &quot;error_description&quot;: &quot;AADB2C90055: The scope 'openid profile email' provided in request must specify a resource, such as 'https://example.com/calendar.read'.\r\nCorrelation ID: &lt;someId&gt; \r\nTimestamp: 2023-05-12 14:03:41Z\r\n&quot;
}
</code></pre>
<p>I also tried it without a scope, but the endpoint does expect a scope. So either this way does not work with custom policies or I am doing something wrong.</p>
<h2>2. Filling the login form via cypress</h2>
<p>The second approach that I tried was to handle the real frontend sign in flow via cypress. But somehow it seems that cypress doesn't like the redirection way of signing in. I followed basically this guide <a href=""https://docs.cypress.io/guides/end-to-end-testing/azure-active-directory-authentication"" rel=""nofollow noreferrer"">https://docs.cypress.io/guides/end-to-end-testing/azure-active-directory-authentication</a> which is not specialized on custom policies.</p>
<p>My latest testing code (including the tip to use cy.origin() from here <a href=""https://stackoverflow.com/questions/64553275/cypress-wait-for-redirection-after-login"">cypress wait for redirection after login</a>) was:</p>
<pre><code>cy.visit('http://localhost:3000');
cy.origin(
'https://&lt;b2cDomain&gt;.b2clogin.com',
{
  args: {},
},
() =&gt; {
  cy.url().should('contain', 'https://&lt;b2cDomain&gt;.b2clogin.com');
  cy.get('input[id=&quot;signInName&quot;]').type(Cypress.env('AZURE_TEST_USERNAME'), {
    log: false,
  });
  cy.get('input[id=&quot;password&quot;]').type(Cypress.env('AZURE_TEST_PASSWORD'), {
    log: false,
  });
  cy.get('button[id=&quot;next&quot;]').click();
}
);

// cy.wait(1000);
cy.url().should('contain', 'http://localhost:3000');
</code></pre>
<p>The thing that annoys me the most is, that the code seems to work (when looking at the execution video), but that the tests fail anyway. And they fail on a very early point. It seems to me that it's somehow an asynchronous problem. But anyway: the error message does not make any sense to me:</p>
<p><a href=""https://i.stack.imgur.com/xHIwU.png"" rel=""nofollow noreferrer""><img src=""https://i.stack.imgur.com/xHIwU.png"" alt=""Cypress error log"" /></a></p>
<p>Testing around made me feel that cypress does not properly handle the redirect, but I have no idea how it could work.</p>
<p>And now I don't know which approach is more promising. <strong>I appreciate any hints or alternative solutions</strong>.</p>
",https://stackoverflow.com/questions/76237332/cypress-test-setup-for-azure-ad-b2c-login-with-custom-policy,"['azure', 'azure-ad-b2c', 'e2e-testing', 'azure-ad-b2c-custom-policy', 'cypress-testing-library']",99,True,2,1
