Skip to content

Commit

Permalink
Updating tests and examples with new options
Browse files Browse the repository at this point in the history
  • Loading branch information
ruhley committed Jan 24, 2017
1 parent dba0201 commit 7204ac9
Show file tree
Hide file tree
Showing 5 changed files with 43 additions and 23 deletions.
9 changes: 7 additions & 2 deletions examples/01-simple.html
Expand Up @@ -24,6 +24,11 @@ <h3>Color</h3>
<select ng-model="options.format" class="form-control" ng-options="option.value as option.label for option in formatOptions"></select>
</div>

<div class="row">
<label class="control-label">Restrict To Format (restrictToFormat) - whether or not to restrict typing of the color to the selected format</label>
<select ng-model="options.restrictToFormat" class="form-control" ng-options="option.value as option.label for option in boolOptions"></select>
</div>

<div class="row">
<label class="control-label">Hue (hue) - whether or not to display the hue control</label>
<select ng-model="options.hue" class="form-control" ng-options="option.value as option.label for option in boolOptions"></select>
Expand Down Expand Up @@ -116,8 +121,8 @@ <h3>Attributes</h3>
</div>

<div class="row">
<label class="control-label">Input Class (input_class)</label>
<input type="text" ng-model="options.input_class" placeholder="Input Class" class="form-control" />
<label class="control-label">Input Class (inputClass)</label>
<input type="text" ng-model="options.inputClass" placeholder="Input Class" class="form-control" />
</div>

<h3>Show/Hide</h3>
Expand Down
6 changes: 3 additions & 3 deletions test/e2e/hide.protractor.js
Expand Up @@ -10,23 +10,23 @@ describe('Options: ', () => {
it('Should hide when clicking the swatch by default', () => {
Page.input_field.click();
expect(Page.color_picker_panel.isDisplayed()).toEqual(true);
browser.driver.executeScript('document.activeElement.blur()');
Page.blurColorPicker();
expect(Page.color_picker_panel.isDisplayed()).toEqual(false);
});

it('Should not hide when option is changed', () => {
Page.hide_blur_field.$('[label="No"]').click();
Page.input_field.click();
expect(Page.color_picker_panel.isDisplayed()).toEqual(true);
browser.driver.executeScript('document.activeElement.blur()');
Page.blurColorPicker();
expect(Page.color_picker_panel.isDisplayed()).toEqual(true);
});

it('Should hide again', () => {
Page.hide_blur_field.$('[label="Yes"]').click();
Page.input_field.click();
expect(Page.color_picker_panel.isDisplayed()).toEqual(true);
browser.driver.executeScript('document.activeElement.blur()');
Page.blurColorPicker();
expect(Page.color_picker_panel.isDisplayed()).toEqual(false);
});
});
Expand Down
30 changes: 15 additions & 15 deletions test/e2e/input-class.protractor.js
Expand Up @@ -7,31 +7,31 @@ describe('Options: ', () => {
Page.waitTillPageLoaded();
});

it('Should not have an input_class by default', () => {
it('Should not have an inputClass by default', () => {
expect(Page.input_field.getAttribute('class')).toMatch('');
});

it('Should update the input_class', () => {
let input_class = 'qwerty';
Page.input_class_field.clear().sendKeys(input_class);
expect(Page.input_field.getAttribute('class')).toMatch(input_class);
it('Should update the inputClass', () => {
let inputClass = 'qwerty';
Page.inputClass_field.clear().sendKeys(inputClass);
expect(Page.input_field.getAttribute('class')).toMatch(inputClass);
});

it('Should not have an input_class', () => {
Page.input_class_field.clear();
it('Should not have an inputClass', () => {
Page.inputClass_field.clear();
expect(Page.input_field.getAttribute('class')).toMatch('');
});

it('Should update the input_class again', () => {
let input_class = 'asdf';
Page.input_class_field.clear().sendKeys(input_class);
expect(Page.input_field.getAttribute('class')).toMatch(input_class);
it('Should update the inputClass again', () => {
let inputClass = 'asdf';
Page.inputClass_field.clear().sendKeys(inputClass);
expect(Page.input_field.getAttribute('class')).toMatch(inputClass);
});

it('Should update the input_class again', () => {
let input_class = 'zxcv';
Page.input_class_field.clear().sendKeys(input_class);
expect(Page.input_field.getAttribute('class')).toMatch(input_class);
it('Should update the inputClass again', () => {
let inputClass = 'zxcv';
Page.inputClass_field.clear().sendKeys(inputClass);
expect(Page.input_field.getAttribute('class')).toMatch(inputClass);
});
});
});
12 changes: 11 additions & 1 deletion test/page-object.js
Expand Up @@ -6,11 +6,13 @@ class Page {

// attribute fields
this.id_field = element(by.model('options.id'));
this.input_class_field = element(by.model('options.input_class'));
this.inputClass_field = element(by.model('options.inputClass'));
this.name_field = element(by.model('options.name'));
this.placeholder_field = element(by.model('options.placeholder'));

// color fields
this.format_field = element(by.model('options.format'));
this.restrict_to_format_field = element(by.model('options.restrictToFormat'));
this.hue_field = element(by.model('options.hue'));
this.saturation_field = element(by.model('options.saturation'));
this.lightness_field = element(by.model('options.lightness'));
Expand Down Expand Up @@ -73,6 +75,14 @@ class Page {
openColorPicker() {
this.input_field.click();
}

closeColorPicker() {
this.input_field.sendKeys(protractor.Key.ESCAPE);
}

blurColorPicker() {
browser.driver.executeScript('document.activeElement.blur()');
}
}

module.exports = new Page();
9 changes: 7 additions & 2 deletions test/test.html
Expand Up @@ -24,6 +24,11 @@ <h3>Color</h3>
<select ng-model="options.format" class="form-control" ng-options="option.value as option.label for option in formatOptions"></select>
</div>

<div class="row">
<label class="control-label">Restrict To Format (restrictToFormat) - whether or not to restrict typing of the color to the selected format</label>
<select ng-model="options.restrictToFormat" class="form-control" ng-options="option.value as option.label for option in boolOptions"></select>
</div>

<div class="row">
<label class="control-label">Hue (hue) - whether or not to display the hue control</label>
<select ng-model="options.hue" class="form-control" ng-options="option.value as option.label for option in boolOptions"></select>
Expand Down Expand Up @@ -116,8 +121,8 @@ <h3>Attributes</h3>
</div>

<div class="row">
<label class="control-label">Input Class (input_class)</label>
<input type="text" ng-model="options.input_class" placeholder="Input Class" class="form-control" />
<label class="control-label">Input Class (inputClass)</label>
<input type="text" ng-model="options.inputClass" placeholder="Input Class" class="form-control" />
</div>

<h3>Show/Hide</h3>
Expand Down

0 comments on commit 7204ac9

Please sign in to comment.