If I post a message and return to the chats list I get
Unhandled Rejection (Error): can't define array index property past the end of an array with non-writable length
ApolloError
browser error
```log
Unhandled Rejection (Error): can't define array index property past the end of an array with non-writable length
ApolloError
src/errors/index.ts:49
46 | // Constructs an instance of ApolloError given a GraphQLError
47 | // or a network error. Note that one of these has to be a valid
48 | // value or the constructed error will be meaningless.
> 49 | constructor({
| ^ 50 | graphQLErrors,
51 | networkError,
52 | errorMessage,
next
src/core/QueryManager.ts:217
214 | update: updateWithProxyFn,
215 | });
216 | } catch (e) {
> 217 | error = new ApolloError({
| ^ 218 | networkError: e,
219 | });
220 | return;
iterateObserversSafely/<
src/utilities/observables/iteration.ts:13
10 | // to just the observers with the given method.
11 | const observersWithMethod: Observer[] = [];
12 | observers.forEach(obs => obs[method] && observersWithMethod.push(obs));
> 13 | observersWithMethod.forEach(obs => (obs as any)[method](argument));
14 | }
15 |
iterateObserversSafely
src/utilities/observables/iteration.ts:13
10 | // to just the observers with the given method.
11 | const observersWithMethod: Observer[] = [];
12 | observers.forEach(obs => obs[method] && observersWithMethod.push(obs));
> 13 | observersWithMethod.forEach(obs => (obs as any)[method](argument));
14 | }
15 |
next
src/utilities/observables/Concast.ts:171
168 | next: (result: T) => {
169 | if (this.sub !== null) {
170 | this.latest = ["next", result];
> 171 | iterateObserversSafely(this.observers, "next", result);
| ^ 172 | }
173 | },
174 |
createHttpLink/ {
141 | // we have data and can send it to back up the link chain
> 142 | observer.next(result);
| ^ 143 | observer.complete();
144 | return result;
145 | })
```
I have checked the server via Playground, it works.
By using the debugger I was able to locate the line in ChatRoomScreen/index.tsx:
fullChat.messages.push(data.addMessage);
fullChat.lastMessage = data.addMessage; // <- is not reached.
I don't know how to go about this. Maybe somebody experienced the same issue and wants to share his or her solution.
Hi! I tried to recreate the client with the latest dependencies, meaning
package.json
```json { "name": "whatsapp-clone-client", "version": "0.1.0", "private": true, "dependencies": { "@apollo/react-hooks": "^4.0.0", "@graphql-codegen/add": "2.0.2", "@graphql-codegen/typescript": "1.21.1", "@graphql-codegen/typescript-operations": "1.17.15", "@graphql-codegen/typescript-react-apollo": "2.2.2", "@material-ui/core": "^4.11.3", "@material-ui/icons": "^4.11.2", "@testing-library/jest-dom": "^5.11.9", "@testing-library/react": "^11.2.5", "@testing-library/user-event": "^12.1.10", "@types/history": "^4.7.8", "@types/jest": "^26.0.20", "@types/node": "^12.0.0", "@types/react": "^17.0.0", "@types/react-dom": "^17.0.0", "@types/react-router-dom": "^5.1.7", "@types/styled-components": "^5.1.7", "add": "^2.0.6", "apollo-cache-inmemory": "^1.6.6", "apollo-client": "^2.6.10", "apollo-link": "^1.2.14", "apollo-link-http": "^1.5.17", "graphql": "^15.5.0", "graphql-tag": "^2.11.0", "history": "^5.0.0", "jest-fetch-mock": "^3.0.3", "moment": "^2.29.1", "prettier": "^2.2.1", "react": "^17.0.1", "react-dom": "^17.0.1", "react-router-dom": "^5.2.0", "react-router-transition": "^2.1.0", "react-scripts": "4.0.3", "styled-components": "^5.2.1", "typescript": "^4.1.2", "web-vitals": "^1.0.1", "yarn": "^1.22.10" }, "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject", "format": "prettier \"**/*.{ts,tsx,css,graphql}\" --write", "codegen": "graphql-codegen" }, "eslintConfig": { "extends": [ "react-app", "react-app/jest" ] }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] }, "jest": { "transform": { "^.+\\.(js|jsx|ts|tsx)$": "/node_modules/ts-jest"
},
"transformIgnorePatterns": [
"node_modules/(?!(react-router-transition)/)"
],
"resetMocks": false
},
"devDependencies": {
"@graphql-codegen/cli": "1.21.2",
"apollo-link-mock": "^1.0.1",
"ts-jest": "^26.5.3"
}
}
```
If I post a message and return to the chats list I get
browser error
```log Unhandled Rejection (Error): can't define array index property past the end of an array with non-writable length ApolloError src/errors/index.ts:49 46 | // Constructs an instance of ApolloError given a GraphQLError 47 | // or a network error. Note that one of these has to be a valid 48 | // value or the constructed error will be meaningless. > 49 | constructor({ | ^ 50 | graphQLErrors, 51 | networkError, 52 | errorMessage, next src/core/QueryManager.ts:217 214 | update: updateWithProxyFn, 215 | }); 216 | } catch (e) { > 217 | error = new ApolloError({ | ^ 218 | networkError: e, 219 | }); 220 | return; iterateObserversSafely/< src/utilities/observables/iteration.ts:13 10 | // to just the observers with the given method. 11 | const observersWithMethod: Observer[] = [];
12 | observers.forEach(obs => obs[method] && observersWithMethod.push(obs));
> 13 | observersWithMethod.forEach(obs => (obs as any)[method](argument));
14 | }
15 |
iterateObserversSafely
src/utilities/observables/iteration.ts:13
10 | // to just the observers with the given method.
11 | const observersWithMethod: Observer[] = [];
12 | observers.forEach(obs => obs[method] && observersWithMethod.push(obs));
> 13 | observersWithMethod.forEach(obs => (obs as any)[method](argument));
14 | }
15 |
next
src/utilities/observables/Concast.ts:171
168 | next: (result: T) => {
169 | if (this.sub !== null) {
170 | this.latest = ["next", result];
> 171 | iterateObserversSafely(this.observers, "next", result);
| ^ 172 | }
173 | },
174 |
createHttpLink/ {
141 | // we have data and can send it to back up the link chain
> 142 | observer.next(result);
| ^ 143 | observer.complete();
144 | return result;
145 | })
```
I have checked the server via Playground, it works.
By using the debugger I was able to locate the line in
ChatRoomScreen/index.tsx:I don't know how to go about this. Maybe somebody experienced the same issue and wants to share his or her solution.