CODEWITHSUNDEEP
angularrxjsngrx
edbras
edbras

Reputation: 4404

How to find after Angular upgrade 16: NG0600: Writing to signals is not allowed in a `computed` or an `effect`

After upgrading to angular 16, I get the following error:

NG0600: Writing to signals is not allowed in a `computed` or an `effect` by default. Use `allowSignalWrites` in the `CreateEffectOptions` to enable these inside effects.

Please some help in solving this? I understand the error, but can not find where. Played around with the rxjs asapscheduler to break up sync behavior that I read about in other posts, but that only moved the problem to other method calls. I don't use Signal at all yet after the upgrade. I only use a few ngrx effects during the login and for upading the breadcrumb.

The interesting part of the stacktrace in the browser console that touches my code:

.....
    dispatch       @vendor.js:275274
    dispatch       @vendor.js:267855
    getWithQuery   @vendor.js:267952
    getWithQuery   @vendor.js:268740
    byGroups       @apps_portal_src_app_…ent_module_ts.js:98
    (anonymous)    @apps_portal_src_app_…nt_module_ts.js:729
    doInnerSub     @vendor.js:99223
    outerNext      @vendor.js:99218
...

And the code part that the stack trace is referring to is:

  ngOnInit() {
    this.assessment$ = this.assessmentService.getAll().pipe(
      mergeMap((assessments) => this.findOrCreateNewAssessment(assessments)), map((assessment) => ({
        ...assessment, groups: this.sort(assessment.groups.map((group) => ({...group, order: group.order.toString()}))),
      })), tap((assessment) => this.initAssessment(assessment)), shareReplay());

    const questions$ = this.questionSubject$.pipe(
      mergeMap((groups) => this.questionService.byGroups(groups.map((g) => g.id))), map((groups) => this.sort(groups)),
      shareReplay());

    this.questionsByGroup$ = questions$.pipe(map((questions) => groupAssessmentQuestions(questions)), shareReplay());

    this.answers$ = questions$.pipe(
      mergeMap((questions) => (arrayIsEmpty(questions) ? of([]) : this.answerService.byQuestions(questions))),
      shareReplay());

    this.rootFormGroup$ = this.questionsByGroup$.pipe(
      mergeMap((questions) => this.answers$.pipe(map((answers) => this.createRootFormGroup(questions, answers)))),
      shareReplay());
  }

Details about the variables in the above method: assessmentService, answerService standard are Ngrx data services that extend from EntityCollectionServiceBase.

private questionSubject$ = new BehaviorSubject<AssessmentGroup[]>(undefined);
questionsByGroup$: Observable<AssessmentQuestionsByGroup[]>;

Please help how to find the cause and solve this? If info/code is missing, please let me know and I will update the question

Upvotes: 3

Views: 9563

Answers (1)

timdeschryver
timdeschryver

Reputation: 15505

You can take a look at the following discussion. It provides more context, why, and a fix.

https://github.com/ngrx/platform/issues/3892#issuecomment-1542791068

Upvotes: 0

Related Questions