bahmutov / bahmutov/cypress-angular-unit-test

SocketCt#startListening must first be called before accessing 'this.io'

Open
#681 3 comments 1 reaction 0 assignees View on GitHub
🐛 bug
Dominant language
TypeScript
Stars
160
Forks
32
PR merge metrics
No merged PRs in 30d

Description

### Current behavior

I followed the README instructions to setup Cypress component testing with Angular 12 (followed the Webpack 5 instructions).

When I execute `npx cypress open-ct` I get the error: `SocketCt#startListening must first be called before accessing 'this.io'`

```
$ npx cypress open-ct
[71661:1105/113101.194050:ERROR:node_bindings.cc(278)] Most NODE_OPTIONs are not supported in packaged apps. See documentation for more details.
ℹ 「wds」: Project is running at http://localhost:57484/webpack-dev-server/
ℹ 「wds」: webpack output is served from /__cypress/src
ℹ 「wds」: Content not from webpack is served from /Users/myuser/Repos/myproject
Error: SocketCt#startListening must first be called before accessing 'this.io'
at SocketCt.ensureProp (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/util/class-helpers.js:14:15)
at SocketCt.get io [as io] (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/socket-base.js:53:21)
at SocketCt.toRunner (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/socket-base.js:59:21)
at EventEmitter. (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/socket-ct.js:13:18)
at EventEmitter.emit (events.js:376:20)
at EventEmitter. (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/dev-server.js:16:17)
at EventEmitter.emit (events.js:376:20)
at ChildProcess. (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:19:22)
at ChildProcess.emit (events.js:376:20)
at emit (internal/child_process.js:910:12)
at processTicksAndRejections (internal/process/task_queues.js:83:21)

Error: SocketCt#startListening must first be called before accessing 'this.io'
at SocketCt.ensureProp (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/util/class-helpers.js:14:15)
at SocketCt.get io [as io] (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/socket-base.js:53:21)
at SocketCt.toRunner (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/socket-base.js:59:21)
at EventEmitter. (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/socket-ct.js:13:18)
at EventEmitter.emit (events.js:376:20)
at EventEmitter. (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/dev-server.js:16:17)
at EventEmitter.emit (events.js:376:20)
at ChildProcess. (/Users/myuser/Library/Caches/Cypress/8.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:19:22)
at ChildProcess.emit (events.js:376:20)
at emit (internal/child_process.js:910:12)
at processTicksAndRejections (internal/process/task_queues.js:83:21)
```

### Desired behavior
I would want to see the Cypress window to be able to run the new cy-spec tests

### Test code to reproduce
If the code above is not enough to troubleshoot, let me know to put together a working sample. My company's project is large and confidential, so this would take time.

### Versions

#### From package.json:

```
"@cypress/webpack-dev-server": "^1.7.0",
"cypress": "^8.7.0",
"cypress-angular-unit-test": "^3.9.0",
"html-webpack-plugin": "^5.5.0",
"typescript": "~4.3.5",
```

#### Angular:

```
$ ng version
Your global Angular CLI version (13.0.1) is greater than your local version (12.2.6). The local Angular CLI version is used.

To disable this warning use "ng config -g cli.warnings.versionMismatch false".

_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/

Angular CLI: 12.2.6
Node: 14.18.0
Package Manager: npm 6.14.15
OS: darwin x64

Angular: 12.2.6
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, material, material-moment-adapter, platform-browser
... platform-browser-dynamic, router, upgrade

Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1202.6
@angular-devkit/build-angular 12.2.6
@angular-devkit/core 12.2.6
@angular-devkit/schematics 12.2.6
@schematics/angular 12.2.6
rxjs 6.5.5
typescript 4.3.5
```

#### Other:
- Browser: Chrome Version 95.0.4638.69 (Official Build) (arm64)
- Operating System: MacOs Big sur 11.6
- CI Provider: N/A because it's running locally

Contributor guide

No contributing guide indexed for this repository

Research direction

Start with the README's Angular 12 Webpack 5 instructions and reproduce the reported `npx cypress open-ct` command using the listed package and environment versions. Trace the component-testing startup path around the reported SocketCt error; done means the Cypress window opens and the new cy-spec tests can run.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, cypress, typescript
Domain
frontend, testing-qa
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.