import 'jquery';
import * as angular from 'angular';
import 'angular-mocks';

import '../src/index';
import {ComponentTest} from '../test/utils/ComponentTest';
import {LandingPageController} from '../src/components/landing-page/landing-page.controller';

import 'angular-patternfly';
import 'angular-animate';

describe('servicesView', () => {
  var services: any, categories: any;
  var componentTest: ComponentTest<LandingPageController>;

  beforeEach( () => {
    angular.mock.module('webCatalog');
  });

  beforeEach(() => {
    var landingPageHtml: string = '' +
      '<landing-page search-placeholder="Test Placeholder">' +
      '  <landingheader>' +
      '    <div id="testHeader">' +
      '      <h1>I am the header</h1>' +
      '   </div>' +
      '  </landingheader>' +
      '  <landingbody>' +
      '    <div id=""testBody>' +
      '      <h1>I am the body</h1>' +
      '    </div>' +
      '  </landingbody>' +
      '  <landingside>' +
      '    <div id="testSide">' +
      '      <h1>I am the body</h1>' +
      '    </div>' +
      '  </landingside>' +
      '</landing-page>' +
      '';
    componentTest = new ComponentTest<LandingPageController>(landingPageHtml);
    componentTest.createComponent({});
  });

  // testing the isoScope $ctrl
  it('should have the correct $ctrl properties', () => {
    var ctrl = componentTest.isoScope.$ctrl;
    expect(ctrl.searchPlaceholder).toBe('Test Placeholder');
  });

  // testing rendered HTML
  it('should include the correct transclusions', () => {

    // can't get element.find() to work.  Must be using jQueryLite which doesn't take class selectors
    // expect(angular.element(componentTest.element).find('.services-categories a').length).toBe(3);

    var element = componentTest.rawElement;
    expect(angular.element(element).find('.landing-header-area').length).toBe(1);
  });

  it('should hide the snap up button when not scrolled', () => {
  });

  it('should show the snap up button when scrolled', () => {
  });

  it('should snap down when the snap down button is clicked', () => {
  });

  it('should snap up when the snap up button is clicked', () => {
  });

});