title: Error: Unexpected value 'FormGroup' declared by the module 'DynamicTestModule'
body: <p>Our project structure follows this: <a href="https://github.com/AngularClass/angular2-webpack-starter" rel="noreferrer">Angular2-webpack-starter</a>.</p>
  
  <p>Our project successfully compiles, build and can be seen in the browser. No problems here.</p>
  
  <p>But when we try to run the test cases using <code>karma and jasmine</code> we are getting this error.</p>
  
  <pre><code>XXXXComponent
     :heavy_multiplication_x: Should Match Current Tab as 1
       Chrome 55.0.2883 (Mac OS X 10.10.5)
     Error: Unexpected value 'FormGroup' declared by the module 'DynamicTestModule'
         at SyntaxError.ZoneAwareError (webpack:///~/zone.js/dist/zone.js:811:0 &lt;- config/spec-bundle.js:74048:33)
         at SyntaxError.BaseError [as constructor] (webpack:///~/@angular/compiler/src/facade/errors.js:26:0 &lt;- config/spec-bundle.js:78913:16)
         at new SyntaxError (webpack:///~/@angular/compiler/src/util.js:151:0 &lt;- config/spec-bundle.js:6408:16)
         at webpack:///~/@angular/compiler/src/metadata_resolver.js:475:0 &lt;- config/spec-bundle.js:19829:40
         at Array.forEach (native)
         at CompileMetadataResolver.getNgModuleMetadata (webpack:///~/@angular/compiler/src/metadata_resolver.js:457:0 &lt;- config/spec-bundle.js:19811:54)
         at JitCompiler._loadModules (webpack:///~/@angular/compiler/src/jit/compiler.js:165:25 &lt;- config/spec-bundle.js:55462:64)
         at JitCompiler._compileModuleAndAllComponents (webpack:///~/@angular/compiler/src/jit/compiler.js:144:25 &lt;- config/spec-bundle.js:55441:52)
         at JitCompiler.compileModuleAndAllComponentsSync (webpack:///~/@angular/compiler/src/jit/compiler.js:98:0 &lt;- config/spec-bundle.js:55395:21)
         at TestingCompilerImpl.compileModuleAndAllComponentsSync (webpack:///~/@angular/compiler/bundles/compiler-testing.umd.js:482:0 &lt;- config/spec-bundle.js:78583:35)
         at TestBed._initIfNeeded (webpack:///~/@angular/core/bundles/core-testing.umd.js:761:0 &lt;- config/spec-bundle.js:26731:40)
         at TestBed.createComponent (webpack:///~/@angular/core/bundles/core-testing.umd.js:844:0 &lt;- config/spec-bundle.js:26814:18)
         at Function.TestBed.createComponent (webpack:///~/@angular/core/bundles/core-testing.umd.js:673:0 &lt;- config/spec-bundle.js:26643:33)
         at Object.&lt;anonymous&gt; (webpack:///src/app/zzzz/yyyy/xxxx.component.spec.ts:20:0 &lt;- config/spec-bundle.js:93231:37)
         at ZoneDelegate.invoke (webpack:///~/zone.js/dist/zone.js:242:0 &lt;- config/spec-bundle.js:73479:26)
         at ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:79:0 &lt;- config/spec-bundle.js:73133:39)
         at ZoneDelegate.invoke (webpack:///~/zone.js/dist/zone.js:241:0 &lt;- config/spec-bundle.js:73478:32)
         at Zone.run (webpack:///~/zone.js/dist/zone.js:113:0 &lt;- config/spec-bundle.js:73350:43)
         at Object.&lt;anonymous&gt; (webpack:///~/zone.js/dist/jasmine-patch.js:102:0 &lt;- config/spec-bundle.js:72848:34)
         at ZoneQueueRunner.jasmine.QueueRunner.ZoneQueueRunner.execute (webpack:///~/zone.js/dist/jasmine-patch.js:132:0 &lt;- config/spec-bundle.js:72878:42)
         at ZoneQueueRunner.jasmine.QueueRunner.ZoneQueueRunner.execute (webpack:///~/zone.js/dist/jasmine-patch.js:132:0 &lt;- config/spec-bundle.js:72878:42)
         at webpack:///~/zone.js/dist/jasmine-patch.js:129:91 &lt;- config/spec-bundle.js:72875:130
         at ZoneDelegate.invokeTask (webpack:///~/zone.js/dist/zone.js:275:0 &lt;- config/spec-bundle.js:73512:35)
         at Zone.runTask (webpack:///~/zone.js/dist/zone.js:151:0 &lt;- config/spec-bundle.js:73388:47)
         at drainMicroTaskQueue (webpack:///~/zone.js/dist/zone.js:433:0 &lt;- config/spec-bundle.js:73670:35)
  </code></pre>
  
  <p>We have imported all these modules in the app.module.ts as required by new angular convention.</p>
  
  <pre><code>import { FormsModule, ReactiveFormsModule } from '@angular/forms';
  @NgModule({
    bootstrap: [ AppComponent ],
    declarations: [
      ...
    ],
    imports: [ // import Angular's modules
      ...
      BrowserModule,
      FormsModule,
      HttpModule,
      ReactiveFormsModule,
      ... ],
    providers: [ // expose our Services and Providers into Angular's dependency injection
      ENV_PROVIDERS,
      APP_PROVIDERS
    ],
    schemas: [
      CUSTOM_ELEMENTS_SCHEMA
    ]
  })
  export class AppModule {
    constructor() {}
  } 
  </code></pre>
  
  <p>Our testBed is setup in this way</p>
  
  <pre><code>TestBed.configureTestingModule({
     imports: [ReactiveFormsModule, FormsModule],
     declarations: [ FormGroup, XXXXComponent ], // declare the test   component
  });
  
    fixture = TestBed.createComponent(XXXXComponent);
    comp = fixture.componentInstance; 
  });
  </code></pre>
  
  <p>and also</p>
  
  <pre><code>testing.TestBed.initTestEnvironment(
    browser.BrowserDynamicTestingModule,
    browser.platformBrowserDynamicTesting()
  );
  </code></pre>
  
  <p>We have all the latest versions of packages installed.</p>
  
  <pre><code>"@angular/common": "~2.4.3",
  "@angular/compiler": "~2.4.3",
  "@angular/core": "~2.4.3",
  "@angular/forms": "~2.4.3",
  "@angular/http": "~2.4.3",
  "@angular/material": "2.0.0-beta.1",
  "@angular/platform-browser": "~2.4.3",
  "@angular/platform-browser-dynamic": "~2.4.3",
  "@angular/platform-server": "~2.4.3",
  "@angular/router": "~3.4.3",
  "karma": "^1.2.0",
  "karma-chrome-launcher": "^2.0.0",
  "karma-coverage": "^1.1.1",
  "karma-jasmine": "^1.0.2",
  "karma-remap-coverage": "^0.1.4",
  "karma-sourcemap-loader": "^0.3.7",
  "karma-webpack": "2.0.1",
  "webpack": "2.2.0",
  "webpack-dev-middleware": "^1.9.0",
  "webpack-dev-server": "2.2.0",
  "webpack-dll-bundles-plugin": "^1.0.0-beta.5",
  "webpack-md5-hash": "~0.0.5",
  "webpack-merge": "~2.4.0"
  </code></pre>
  
  <p>Any help in resolving this issue is appreciated. </p>