/* Copyright (C) 2017 Canonical Ltd. */
'use strict';

const React = require('react');

const ExpandingProgress = require('./expanding-progress');

const jsTestUtils = require('../../utils/component-test-utils');
const testUtils = require('react-dom/test-utils');

describe('ExpandingProgress', function() {

  it('renders properly', () => {
    var output = jsTestUtils.shallowRender(
      <ExpandingProgress />);
    var expected = (
      <div className="expanding-progress"></div>);
    assert.deepEqual(output, expected);
  });

  it('adds the active class after mounted', done => {
    var component = testUtils.renderIntoDocument(
      <ExpandingProgress />);
    // The class is set asynchronously so loop over the value and continue When
    // it changes.
    setTimeout(() => {
      if (component.state.active) {
        assert.equal(component.state.active, true);
        done();
      }
    });
  });

});

@@ -79,16 +79,50 @@
 react');
+%0Aconst enzyme = require('enzyme');
 %0A%0Aconst 
@@ -179,273 +179,334 @@
 );%0A%0A
-const jsTestUtils = require('../../utils/component-test-utils');%0Aconst testUtils = require('react-dom/test-utils');%0A%0Adescribe('ExpandingProgress', function() %7B%0A%0A  it('renders properly', () =%3E %7B%0A    var output = jsTestUtils.shallowRender(%0A      %3CExpandingProgress /%3E
+describe('ExpandingProgress', function() %7B%0A%0A  const renderComponent = (options = %7B%7D) =%3E enzyme.shallow(%0A    %3CExpandingProgress /%3E%0A  );%0A%0A  beforeEach(() =%3E %7B%0A    this.clock = sinon.useFakeTimers();%0A  %7D);%0A%0A  afterEach(() =%3E %7B%0A    this.clock.restore();%0A  %7D);%0A%0A  it('renders properly', () =%3E %7B%0A    const wrapper = renderComponent(
 );%0A 
@@ -591,24 +591,26 @@
 ert.
-deepEqual(output
+compareJSX(wrapper
 , ex
@@ -669,20 +669,18 @@
 unted', 
-done
+()
  =%3E %7B%0A  
@@ -685,323 +685,269 @@
     
-var component = testUtils.renderIntoDocument(%0A      %3CExpandingProgress /%3E);%0A    // The class is set asynchronously so loop over the value and continue When%0A    // it changes.%0A    setTimeout(() =%3E %7B%0A      if (component.state.active) %7B%0A        assert.equal(component.state.active, true);%0A        done();%0A      %7D%0A    %7D
+const wrapper = renderComponent();%0A    // The class is set asynchronously fast forward until it should be applied.%0A    this.clock.tick(1);%0A    wrapper.update();%0A    assert.equal(%0A      wrapper.prop('className').includes('expanding-progress--active'),%0A      true
 );%0A 

Update expanding progress tests to use enzyme.