Skip to content
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

[ACS-6081] Reduce references to internal Angular material CSS classes #3534

Merged
merged 6 commits into from
Nov 24, 2023
Merged

[ACS-6081] Reduce references to internal Angular material CSS classes #3534

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
6483f1c
[ACS-6081] Reduce references to internal Angular material CSS classes
nikita-web-ua Nov 22, 2023
958114f
[ACS-6081] rollback default scrollable value [ci:force]
nikita-web-ua Nov 22, 2023
120f503
[ACS-6081] linting
nikita-web-ua Nov 23, 2023
2b3129f
[ACS-6081] fix e2es
nikita-web-ua Nov 24, 2023
4e78284
[ACS-6081] cr fix
nikita-web-ua Nov 24, 2023
9401619
[ACS-6081] remove adf-cli logger from e2es
nikita-web-ua Nov 24, 2023
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
2 changes: 1 addition & 1 deletion app/src/app/app.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
<h1 class="sr-only" title="{{pageHeading | async | translate}}">{{ pageHeading | async | translate }}</h1>
<h1 class="aca-sr-only" title="{{pageHeading | async | translate}}">{{ pageHeading | async | translate }}</h1>
<router-outlet></router-outlet>
2 changes: 1 addition & 1 deletion app/src/app/app.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ app-root {
display: flex;
flex: 1;

.sr-only {
.aca-sr-only {
position: absolute;
width: 1px;
height: 1px;
Expand Down
7 changes: 3 additions & 4 deletions e2e/playwright/actions/src/tests/create-folder.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,6 @@
errorStrings,
test
} from '@alfresco/playwright-shared';
import { logger } from '@alfresco/adf-cli/scripts/logger';

test.describe('Create folders', () => {
const apiClientFactory = new ApiClientFactory();
Expand All @@ -56,7 +55,7 @@
nodesApi = await NodesApi.initialize(username, username);
await nodesApi.createFolder(commonFolderName);
} catch (error) {
logger.error(`beforeAll failed : ${error}`);
console.error(`beforeAll failed : ${error}`);
}
});

Expand All @@ -77,15 +76,15 @@
await personalFiles.navigate();
await personalFiles.selectCreateFolder();
} catch (error) {
logger.error(`beforeEach failed : ${error}`);
console.error(`beforeEach failed : ${error}`);
}
});

test.afterAll(async () => {
try {
await nodesApi.deleteCurrentUserNodes();
} catch (error) {
logger.error(`afterAll failed : ${error}`);
console.error(`afterAll failed : ${error}`);
}
});

Expand Down Expand Up @@ -166,7 +165,7 @@
test('[C216340] Create a folder with name, title and description', async () => {
await folderDialog.createNewFolderDialog(randomFolderName, randomFolderTitle, randomFolderDescription);

await expect(folderTable.getCellLinkByName(randomFolderName)).toHaveAttribute('title', randomFolderTitle + `\n` + randomFolderDescription);

Check failure on line 168 in e2e/playwright/actions/src/tests/create-folder.spec.ts

View workflow job for this annotation

GitHub Actions / E2e test suites: Playwright (actions, 1)

[Actions] › src/tests/create-folder.spec.ts:165:9 › Create folders › On Personal Files dataTable › [C216340] Create a folder with name 

  4) [Actions] › src/tests/create-folder.spec.ts:165:9 › Create folders › On Personal Files dataTable › [C216340] Create a folder with name, title and description 
    Error: Timed out 5000ms waiting for expect(received).toHaveAttribute(expected)

    - Expected string  - 1
    + Received string  + 1

    - folder-title-1e0wg
    + playwright-folder-18r8jfolder-title-1e0wg
      folder-description-127lk
    Call log:
      - expect.toHaveAttribute with timeout 5000ms
      - waiting for locator('adf-datatable .adf-cell-value span').filter({ hasText: 'playwright-folder-18r8j' })
      -   locator resolved to <span role="link" tabindex="0" class="adf-datatable-ce…> playwright-folder-18r8jfolder-title-1e0wg </span>
      -   unexpected value "playwright-folder-18r8jfolder-title-1e0wg
    folder-description-127lk"
      -   locator resolved to <span role="link" tabindex="0" class="adf-datatable-ce…> playwright-folder-18r8jfolder-title-1e0wg </span>
      -   unexpected value "playwright-folder-18r8jfolder-title-1e0wg
    folder-description-127lk"
      -   locator resolved to <span role="link" tabindex="0" class="adf-datatable-ce…> playwright-folder-18r8jfolder-title-1e0wg </span>
      -   unexpected value "playwright-folder-18r8jfolder-title-1e0wg
    folder-description-127lk"
      -   locator resolved to <span role="link" tabindex="0" class="adf-datatable-ce…> playwright-folder-18r8jfolder-title-1e0wg </span>
      -   unexpected value "playwright-folder-18r8jfolder-title-1e0wg
    folder-description-127lk"


      166 |       await folderDialog.createNewFolderDialog(randomFolderName, randomFolderTitle, randomFolderDescription);
      167 |
    > 168 |       await expect(folderTable.getCellLinkByName(randomFolderName)).toHaveAttribute('title', randomFolderTitle + `\n` + randomFolderDescription);
          |                                                                     ^
      169 |     });
      170 |
      171 |     test('[C216351] Folder created after trimmed ending spaces from a folder name', async () => {

        at /home/runner/work/alfresco-content-app/alfresco-content-app/e2e/playwright/actions/src/tests/create-folder.spec.ts:168:69
});

test('[C216351] Folder created after trimmed ending spaces from a folder name', async () => {
Expand Down
7 changes: 3 additions & 4 deletions e2e/playwright/actions/src/tests/create-library.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,6 @@ import {
Breadcrumb,
TrashcanApi
} from '@alfresco/playwright-shared';
import { logger } from '@alfresco/adf-cli/scripts/logger';

test.describe('Create Libraries ', () => {
const apiClientFactory = new ApiClientFactory();
Expand Down Expand Up @@ -70,7 +69,7 @@ test.describe('Create Libraries ', () => {
await sitesApi.createSite(commonTrashLibraryName);
await sitesApi.deleteSites([commonTrashLibraryName], false);
} catch (error) {
logger.error(`beforeAll failed : ${error}`);
console.error(`beforeAll failed : ${error}`);
}
});

Expand All @@ -91,7 +90,7 @@ test.describe('Create Libraries ', () => {
await myLibrariesPage.navigate();
await myLibrariesPage.selectCreateLibrary();
} catch (error) {
logger.error(`beforeEach failed : ${error}`);
console.error(`beforeEach failed : ${error}`);
}
});

Expand All @@ -101,7 +100,7 @@ test.describe('Create Libraries ', () => {
const trashcanApi = await TrashcanApi.initialize(username, username);
await trashcanApi.emptyTrashcan();
} catch (error) {
logger.error(`afterAll failed : ${error}`);
console.error(`afterAll failed : ${error}`);
}
});

Expand Down
2 changes: 1 addition & 1 deletion projects/aca-content/about/src/about.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<h1>{{ 'APP.BROWSE.ABOUT.TITLE' | translate }}</h1>
</div>

<div class="aca-page-layout-content scrollable">
<div class="aca-page-layout-content aca-scrollable">
<adf-about>
<adf-about-panel *ngIf="dev" [label]="'ABOUT.SERVER_SETTINGS.TITLE' | translate">
<ng-template>
Expand Down
5 changes: 3 additions & 2 deletions projects/aca-content/folder-rules/src/manage-rules/manage-rules.smart-component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ <h1 class="aca-page-title">{{ 'ACA_FOLDER_RULES.ACTIONS.MANAGE_RULES' | translat
</div>

<div class="aca-page-layout-content">
<div class="main-content">
<div class="aca-main-content">

<ng-container *ngIf="((ruleSetsLoading$ | async) && (inheritedRuleSets$ | async).length === 0) || (actionsLoading$ | async); else onLoaded">
<mat-progress-bar color="primary" mode="indeterminate"></mat-progress-bar>
Expand All @@ -27,14 +27,15 @@ <h2 class="aca-page-title">{{ (folderInfo$ | async).name }}:{{'ACA_FOLDER_RULES.

<mat-slide-toggle
data-automation-id="manage-rules-inheritance-toggle-button"
class="aca-manage-rules__actions-bar__toggle"
[checked]="isInheritanceEnabled"
(change)="onInheritanceToggleChange($event)"
[disabled]="isInheritanceToggleDisabled"
[labelPosition]="'before'">
{{ 'ACA_FOLDER_RULES.MANAGE_RULES.TOOLBAR.ACTIONS.INHERIT_RULES' | translate }}
</mat-slide-toggle>

<mat-divider vertical class="vertical-divider"></mat-divider>
<mat-divider vertical class="aca-manage-rules__actions-bar__vertical-divider"></mat-divider>

<div class="aca-manage-rules__actions-bar__buttons">
<button
Expand Down
4 changes: 2 additions & 2 deletions projects/aca-content/folder-rules/src/manage-rules/manage-rules.smart-component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,12 +19,12 @@
gap: 12px;
}

.mat-slide-toggle-label {
&__toggle {
font-weight: 600;
font-size: 14px;
}

.vertical-divider {
&__vertical-divider {
height: 50%;
margin: 0 12px;
}
Expand Down
5 changes: 3 additions & 2 deletions projects/aca-content/folder-rules/src/rule-details/actions/rule-action.ui-component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,9 @@
flex-direction: row;
gap: 20px;

adf-card-view .adf-property-list .adf-property adf-card-view-item-dispatcher adf-card-view-textitem .mat-form-field .mat-form-field-infix {
width: 280px;
adf-card-view .adf-property-list .adf-property adf-card-view-item-dispatcher adf-card-view-textitem {
display: inline-block;
width: 300px;
}
}

Expand Down
4 changes: 2 additions & 2 deletions ...ntent/folder-rules/src/rule-details/conditions/rule-composite-condition.ui-component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@
display: block;
border-radius: 8px;

&.childCompositeCondition {
&.aca-childCompositeCondition {
padding: 8px 16px;
background-color: hsl(0deg, 0%, 100%);

&.secondaryBackground {
&.aca-secondaryBackground {
background-color: hsl(0deg, 0%, 95%);
}
}
Expand Down
4 changes: 2 additions & 2 deletions ...content/folder-rules/src/rule-details/conditions/rule-composite-condition.ui-component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,10 +62,10 @@ import { RuleSimpleConditionUiComponent } from './rule-simple-condition.ui-compo
]
})
export class RuleCompositeConditionUiComponent implements ControlValueAccessor, OnDestroy, OnChanges {
@HostBinding('class.secondaryBackground')
@HostBinding('class.aca-secondaryBackground')
@Input()
secondaryBackground = false;
@HostBinding('class.childCompositeCondition')
@HostBinding('class.aca-childCompositeCondition')
@Input()
childCondition = false;

Expand Down
2 changes: 1 addition & 1 deletion ...-content/folder-rules/src/rule-details/conditions/rule-simple-condition.ui-component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
</mat-select>
</mat-form-field>

<mat-form-field class="aca-rule-simple-condition__form__comparator-input" [class]="{ hidden: isComparatorHidden }" data-automation-id="comparator-form-field">
<mat-form-field class="aca-rule-simple-condition__form__comparator-input" [class]="{ 'aca-hidden': isComparatorHidden }" data-automation-id="comparator-form-field">
<mat-select formControlName="comparator" data-automation-id="comparator-select">
<mat-option
*ngFor="let comparator of selectedFieldComparators"
Expand Down
2 changes: 1 addition & 1 deletion ...-content/folder-rules/src/rule-details/conditions/rule-simple-condition.ui-component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
}

&__comparator-input {
&.hidden {
&.aca-hidden {
display: none;
}
}
Expand Down
12 changes: 5 additions & 7 deletions projects/aca-content/folder-rules/src/rule-details/edit-rule-dialog.ui-component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,14 @@
.aca-edit-rule-dialog-container {
--edit-rule-dialog-padding: 8px 20px;

.mat-dialog-container {
padding: 0;
}
}

.aca-edit-rule-dialog {
margin: -24px;

&__header {
display: flex;
align-items: center;
margin: 0;
margin: -43px -24px 0;
padding: var(--edit-rule-dialog-padding);
box-sizing: border-box;
border-bottom: 1px solid var(--theme-border-color);
Expand All @@ -29,7 +27,7 @@
}

&__content {
margin: 0;
margin: 0 -24px;
padding: 0;

&__spinner {
Expand All @@ -41,7 +39,7 @@
}

&__footer {
margin: 0;
margin: 0 -24px -43px;
padding: var(--edit-rule-dialog-padding);
box-sizing: border-box;
border-top: 1px solid var(--theme-border-color);
Expand Down
5 changes: 4 additions & 1 deletion projects/aca-content/folder-rules/src/rule-details/options/rule-options.ui-component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,15 @@
<mat-checkbox
formControlName="isAsynchronous"
(change)="toggleErrorScriptDropdown($event)"
class="aca-rule-options__checkbox"
data-automation-id="rule-option-checkbox-asynchronous">
{{ 'ACA_FOLDER_RULES.RULE_DETAILS.OPTIONS.IS_ASYNCHRONOUS' | translate }}
</mat-checkbox>

<mat-form-field
data-automation-id="rule-option-form-field-errorScript"
floatLabel="always"
[ngClass]="{ 'hide-error-script-dropdown': hideErrorScriptDropdown }">
[ngClass]="{ 'aca-hide-error-script-dropdown': hideErrorScriptDropdown }">

<mat-select
formControlName="errorScript"
Expand All @@ -31,6 +32,7 @@
<div class="aca-rule-options__option" *ngIf="!readOnly || isInheritableChecked">
<mat-checkbox
formControlName="isInheritable"
class="aca-rule-options__checkbox"
data-automation-id="rule-option-checkbox-inheritable">
{{ 'ACA_FOLDER_RULES.RULE_DETAILS.OPTIONS.IS_INHERITABLE' | translate }}
</mat-checkbox>
Expand All @@ -39,6 +41,7 @@
<div class="aca-rule-options__option" *ngIf="!readOnly">
<mat-checkbox
formControlName="isDisabled"
class="aca-rule-options__checkbox"
data-automation-id="rule-option-checkbox-disabled">
{{ 'ACA_FOLDER_RULES.RULE_DETAILS.OPTIONS.DISABLE_RULE' | translate }}
</mat-checkbox>
Expand Down
4 changes: 2 additions & 2 deletions projects/aca-content/folder-rules/src/rule-details/options/rule-options.ui-component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,11 @@
flex-direction: column;
}

&.read-only .mat-checkbox-inner-container {
&.aca-read-only &__checkbox label > span:first-child {
display: none;
}

.hide-error-script-dropdown {
.aca-hide-error-script-dropdown {
visibility: hidden;
}
}
4 changes: 2 additions & 2 deletions projects/aca-content/folder-rules/src/rule-details/options/rule-options.ui-component.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,11 +45,11 @@ describe('RuleOptionsUiComponent', () => {
const testErrorScriptFormFieldVisibility = (isVisible: boolean) => {
if (isVisible) {
expect((getByDataAutomationId('rule-option-form-field-errorScript').nativeElement as HTMLElement).classList).not.toContain(
'hide-error-script-dropdown'
'aca-hide-error-script-dropdown'
);
} else {
expect((getByDataAutomationId('rule-option-form-field-errorScript').nativeElement as HTMLElement).classList).toContain(
'hide-error-script-dropdown'
'aca-hide-error-script-dropdown'
);
}
};
Expand Down
2 changes: 1 addition & 1 deletion projects/aca-content/folder-rules/src/rule-details/options/rule-options.ui-component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ export class RuleOptionsUiComponent implements ControlValueAccessor, OnChanges,
@Input()
errorScriptConstraint: ActionParameterConstraint;

@HostBinding('class.read-only')
@HostBinding('class.aca-read-only')
readOnly = false;

onChange: (options: RuleOptions) => void = () => undefined;
Expand Down
17 changes: 9 additions & 8 deletions projects/aca-content/folder-rules/src/rule-details/rule-details.ui-component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
<form class="aca-rule-details__form" [ngClass]="{ 'read-only': readOnly }" [formGroup]="form">
<form class="aca-rule-details__form" [ngClass]="{ 'aca-read-only': readOnly }" [formGroup]="form">

<ng-container *ngIf="!preview">
<div class="aca-rule-details__form__row aca-rule-details__form__name">
<label for="rule-details-name-input">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.LABEL.NAME' | translate }}</label>
<div>
<mat-form-field floatLabel='never'>
<mat-form-field floatLabel='never' class="aca-rule-details__form__row__field">
<input
id="rule-details-name-input"
matInput type="text" formControlName="name" data-automation-id="rule-details-name-input"
Expand All @@ -17,8 +17,9 @@
<div class="aca-rule-details__form__row aca-rule-details__form__description">
<label for="rule-details-description-textarea">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.LABEL.DESCRIPTION' | translate }}</label>
<div>
<mat-form-field floatLabel='never'>
<mat-form-field floatLabel='never' class="aca-rule-details__form__row__field">
<textarea
class="aca-rule-details__form__row__field__textarea"
id="rule-details-description-textarea"
matInput formControlName="description" data-automation-id="rule-details-description-textarea"
[placeholder]="descriptionPlaceHolder | translate">
Expand All @@ -29,20 +30,20 @@
</ng-container>

<div class="aca-rule-details__form__row aca-rule-details__form__triggers">
<div class="label">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.LABEL.WHEN' | translate }}</div>
<div class="aca-label">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.LABEL.WHEN' | translate }}</div>
<div>
<aca-rule-triggers formControlName="triggers" data-automation-id="rule-details-triggers-component"></aca-rule-triggers>
<mat-error class="rule-details-error" *ngIf="triggers.hasError('required')">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.ERROR.INSUFFICIENT_TRIGGERS_SELECTED' | translate }}</mat-error>
<mat-error class="aca-rule-details-error" *ngIf="triggers.hasError('required')">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.ERROR.INSUFFICIENT_TRIGGERS_SELECTED' | translate }}</mat-error>
</div>
</div>

<div class="aca-rule-details__form__conditions">
<aca-rule-composite-condition formControlName="conditions"></aca-rule-composite-condition>
<mat-error class="rule-details-error" *ngIf="conditions.hasError('ruleCompositeConditionInvalid')">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.ERROR.RULE_COMPOSITE_CONDITION_INVALID' | translate }}</mat-error>
<mat-error class="aca-rule-details-error" *ngIf="conditions.hasError('ruleCompositeConditionInvalid')">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.ERROR.RULE_COMPOSITE_CONDITION_INVALID' | translate }}</mat-error>
</div>

<div class="aca-rule-details__form__row aca-rule-details__form__actions">
<div class="label">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.LABEL.PERFORM_ACTIONS' | translate }}</div>
<div class="aca-label">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.LABEL.PERFORM_ACTIONS' | translate }}</div>
<aca-rule-action-list
formControlName="actions"
[actionDefinitions]="actionDefinitions"
Expand All @@ -53,7 +54,7 @@
</div>

<div class="aca-rule-details__form__row" *ngIf="showOptionsSection">
<div class="label">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.LABEL.OPTIONS' | translate }}</div>
<div class="aca-label">{{ 'ACA_FOLDER_RULES.RULE_DETAILS.LABEL.OPTIONS' | translate }}</div>
<aca-rule-options
formControlName="options"
data-automation-id="rule-details-options-component"
Expand Down
Loading
Loading