import { Component , DebugElement } from '@angular/core' ; import { ComponentFixture , TestBed , fakeAsync } from '@angular/core/testing' ; import { By } from '@angular/platform-browser' ; import { Platform } from '@angular/cdk/platform' ; import { MdcMenuSurface , MdcMenuSurfaceModule , } from './index' ; import { MdcImageListModule } from '@angular-mdc/web/image-list' ; describe ( 'MdcMenuSurface' , ( ) => { let fixture ; let platform ; beforeEach ( fakeAsync ( ( ) => { platform = { isBrowser : true } ; TestBed . configureTestingModule ( { imports : [ MdcMenuSurfaceModule , MdcImageListModule ] , declarations : [ MenuSurfaceTest ] , providers : [ { provide : Platform , useFactory : ( ) => platform } ] } ) ; TestBed . compileComponents ( ) ; } ) ) ; describe ( 'basic behaviors' , ( ) => { let testDebugElement ; let testInstance ; let testComponent ; beforeEach ( ( ) => { fixture = TestBed . createComponent ( MenuSurfaceTest ) ; fixture . detectChanges ( ) ; testDebugElement = fixture . debugElement . query ( By . directive ( MdcMenuSurface ) ) ; testInstance = testDebugElement . componentInstance ; testComponent = fixture . debugElement . componentInstance ; } ) ; it ( '#menu-surface should open' , ( ) => { testComponent . open = true ; fixture . detectChanges ( ) ; expect ( testInstance . open ) . toBe ( true ) ; } ) ; it ( '#menu-surface should open as non-browser' , ( ) => { platform . isBrowser = false ; testComponent . open = true ; fixture . detectChanges ( ) ; expect ( testInstance . open ) . toBe ( true ) ; } ) ; it ( '#menu-surface should quick open' , ( ) => { testComponent . quickOpen = true ; fixture . detectChanges ( ) ; expect ( testInstance . quickOpen ) . toBe ( true ) ; } ) ; it ( '#menu-surface should set fixed' , ( ) => { testComponent . fixed = false ; fixture . detectChanges ( ) ; expect ( testInstance . fixed ) . toBe ( false ) ; } ) ; it ( '#menu-surface should set hoistToBody' , ( ) => { testComponent . hoistToBody = true ; fixture . detectChanges ( ) ; expect ( testInstance . hoistToBody ) . toBe ( true ) ; } ) ; it ( '#menu-surface should set anchor corner' , ( ) => { testComponent . anchorCorner = 'topEnd' ; fixture . detectChanges ( ) ; expect ( testInstance . anchorCorner ) . toBe ( 'topEnd' ) ; testComponent . anchorCorner = 'bottomEnd' ; fixture . detectChanges ( ) ; expect ( testInstance . anchorCorner ) . toBe ( 'bottomEnd' ) ; testComponent . anchorCorner = 'bottomStart' ; fixture . detectChanges ( ) ; expect ( testInstance . anchorCorner ) . toBe ( 'bottomStart' ) ; expect ( testInstance . anchorMargin ) . toBeDefined ( ) ; expect ( testInstance . coordinates ) . toBeDefined ( ) ; expect ( testInstance . anchorElement ) . toBeDefined ( ) ; } ) ; it ( '#should handle click event' , ( ) => { testDebugElement . nativeElement . click ( ) ; fixture . detectChanges ( ) ; } ) ; } ) ; } ) ; @ Component ( { template : `
  <div mdcMenuSurfaceAnchor #menuSurfaceAnchorTest>
    <button mdc-button raised (click)="menuSurfaceTest.open = !menuSurfaceTest.open">
      Show Menu Surface
    </button>
    <mdc-menu-surface #menuSurfaceTest
     [open]="open"
     [coordinates]="{x: 0, y: 0}"
     [hoistToBody]="hoistToBody"
     [anchorElement]="menuSurfaceAnchorTest"
     [anchorCorner]="anchorCorner"
     [quickOpen]="quickOpen" [fixed]="fixed"
     [anchorMargin]="anchorMargin">
      <mdc-image-list>
        <mdc-image-list-item *ngFor="let i of images">
          <mdc-image-list-image-aspect>
            <img mdcImageListImage />
          </mdc-image-list-image-aspect>
          <mdc-image-list-supporting>
            <span mdcImageListLabel>Text label</span>
          </mdc-image-list-supporting>
        </mdc-image-list-item>
      </mdc-image-list>
    </mdc-menu-surface>
  </div>
  ` , } ) class MenuSurfaceTest { open : boolean ; anchorCorner : string ; quickOpen : boolean ; fixed : boolean ; hoistToBody : boolean ; anchorMargin = { top : 0 , bottom : 0 , left : 0 , right : 0 } ; images = Array . from ( Array ( 2 ) , ( x , i ) => i ) ; }