# Angular and Cypress

**URL:** <https://community.firebasestudio.dev/t/angular-and-cypress/112>\
**Category:** General\
**Created:** [May 17, 2024, 4:54am UTC](https://community.firebasestudio.dev/t/angular-and-cypress/112 "2024-05-17T04:54:50Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Daniel\_Cornejo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.firebasestudio.dev/daniel_cornejo/32/92_2.png) [@Daniel\_Cornejo](https://community.firebasestudio.dev/u/Daniel_Cornejo)\
**Post date:** [May 17, 2024, 4:54am UTC](https://community.firebasestudio.dev/t/angular-and-cypress/112/1 "2024-05-17T04:54:50Z")

</div>

So I’m trying to implement end-to-end testing in my angular app. To do this I have installed cypress by installing the AngularCLI and then running `ng e2e`, after that I selected Crypress to finally run some e2e tests. After all the dependencies were installed by the CLI y runned again the command `ng e2e` but it crashed because the environment did not have the required system dependencies installed. After a bit of research I found a NixOS package called cypress and I added it to the dev.nix file in the packages array.

With all this setup I have been trying to rebuild the environment, but it gets stuck in the “Building environment” step.

Has anybody accomplished running e2e test with Cypress here? Is there even a way to run this kind of tests with Cypress?

---

<div class="post-metadata">

**Author:** ![kirupac](https://sea2.discourse-cdn.com/flex002/user_avatar/community.firebasestudio.dev/kirupac/32/5_2.png) [@kirupac](https://community.firebasestudio.dev/u/kirupac)\
**Post date:** [May 17, 2024, 4:51pm UTC](https://community.firebasestudio.dev/t/angular-and-cypress/112/2 "2024-05-17T16:51:11Z")

</div>

Hi @Daniel_Cornejo - can you please share your dev.nix file?

I have personally not tried using Cypress before, but the general idea is that all of these activities should work in IDX. If it doesn’t, there is something we need to to fix/improve to make sure it works well 🛠

Thanks,  
Kirupa

---

<div class="post-metadata">

**Author:** ![Daniel\_Cornejo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.firebasestudio.dev/daniel_cornejo/32/92_2.png) [@Daniel\_Cornejo](https://community.firebasestudio.dev/u/Daniel_Cornejo)\
**Post date:** [May 17, 2024, 7:02pm UTC](https://community.firebasestudio.dev/t/angular-and-cypress/112/3 "2024-05-17T19:02:33Z")

</div>

Hi @kirupac of course, here’s my dev.nix file

```auto
# To learn more about how to use Nix to configure your environment
# see: https://developers.google.com/idx/guides/customize-idx-env
{ pkgs, ... }: {
  # Which nixpkgs channel to use.
  channel = "stable-23.11"; # or "unstable"
  # Use https://search.nixos.org/packages to find packages
  packages = [
    pkgs.nodejs_20
    pkgs.cypress
  ];
  # Sets environment variables in the workspace
  env = {};
  idx = {
    # Search for the extensions you want on https://open-vsx.org/ and use "publisher.id"
    extensions = [
      "angular.ng-template"
    ];
    workspace = {
      # Runs when a workspace is first created with this `dev.nix` file
      onCreate = {
        npm-install = "npm install --no-audit --prefer-offline";
      };
      # To run something each time the workspace is (re)started, use the `onStart` hook
    };
    # Enable previews and customize configuration
    previews = {
      enable = true;
      previews = {
        web = {
          command = ["npm" "run" "start" "--" "--port" "$PORT" "--host" "0.0.0.0" "--disable-host-check"];
          manager = "web";
        };
      };
    };
  };
}

```

---

<div class="post-metadata">

**Author:** ![Rik](https://sea2.discourse-cdn.com/flex002/user_avatar/community.firebasestudio.dev/rik/32/380_2.png) [@Rik](https://community.firebasestudio.dev/u/Rik)\
**Post date:** [June 2, 2024, 6:37pm UTC](https://community.firebasestudio.dev/t/angular-and-cypress/112/4 "2024-06-02T18:37:41Z")

</div>

Experiencing the exact same problem. Can’t access my environment anymore. It’s a days work , that i can’t reach to copy or move.

Is it possible to change the nix file and remove the package, so that i can access my code?

---

<div class="post-metadata">

**Author:** ![Daniel\_Cornejo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.firebasestudio.dev/daniel_cornejo/32/92_2.png) [@Daniel\_Cornejo](https://community.firebasestudio.dev/u/Daniel_Cornejo)\
**Post date:** [June 3, 2024, 5:13pm UTC](https://community.firebasestudio.dev/t/angular-and-cypress/112/5 "2024-06-03T17:13:23Z")

</div>

Right now the only way I had found is changing it from git directly, of course your code must have been in a repo for this to work

---

<div class="post-metadata">

**Author:** ![gameirozachary](https://sea2.discourse-cdn.com/flex002/user_avatar/community.firebasestudio.dev/gameirozachary/32/448_2.png) [@gameirozachary](https://community.firebasestudio.dev/u/gameirozachary)\
**Post date:** [June 7, 2024, 2:07pm UTC](https://community.firebasestudio.dev/t/angular-and-cypress/112/6 "2024-06-07T14:07:19Z")

</div>

Will it fetch & pull in the background automatically or are you saying just clone a new repo.

Do you think there is a way to access the VM idx runs on from gcloud console? I’m thinking there might be a bucket with the .nix file.

I tried opening another project and seeing if I could navigate to my original one in the command line just and opening the nix configuration right from the terminal. I think they’re not one one machine so everything is isolated.

---

<div class="post-metadata">

**Author:** ![Rik](https://sea2.discourse-cdn.com/flex002/user_avatar/community.firebasestudio.dev/rik/32/380_2.png) [@Rik](https://community.firebasestudio.dev/u/Rik)\
**Post date:** [June 7, 2024, 2:28pm UTC](https://community.firebasestudio.dev/t/angular-and-cypress/112/7 "2024-06-07T14:28:19Z")

</div>

They are working to fix an identified bug related to this build error. Hopefully next release, It looks like they release (bi-weekly)

---

<div class="post-metadata">

**Author:** ![gameirozachary](https://sea2.discourse-cdn.com/flex002/user_avatar/community.firebasestudio.dev/gameirozachary/32/448_2.png) [@gameirozachary](https://community.firebasestudio.dev/u/gameirozachary)\
**Post date:** [June 21, 2024, 1:02am UTC](https://community.firebasestudio.dev/t/angular-and-cypress/112/8 "2024-06-21T01:02:54Z")

</div>

Rik go try now. I got in.

---

<div class="post-metadata">

**Author:** ![Rik](https://sea2.discourse-cdn.com/flex002/user_avatar/community.firebasestudio.dev/rik/32/380_2.png) [@Rik](https://community.firebasestudio.dev/u/Rik)\
**Post date:** [June 21, 2024, 6:14am UTC](https://community.firebasestudio.dev/t/angular-and-cypress/112/9 "2024-06-21T06:14:04Z")

</div>

I didn’t get in without clicking the recovery button.  
But i was able to remove cypress package, which solves the issue.

Thanks!
