mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ACS-7266] checkboxes in sorting boxes are put on the right side of the text instead of the left side (#11009)
* [ACS-7266] Fix for checkboxes position * [ACS-7266] Unit test * [ACS-7266] Addressed comment
This commit is contained in:
@@ -2,7 +2,6 @@
|
|||||||
<mat-checkbox
|
<mat-checkbox
|
||||||
*ngFor="let option of options"
|
*ngFor="let option of options"
|
||||||
[checked]="option.checked"
|
[checked]="option.checked"
|
||||||
labelPosition="before"
|
|
||||||
(keydown.enter)="option.checked = !option.checked"
|
(keydown.enter)="option.checked = !option.checked"
|
||||||
[attr.data-automation-id]="'checkbox-' + (option.name)"
|
[attr.data-automation-id]="'checkbox-' + (option.name)"
|
||||||
[attr.aria-label]="option.name | translate"
|
[attr.aria-label]="option.name | translate"
|
||||||
|
@@ -25,11 +25,14 @@ import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
|
|||||||
import { MatCheckboxHarness } from '@angular/material/checkbox/testing';
|
import { MatCheckboxHarness } from '@angular/material/checkbox/testing';
|
||||||
import { MatButtonHarness } from '@angular/material/button/testing';
|
import { MatButtonHarness } from '@angular/material/button/testing';
|
||||||
import { ReplaySubject } from 'rxjs';
|
import { ReplaySubject } from 'rxjs';
|
||||||
|
import { UnitTestingUtils } from '@alfresco/adf-core';
|
||||||
|
import { MatCheckbox } from '@angular/material/checkbox';
|
||||||
|
|
||||||
describe('SearchCheckListComponent', () => {
|
describe('SearchCheckListComponent', () => {
|
||||||
let loader: HarnessLoader;
|
let loader: HarnessLoader;
|
||||||
let fixture: ComponentFixture<SearchCheckListComponent>;
|
let fixture: ComponentFixture<SearchCheckListComponent>;
|
||||||
let component: SearchCheckListComponent;
|
let component: SearchCheckListComponent;
|
||||||
|
let unitTestingUtils: UnitTestingUtils;
|
||||||
|
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
TestBed.configureTestingModule({
|
TestBed.configureTestingModule({
|
||||||
@@ -38,6 +41,7 @@ describe('SearchCheckListComponent', () => {
|
|||||||
fixture = TestBed.createComponent(SearchCheckListComponent);
|
fixture = TestBed.createComponent(SearchCheckListComponent);
|
||||||
component = fixture.componentInstance;
|
component = fixture.componentInstance;
|
||||||
loader = TestbedHarnessEnvironment.loader(fixture);
|
loader = TestbedHarnessEnvironment.loader(fixture);
|
||||||
|
unitTestingUtils = new UnitTestingUtils(fixture.debugElement);
|
||||||
|
|
||||||
component.context = {
|
component.context = {
|
||||||
queryFragments: {},
|
queryFragments: {},
|
||||||
@@ -138,6 +142,18 @@ describe('SearchCheckListComponent', () => {
|
|||||||
expect(component.context.filterRawParams[component.id]).toBeUndefined();
|
expect(component.context.filterRawParams[component.id]).toBeUndefined();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should have set labelPosition to after for checkboxes', () => {
|
||||||
|
component.options = new SearchFilterList<SearchListOption>([
|
||||||
|
{ name: 'Folder', value: `TYPE:'cm:folder'`, checked: true },
|
||||||
|
{ name: 'Document', value: `TYPE:'cm:content'`, checked: true }
|
||||||
|
]);
|
||||||
|
|
||||||
|
fixture.detectChanges();
|
||||||
|
const checkboxes = unitTestingUtils.getAllByDirective(MatCheckbox);
|
||||||
|
expect(checkboxes.length).toBe(2);
|
||||||
|
expect(checkboxes.every((checkbox) => checkbox.componentInstance.labelPosition === 'after')).toBeTrue();
|
||||||
|
});
|
||||||
|
|
||||||
describe('Pagination', () => {
|
describe('Pagination', () => {
|
||||||
it('should show 5 items when pageSize not defined', async () => {
|
it('should show 5 items when pageSize not defined', async () => {
|
||||||
component.id = 'checklist';
|
component.id = 'checklist';
|
||||||
|
@@ -75,6 +75,10 @@ export class UnitTestingUtils {
|
|||||||
return this.debugElement.query(By.directive(directive));
|
return this.debugElement.query(By.directive(directive));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
getAllByDirective(directive: Type<any>): DebugElement[] {
|
||||||
|
return this.debugElement.queryAll(By.directive(directive));
|
||||||
|
}
|
||||||
|
|
||||||
/** Perform actions */
|
/** Perform actions */
|
||||||
|
|
||||||
clickByCSS(selector: string): void {
|
clickByCSS(selector: string): void {
|
||||||
|
Reference in New Issue
Block a user