TypeScript/Angular2: tagDef.requireExtraParent is not a function

Question

Researching the error,

"EXCEPTION: TypeError: tagDef.requireExtraParent is not a function"

and it actually returns 0 results on Google.

Background:

• site works fine on Chrome and Safari. haven't tested IE yet. whole separate nightmare there.
• error is only for Firefox (seems all versions. Currently on 45 though)
• I'm converting from TypeScript down to ES5 using System, following along with the Angular quickstart
• On a mac if that matters
• Angular2, beta 9

The site is very basic. I've removed all possible complications and it appears that the error is just in bootstrapping itself. Perhaps a missing polyfill?

index.html

<script>
  System.config({
    transpiler: 'typescript', 
    typescriptOptions: { emitDecoratorMetadata: true }, 
    packages: {
        'js': {
            defaultExtension: 'js'
        }
    } 
  });
  System.import('js/main')
        .then(null, console.error.bind(console));

main.ts (entry point)

/// <reference path="../../node_modules/angular2/typings/browser.d.ts" />

import {HTTP_PROVIDERS} from 'angular2/http';
import {bootstrap}    from 'angular2/platform/browser';
import {AppComponent} from './app/components/app';
import 'rxjs/Rx'

bootstrap(AppComponent, [HTTP_PROVIDERS]); // if i comment this out, the error disappears indicating that it lives somewhere in app.ts.

app.ts

import {Component} from 'angular2/core';

@Component({
    selector: "myapp",
    templateUrl: "templates/app.html",
    directives: [],
    providers: []
})

export class AppComponent {}

What have I tried

Adding some additional polyfills, like html_parser which appears to be where the requireExtraParent method is defined.

<script type="text/javascript" src="dist/lib/html_parser.js"></script>

Eliminate any compilation/transpiling errors.

Digging so deep that Google can't even find anything.

Answer 1

The problem was that I was using a reserved word in Angular as a tag (watch).

<services></services>
<collage></collage>
<watch></watch>  <== problem
<collage></collage>

changing it to this works:

<services></services>
<collage></collage>
<watchit></watchit>  <== works fine
<collage></collage>

this was impossible to debug. i had to go line by line commenting things out until eventually i figured out it was in the html, and eventually which line in particular introduced the problem.

posting only so if someone else hits this, they don't go so crazy.