@schematics/angular error: addProviderToModule error when using interceptor

[bsdfzzzy]

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request

Command (mark with an x)

- [ ] new
- [ ] build
- [ ] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions

npm 6.4.1,
Angular CLI: 7.1.0
Node: 10.13.0
OS: darwin x64

Repro steps

My schematics index.ts file:

import {
  Rule,
  chain,
  noop,
  Tree,
  SchematicsException
} from '@angular-devkit/schematics';
import { buildComponent } from '../utils/build-component';
import { Schema } from './schema';
import { addProviderToModule } from '@schematics/angular/utility/ast-utils';
import { findModuleFromOptions } from '../utils/ast';
import { InsertChange } from '@schematics/angular/utility/change';
import * as ts from 'typescript';
import { strings } from '@angular-devkit/core';
import { buildRelativePath } from '@schematics/angular/utility/find-module';
import { parseName } from '@schematics/angular/utility/parse-name';

export function EventSourceSchematic(options: Schema): Rule {
  return chain([
    buildComponent({ ...options }),
    options.skipImport ? noop() : addEventSourceToModule(options)
  ]);
}

function addEventSourceToModule(options: Schema) {
  return (host: Tree) => {
    const modulePath = findModuleFromOptions(host, options)!;
    const parsedPath = parseName(options.path as string, options.name);

    options.name = parsedPath.name;
    options.path = parsedPath.path;

    const text = host.read(modulePath);
    if (text === null) {
      throw new SchematicsException(`File ${modulePath} does not exist.`);
    }
    const sourceText = text.toString('utf-8');
    const source = ts.createSourceFile(
      modulePath,
      sourceText,
      ts.ScriptTarget.Latest,
      true,
      ts.ScriptKind.TS
    );
    const servicePath =
      `/${options.path}/` +
      (options.flat ? '' : strings.dasherize(options.name) + '/') +
      strings.dasherize(options.name) +
      '.service';
    const relativePath = buildRelativePath(modulePath, servicePath);
    const classifiedName = strings.classify(`${options.name}Service`);
    const serviceChanges = addProviderToModule(
      source as any,
      modulePath,
      classifiedName,
      relativePath
    );
    const serviceRecorder = host.beginUpdate(modulePath);
    for (const change of serviceChanges) {
      if (change instanceof InsertChange) {
        serviceRecorder.insertRight(change.pos, change.toAdd);
      }
    }
    host.commitUpdate(serviceRecorder);

    return host;
  };
}

Target Module:

import { NgModule } from '@angular/core';
import { HTTP_INTERCEPTORS } from '@angular/common/http';

import { AuthInterceptor } from './interceptors/auth.interceptor';
import { HttpErrorInterceptor } from './interceptors/http-error.interceptor';

@NgModule({
  imports: [],
  declarations: [],
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: HttpErrorInterceptor,
      multi: true
    },
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthInterceptor,
      multi: true
    }
  ],
  exports: [],
})
export class CoreModule {}

The log given by the failure

After running ng g schematics:es core/event-source which depends on my project. The target module file will be rerendered as follow:

import { NgModule } from '@angular/core';
import { HTTP_INTERCEPTORS } from '@angular/common/http';

import { AuthInterceptor } from './interceptors/auth.interceptor';
import { HttpErrorInterceptor } from './interceptors/http-error.interceptor';
import { EventSourceService } from './event-source/event-source.service';

@NgModule({
  imports: [],
  declarations: [],
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: HttpErrorInterceptor,
      multi: true
    },
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthInterceptor,
      multi: true,
      providers: [EventSourceService]
    }
  ],
  exports: [],
})
export class CoreModule {}

Desired functionality

Desired target module file is:

import { NgModule } from '@angular/core';
import { HTTP_INTERCEPTORS } from '@angular/common/http';

import { AuthInterceptor } from './interceptors/auth.interceptor';
import { HttpErrorInterceptor } from './interceptors/http-error.interceptor';
import { EventSourceService } from './event-source/event-source.service';

@NgModule({
  imports: [],
  declarations: [],
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: HttpErrorInterceptor,
      multi: true
    },
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthInterceptor,
      multi: true
    },
    EventSourceService
  ],
  exports: [],
})
export class CoreModule {}

Mention any other details that might be useful

I will give a pull request soon to fix that problem, please check and feedback to me.

[bsdfzzzy]

I make a pull request #13081.
Thank you for reading this. I hope it could be fixed as soon as possible!

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}