Skip to content

PLEX-OPTIONS - Cambia button por plex-button #317

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
palita1991 wants to merge 1 commit into
base: master
Choose a base branch
from
Open

PLEX-OPTIONS - Cambia button por plex-button #317

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
10 changes: 2 additions & 8 deletions cypress/integration/template-listado.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,19 +7,13 @@ context('template listado', () => {
});

it('test accordion', () => {
cy.eyesCheckWindow('main');

// SE SACO PORQUE PISARON TODA UNA COMPONENTE
// cy.get('plex-title').plexButtonIcon('chevron-down').click();
// cy.eyesCheckWindow('modal');

// cy.plexButton('CANCELAR').click();
cy.eyesCheckWindow('main');;

cy.get('plex-list plex-item').eq(0).plexButtonIcon('eye').click();

cy.eyesCheckWindow('item list selected');

cy.get('plex-options button').eq(0).click();
cy.get('plex-options').plexButton('opcion 1').eq(0).click();

cy.eyesCheckWindow('plex-options');

Expand Down
19 changes: 14 additions & 5 deletions src/lib/css/plex-options.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,18 @@
plex-options {
.options-container {
display: flex;
}

.option-grow {
plex-button {
flex-grow: 1;

&.active {
button {
color: #fff;
background-color: #0082ad;
background-image: none;
border-color: #007aa3;
}
}

button {
width: 100%;
}
}
}
12 changes: 7 additions & 5 deletions src/lib/options/options.component.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import { Component, DebugElement, Type, ViewChild, ViewEncapsulation } from '@an
import { PlexOptionsComponent, IPlexOptionsItems } from './options.component';
import { PlexModule } from '../module';
import { FormsModule } from '@angular/forms';
import { Plex } from '../core/service';

describe('PlexOptionsComponent', () => {
let fixture: ComponentFixture<PlexOptionsTestComponent>;
Expand All @@ -22,7 +23,7 @@ describe('PlexOptionsComponent', () => {


it('have 3 buttons', fakeAsync(() => {
const elements = getElementAll(fixture, 'plex-options button');
const elements = getElementAll(fixture, 'plex-options plex-button');
expect(elements.length).toBe(fixture.componentInstance.items.length);
}));

Expand All @@ -31,7 +32,7 @@ describe('PlexOptionsComponent', () => {
}));

it('display label', fakeAsync(() => {
const elements = getElementAll(fixture, 'plex-options button');
const elements = getElementAll(fixture, 'plex-options plex-button');

elements.forEach((elem, index) => {
const elementRef = elem.nativeElement;
Expand All @@ -44,7 +45,7 @@ describe('PlexOptionsComponent', () => {

spyOn(fixture.componentInstance, 'onChange');

const elements = getElementAll(fixture, 'plex-options button');
const elements = getElementAll(fixture, 'plex-options plex-button');
const secondButton = elements[1].nativeElement;
secondButton.dispatchEvent(new Event('click'));

Expand All @@ -66,7 +67,7 @@ describe('PlexOptionsComponent', () => {

tickAndDetectChanges(fixture);

const elements = getElementAll(fixture, 'plex-options button');
const elements = getElementAll(fixture, 'plex-options plex-button');

expect(options.active).toBe('d');

Expand Down Expand Up @@ -134,7 +135,8 @@ function createTestingModule<T>(cmp: Type<T>, template: string): ComponentFixtur

TestBed.configureTestingModule({
imports: [BrowserModule, PlexModule, FormsModule],
declarations: [cmp]
declarations: [cmp],
providers: [Plex]
})
.overrideComponent(cmp, {
set: {
Expand Down
14 changes: 6 additions & 8 deletions src/lib/options/options.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,15 +9,13 @@ export interface IPlexOptionsItems {
@Component({
selector: 'plex-options',
template: `
<div class="row">
<div class="d-flex col flex-wrap">
<ng-container *ngFor="let item of items">
<button class="btn btn-primary btn-sm option-grow m-0" (click)="onOptionsClick(item)" [class.active]="active === item.key">
{{ item.label }}
</button>
</ng-container>
<div class="row">
<div class="d-flex col flex-wrap">
<ng-container *ngFor="let item of items">
<plex-button [type]="info" [size]="sm" [label]="item.label" (click)="onOptionsClick(item)" class="active === item.key"></plex-button>
</ng-container>
</div>
</div>
</div>
`
})
export class PlexOptionsComponent implements OnInit, OnChanges {
Expand Down