Typescript compilation failing for app-box and app-header

[rileyjbauer]

Description

The app-header and app-box elements fail to be compiled by Typescript (tried 2.6.2 and 3.0.1)

Expected outcome

No compilation errors.

Actual outcome

Compilation fails with the following errors:

bower_components/app-layout/app-box/app-box.d.ts(85,11): error TS2320: Interface 'AppBoxElement' cannot simultaneously extend types 'Element' and 'AppScrollEffectsBehavior'.
  Named property 'scroll' of types 'Element' and 'AppScrollEffectsBehavior' are not identical.

bower_components/app-layout/app-header/app-header.d.ts(213,11): error TS2320: Interface 'AppHeaderElement' cannot simultaneously extend types 'Element' and 'AppScrollEffectsBehavior'.
  Named property 'scroll' of types 'Element' and 'AppScrollEffectsBehavior' are not identical.

Steps to reproduce

1. Run npm install typescript
2. Run bower install PolymerElements/app-layout --save
3. Run tsc

Browsers Affected

N / A

[keanulee]

cc @aomarks @e111077

I'm not super familiar with TS, but PolymerElements/iron-scroll-target-behavior#41 was supposed to make AppScrollEffectsBehavior.scroll at least compatible with Element.scroll (AppScrollEffectsBehavior includes IronScrollTargetBehavior), though that was to make Closure happy. Basically AppScrollEffectsBehavior.scroll will override Element.scroll.

Ref https://github.com/Polymer/gen-typescript-declarations/issues/79

[keanulee]

npm run generate-types works with TS 3.0.3 (as specified in package-lock.json). There's a separate issue with TS 3.1 that should be fixed with the next Polymer release (PR Polymer/polymer#5372).