Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
185 changes: 81 additions & 104 deletions src/components/progress-bar/progress-bar.spec.ts
Original file line number Diff line number Diff line change
@@ -1,135 +1,112 @@
import {
inject,
TestComponentBuilder,
TestBed,
async,
} from '@angular/core/testing';
import {TestBed, async, ComponentFixture} from '@angular/core/testing';
import {Component} from '@angular/core';
import {By} from '@angular/platform-browser';
import {MdProgressBarModule} from './progress-bar';


describe('MdProgressBar', () => {
let builder: TestComponentBuilder;

beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [MdProgressBarModule],
declarations: [TestApp],
declarations: [
BasicProgressBar,
BufferProgressBar,
],
});

TestBed.compileComponents();
}));

beforeEach(inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
builder = tcb;
}));

it('should apply a mode of "determinate" if no mode is provided.', (done: () => void) => {
builder
.overrideTemplate(TestApp, '<md-progress-bar></md-progress-bar>')
.createAsync(TestApp)
.then((fixture) => {
fixture.detectChanges();
let progressElement = fixture.debugElement.query(By.css('md-progress-bar'));
expect(progressElement.componentInstance.mode).toBe('determinate');
done();
});
});
describe('basic progress-bar', () => {
let fixture: ComponentFixture<BasicProgressBar>;

it('should not modify the mode if a valid mode is provided.', (done: () => void) => {
builder
.overrideTemplate(TestApp, '<md-progress-bar mode="buffer"></md-progress-bar>')
.createAsync(TestApp)
.then((fixture) => {
fixture.detectChanges();
let progressElement = fixture.debugElement.query(By.css('md-progress-bar'));
expect(progressElement.componentInstance.mode).toBe('buffer');
done();
});
});
beforeEach(() => {
fixture = TestBed.createComponent(BasicProgressBar);
fixture.detectChanges();
});

it('should define default values for value and bufferValue attributes', (done: () => void) => {
builder
.overrideTemplate(TestApp, '<md-progress-bar></md-progress-bar>')
.createAsync(TestApp)
.then((fixture) => {
fixture.detectChanges();
let progressElement = fixture.debugElement.query(By.css('md-progress-bar'));
expect(progressElement.componentInstance.value).toBe(0);
expect(progressElement.componentInstance.bufferValue).toBe(0);
done();
});
});
it('should apply a mode of "determinate" if no mode is provided.', () => {
let progressElement = fixture.debugElement.query(By.css('md-progress-bar'));
expect(progressElement.componentInstance.mode).toBe('determinate');
});

it('should define default values for value and bufferValue attributes', () => {
let progressElement = fixture.debugElement.query(By.css('md-progress-bar'));
expect(progressElement.componentInstance.value).toBe(0);
expect(progressElement.componentInstance.bufferValue).toBe(0);
});

it('should clamp value and bufferValue between 0 and 100', () => {
let progressElement = fixture.debugElement.query(By.css('md-progress-bar'));
let progressComponent = progressElement.componentInstance;

progressComponent.value = 50;
expect(progressComponent.value).toBe(50);

progressComponent.value = 999;
expect(progressComponent.value).toBe(100);

it('should clamp value and bufferValue between 0 and 100', (done: () => void) => {
builder
.overrideTemplate(TestApp, '<md-progress-bar></md-progress-bar>')
.createAsync(TestApp)
.then((fixture) => {
fixture.detectChanges();
let progressElement = fixture.debugElement.query(By.css('md-progress-bar'));
let progressComponent = progressElement.componentInstance;
progressComponent.value = -10;
expect(progressComponent.value).toBe(0);

progressComponent.value = 50;
expect(progressComponent.value).toBe(50);
progressComponent.bufferValue = -29;
expect(progressComponent.bufferValue).toBe(0);

progressComponent.value = 999;
expect(progressComponent.value).toBe(100);
progressComponent.bufferValue = 9;
expect(progressComponent.bufferValue).toBe(9);

progressComponent.value = -10;
expect(progressComponent.value).toBe(0);
progressComponent.bufferValue = 1320;
expect(progressComponent.bufferValue).toBe(100);
});

it('should return the transform attribute for bufferValue and mode', () => {
let progressElement = fixture.debugElement.query(By.css('md-progress-bar'));
let progressComponent = progressElement.componentInstance;

expect(progressComponent._primaryTransform()).toEqual({transform: 'scaleX(0)'});
expect(progressComponent._bufferTransform()).toBe(undefined);

progressComponent.bufferValue = -29;
expect(progressComponent.bufferValue).toBe(0);
progressComponent.value = 40;
expect(progressComponent._primaryTransform()).toEqual({transform: 'scaleX(0.4)'});
expect(progressComponent._bufferTransform()).toBe(undefined);

progressComponent.bufferValue = 9;
expect(progressComponent.bufferValue).toBe(9);
progressComponent.value = 35;
progressComponent.bufferValue = 55;
expect(progressComponent._primaryTransform()).toEqual({transform: 'scaleX(0.35)'});
expect(progressComponent._bufferTransform()).toBe(undefined);

progressComponent.bufferValue = 1320;
expect(progressComponent.bufferValue).toBe(100);
done();
});
progressComponent.mode = 'buffer';
expect(progressComponent._primaryTransform()).toEqual({transform: 'scaleX(0.35)'});
expect(progressComponent._bufferTransform()).toEqual({transform: 'scaleX(0.55)'});


progressComponent.value = 60;
progressComponent.bufferValue = 60;
expect(progressComponent._primaryTransform()).toEqual({transform: 'scaleX(0.6)'});
expect(progressComponent._bufferTransform()).toEqual({transform: 'scaleX(0.6)'});
});
});

it('should return the transform attribute for bufferValue and mode', (done: () => void) => {
builder
.overrideTemplate(TestApp, '<md-progress-bar></md-progress-bar>')
.createAsync(TestApp)
.then((fixture) => {
fixture.detectChanges();
let progressElement = fixture.debugElement.query(By.css('md-progress-bar'));
let progressComponent = progressElement.componentInstance;

expect(progressComponent._primaryTransform()).toEqual({ transform: 'scaleX(0)' });
expect(progressComponent._bufferTransform()).toBe(undefined);

progressComponent.value = 40;
expect(progressComponent._primaryTransform()).toEqual({ transform: 'scaleX(0.4)' });
expect(progressComponent._bufferTransform()).toBe(undefined);

progressComponent.value = 35;
progressComponent.bufferValue = 55;
expect(progressComponent._primaryTransform()).toEqual({ transform: 'scaleX(0.35)' });
expect(progressComponent._bufferTransform()).toBe(undefined);

progressComponent.mode = 'buffer';
expect(progressComponent._primaryTransform()).toEqual({ transform: 'scaleX(0.35)' });
expect(progressComponent._bufferTransform()).toEqual({ transform: 'scaleX(0.55)' });


progressComponent.value = 60;
progressComponent.bufferValue = 60;
expect(progressComponent._primaryTransform()).toEqual({ transform: 'scaleX(0.6)' });
expect(progressComponent._bufferTransform()).toEqual({ transform: 'scaleX(0.6)' });
done();
});
describe('buffer progress-bar', () => {
let fixture: ComponentFixture<BufferProgressBar>;

beforeEach(() => {
fixture = TestBed.createComponent(BufferProgressBar);
fixture.detectChanges();
});

it('should not modify the mode if a valid mode is provided.', () => {
let progressElement = fixture.debugElement.query(By.css('md-progress-bar'));
expect(progressElement.componentInstance.mode).toBe('buffer');
});
});
});


/** Test component that contains an MdButton. */
@Component({
template: '',
})
class TestApp { }
@Component({template: '<md-progress-bar></md-progress-bar>'})
class BasicProgressBar { }

@Component({template: '<md-progress-bar mode="buffer"></md-progress-bar>'})
class BufferProgressBar { }