Fix E2E tests

This commit is contained in:
Chocobozzz 2024-11-26 15:07:22 +01:00
parent c40062189b
commit c94ec79107
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
22 changed files with 54 additions and 60 deletions

View File

@ -3,10 +3,8 @@ import { getCheckbox } from '../utils'
export class AnonymousSettingsPage { export class AnonymousSettingsPage {
async openSettings () { async openSettings () {
const link = await $$('.menu-link').filter(async i => { const link = await $('my-header .settings-button')
return await i.getText() === 'My settings' await link.waitForClickable()
}).then(links => links[0])
await link.click() await link.click()
await $('my-user-video-settings').waitForDisplayed() await $('my-user-video-settings').waitForDisplayed()

View File

@ -76,7 +76,7 @@ export class LoginPage {
} }
async logout () { async logout () {
const loggedInDropdown = $('.logged-in-more .logged-in-info') const loggedInDropdown = $('.logged-in-container .logged-in-info')
await loggedInDropdown.waitForClickable() await loggedInDropdown.waitForClickable()
await loggedInDropdown.click() await loggedInDropdown.click()
@ -87,7 +87,7 @@ export class LoginPage {
await logout.click() await logout.click()
await browser.waitUntil(() => { await browser.waitUntil(() => {
return $$('.login-buttons-block, my-error-page a[href="/login"]').some(e => e.isDisplayed()) return $$('my-login-link, my-error-page a[href="/login"]').some(e => e.isDisplayed())
}) })
} }
@ -98,7 +98,7 @@ export class LoginPage {
} }
private getLoggedInInfoElem () { private getLoggedInInfoElem () {
return $('.logged-in-display-name') return $('.logged-in-info .display-name')
} }
private getSuffix () { private getSuffix () {

View File

@ -6,7 +6,7 @@ export class SignupPage {
return $('.create-account-button') return $('.create-account-button')
} }
async clickOnRegisterInMenu () { async clickOnRegisterButton () {
const button = this.getRegisterMenuButton() const button = this.getRegisterMenuButton()
await button.waitForClickable() await button.waitForClickable()
@ -74,7 +74,7 @@ export class SignupPage {
name: string name: string
} }
}) { }) {
await this.clickOnRegisterInMenu() await this.clickOnRegisterButton()
await this.validateStep() await this.validateStep()
await this.checkTerms() await this.checkTerms()
await this.validateStep() await this.validateStep()

View File

@ -11,9 +11,9 @@ export class VideoListPage {
// We did not upload a file on a mobile device // We did not upload a file on a mobile device
if (this.isMobileDevice === true || this.isSafari === true) { if (this.isMobileDevice === true || this.isSafari === true) {
url = 'https://peertube2.cpy.re/videos/local' url = 'https://peertube2.cpy.re/videos/browse?scope=local'
} else { } else {
url = '/videos/recently-added' url = '/videos/browse'
} }
await go(url) await go(url)
@ -24,19 +24,13 @@ export class VideoListPage {
await this.waitForList() await this.waitForList()
} }
async goOnLocal () { async goOnBrowseVideos () {
await $('.menu-link[href="/videos/local"]').click() await $('.menu-link*=Home').click()
await this.waitForTitle('Local videos')
}
async goOnRecentlyAdded () { const browseVideos = $('a*=Browse videos')
await $('.menu-link[href="/videos/recently-added"]').click() await browseVideos.waitForClickable()
await this.waitForTitle('Recently added') await browseVideos.click()
} await this.waitForList()
async goOnTrending () {
await $('.menu-link[href="/videos/trending"]').click()
await this.waitForTitle('Trending')
} }
async goOnHomepage () { async goOnHomepage () {
@ -59,10 +53,11 @@ export class VideoListPage {
await this.waitForList() await this.waitForList()
} }
getNSFWFilter () { async getNSFWFilter () {
return $$('.active-filter').filter(async a => { const el = $('.active-filter*=Sensitive')
return (await a.getText()).includes('Sensitive') await el.waitForDisplayed()
}).then(f => f[0])
return el
} }
async getVideosListName () { async getVideosListName () {

View File

@ -3,7 +3,7 @@ import { getCheckbox, selectCustomSelect } from '../utils'
export class VideoUploadPage { export class VideoUploadPage {
async navigateTo () { async navigateTo () {
const publishButton = await $('.root-header .publish-button') const publishButton = await $('.publish-button > a')
await publishButton.waitForClickable() await publishButton.waitForClickable()
await publishButton.click() await publishButton.click()
@ -28,7 +28,7 @@ export class VideoUploadPage {
// Wait for the upload to finish // Wait for the upload to finish
await browser.waitUntil(async () => { await browser.waitUntil(async () => {
const warning = await $('=Publish will be available when upload is finished').isDisplayed() const warning = await $('=Publish will be available when upload is finished').isDisplayed()
const progress = await $('.progress-bar=100%').isDisplayed() const progress = await $('.progress-container=100%').isDisplayed()
return !warning && progress return !warning && progress
}) })

View File

@ -222,8 +222,9 @@ export class VideoWatchPage {
await confirmButton.waitForClickable() await confirmButton.waitForClickable()
await confirmButton.click() await confirmButton.click()
const createdComment = await (await $('.is-child .comment-html p')).getText() const createdComment = await $('.is-child .comment-html p')
await createdComment.waitForDisplayed()
return expect(createdComment).toBe(comment) return expect(await createdComment.getTagName()).toBe(comment)
} }
} }

View File

@ -13,7 +13,7 @@ describe('Plugins', () => {
} }
async function expectSubmitState ({ disabled }: { disabled: boolean }) { async function expectSubmitState ({ disabled }: { disabled: boolean }) {
const disabledSubmit = await $('my-button .disabled') const disabledSubmit = await $('my-button [disabled]')
if (disabled) expect(await disabledSubmit.isDisplayed()).toBeTruthy() if (disabled) expect(await disabledSubmit.isDisplayed()).toBeTruthy()
else expect(await disabledSubmit.isDisplayed()).toBeFalsy() else expect(await disabledSubmit.isDisplayed()).toBeFalsy()

View File

@ -126,7 +126,7 @@ describe('Signup', () => {
}) })
it('Should go on signup page', async function () { it('Should go on signup page', async function () {
await signupPage.clickOnRegisterInMenu() await signupPage.clickOnRegisterButton()
}) })
it('Should validate the first step (about page)', async function () { it('Should validate the first step (about page)', async function () {
@ -179,7 +179,7 @@ describe('Signup', () => {
}) })
it('Should go on signup page', async function () { it('Should go on signup page', async function () {
await signupPage.clickOnRegisterInMenu() await signupPage.clickOnRegisterButton()
}) })
it('Should validate the first step (about page)', async function () { it('Should validate the first step (about page)', async function () {
@ -260,7 +260,7 @@ describe('Signup', () => {
}) })
it('Should go on signup page', async function () { it('Should go on signup page', async function () {
await signupPage.clickOnRegisterInMenu() await signupPage.clickOnRegisterButton()
}) })
it('Should validate the first step (about page)', async function () { it('Should validate the first step (about page)', async function () {
@ -328,7 +328,7 @@ describe('Signup', () => {
}) })
it('Should go on signup page', async function () { it('Should go on signup page', async function () {
await signupPage.clickOnRegisterInMenu() await signupPage.clickOnRegisterButton()
}) })
it('Should validate the first step (about page)', async function () { it('Should validate the first step (about page)', async function () {

View File

@ -52,9 +52,7 @@ describe('Videos list', () => {
async function checkCommonVideoListPages (policy: NSFWPolicy) { async function checkCommonVideoListPages (policy: NSFWPolicy) {
const promisesWithFilters = [ const promisesWithFilters = [
videoListPage.goOnRootAccount.bind(videoListPage), videoListPage.goOnRootAccount.bind(videoListPage),
videoListPage.goOnLocal.bind(videoListPage), videoListPage.goOnBrowseVideos.bind(videoListPage),
videoListPage.goOnRecentlyAdded.bind(videoListPage),
videoListPage.goOnTrending.bind(videoListPage),
videoListPage.goOnRootChannel.bind(videoListPage) videoListPage.goOnRootChannel.bind(videoListPage)
] ]

View File

@ -10,12 +10,12 @@ function isCheckboxSelected (name: string) {
} }
async function selectCustomSelect (id: string, valueLabel: string) { async function selectCustomSelect (id: string, valueLabel: string) {
const wrapper = $(`[formcontrolname=${id}] .ng-arrow-wrapper`) const wrapper = $(`[formcontrolname=${id}] span[role=combobox]`)
await wrapper.waitForClickable() await wrapper.waitForClickable()
await wrapper.click() await wrapper.click()
const option = await $$(`[formcontrolname=${id}] .ng-option`).filter(async o => { const option = await $$(`[formcontrolname=${id}] li[role=option]`).filter(async o => {
const text = await o.getText() const text = await o.getText()
return text.trimStart().startsWith(valueLabel) return text.trimStart().startsWith(valueLabel)

View File

@ -21,7 +21,6 @@
<div <div
*ngIf="isVideoAddableToPlaylist()" *ngIf="isVideoAddableToPlaylist()"
class="action-dropdown" ngbDropdown placement="top" role="button" autoClose="outside" class="action-dropdown" ngbDropdown placement="top" role="button" autoClose="outside"
(openChange)="addContent.openChange($event)"
[ngbTooltip]="tooltipSaveToPlaylist" placement="bottom auto" [ngbTooltip]="tooltipSaveToPlaylist" placement="bottom auto"
> >
<button class="action-button action-button-save" ngbDropdownToggle> <button class="action-button action-button-save" ngbDropdownToggle>
@ -30,7 +29,7 @@
</button> </button>
<div ngbDropdownMenu> <div ngbDropdownMenu>
<my-video-add-to-playlist #addContent [video]="video"></my-video-add-to-playlist> <my-video-add-to-playlist [video]="video"></my-video-add-to-playlist>
</div> </div>
</div> </div>

View File

@ -15,6 +15,7 @@
display: inline-block; display: inline-block;
white-space: nowrap; white-space: nowrap;
text-transform: uppercase; text-transform: uppercase;
border: 0;
@include peertube-button; @include peertube-button;
@include button-with-icon(21px, 0, -1px); @include button-with-icon(21px, 0, -1px);

View File

@ -9,9 +9,9 @@
<div class="d-flex align-items-center buttons-container"> <div class="d-flex align-items-center buttons-container">
@if (!loggedIn) { @if (!loggedIn) {
<my-button theme="tertiary" rounded="true" class="margin-button" icon="cog" (click)="openQuickSettings()"></my-button> <my-button theme="tertiary" rounded="true" class="margin-button settings-button" icon="cog" (click)="openQuickSettings()"></my-button>
<a *ngIf="isRegistrationAllowed()" routerLink="/signup" class="peertube-button-link secondary-button w-100 ellipsis margin-button"> <a *ngIf="isRegistrationAllowed()" routerLink="/signup" class="peertube-button-link secondary-button w-100 ellipsis margin-button create-account-button">
<my-signup-label [requiresApproval]="requiresApproval"></my-signup-label> <my-signup-label [requiresApproval]="requiresApproval"></my-signup-label>
</a> </a>
@ -22,7 +22,7 @@
<my-button <my-button
i18n-title title="Go to the manage your account page" i18n-title title="Go to the manage your account page"
theme="tertiary" rounded="true" class="margin-button" icon="cog" ptRouterLink="/my-account" theme="tertiary" rounded="true" class="margin-button settings-button" icon="cog" ptRouterLink="/my-account"
></my-button> ></my-button>
<div <div

View File

@ -94,6 +94,8 @@ export class SelectOptionsComponent implements AfterContentInit, ControlValueAcc
return return
} }
this.wroteValue = undefined
this.propagateChange(this.selectedId) this.propagateChange(this.selectedId)
} }

View File

@ -3,7 +3,7 @@
ngbDropdown (openChange)="openChange.emit($event)" [placement]="placement" [container]="container" ngbDropdown (openChange)="openChange.emit($event)" [placement]="placement" [container]="container"
> >
<button <button
class="action-button peertube-button" class="action-button peertube-button border-0"
[ngClass]="{ 'icon-only': !label, 'peertube-button-small': buttonSize === 'small', 'secondary-button': buttonStyled && theme === 'secondary', 'primary-button': buttonStyled && theme === 'primary' }" [ngClass]="{ 'icon-only': !label, 'peertube-button-small': buttonSize === 'small', 'secondary-button': buttonStyled && theme === 'secondary', 'primary-button': buttonStyled && theme === 'primary' }"
ngbDropdownToggle aria-label="Open actions" i18n-aria-label ngbDropdownToggle aria-label="Open actions" i18n-aria-label
> >

View File

@ -1,13 +1,13 @@
@if (ptRouterLink || ptQueryParams) { @if (ptRouterLink || ptQueryParams) {
<a <a
class="action-button" class="action-button"
[ngClass]="classes" [ngbTooltip]="tooltip" [title]="title" [ngClass]="classes" [ngbTooltip]="tooltip" [attr.title]="title"
[routerLink]="ptRouterLink" [queryParams]="ptQueryParams" [queryParamsHandling]="ptQueryParamsHandling" [routerLinkActive]="ptRouterLinkActive" [routerLink]="ptRouterLink" [queryParams]="ptQueryParams" [queryParamsHandling]="ptQueryParamsHandling" [routerLinkActive]="ptRouterLinkActive"
> >
<ng-container *ngTemplateOutlet="content"></ng-container> <ng-container *ngTemplateOutlet="content"></ng-container>
</a> </a>
} @else { } @else {
<button type="button" class="action-button" [ngClass]="classes" [disabled]="disabled" [ngbTooltip]="tooltip" [title]="title"> <button type="button" class="action-button" [ngClass]="classes" [disabled]="disabled" [ngbTooltip]="tooltip" [attr.title]="title">
<ng-container *ngTemplateOutlet="content"></ng-container> <ng-container *ngTemplateOutlet="content"></ng-container>
</button> </button>
} }

View File

@ -2,11 +2,13 @@
@use '_mixins' as *; @use '_mixins' as *;
@use '_button-mixins' as *; @use '_button-mixins' as *;
$height: 36px;
.progress-container { .progress-container {
background-color: pvar(--bg-secondary-500); background-color: pvar(--bg-secondary-500);
display: flex; display: flex;
overflow: hidden; overflow: hidden;
height: 2rem; height: $height;
font-size: 0.85rem; font-size: 0.85rem;
font-weight: $font-semibold; font-weight: $font-semibold;
border-radius: 0.25rem; border-radius: 0.25rem;
@ -15,7 +17,7 @@
span { span {
position: absolute; position: absolute;
color: pvar(--fg-400); color: pvar(--fg-400);
line-height: 2rem; line-height: $height;
margin: 0 12px; margin: 0 12px;
} }

View File

@ -1,12 +1,11 @@
import { booleanAttribute, Component, Input } from '@angular/core' import { booleanAttribute, Component, Input } from '@angular/core'
import { NgIf } from '@angular/common'
import { ServerService } from '@app/core' import { ServerService } from '@app/core'
@Component({ @Component({
selector: 'my-signup-label', selector: 'my-signup-label',
templateUrl: './signup-label.component.html', templateUrl: './signup-label.component.html',
standalone: true, standalone: true,
imports: [ NgIf ] imports: []
}) })
export class SignupLabelComponent { export class SignupLabelComponent {
@Input({ transform: booleanAttribute }) requiresApproval: boolean @Input({ transform: booleanAttribute }) requiresApproval: boolean

View File

@ -24,7 +24,7 @@
<div class="d-inline-block active-filters"> <div class="d-inline-block active-filters">
@for (filter of filters.getActiveFilters(); track filter.key + (filter.value || '')) { @for (filter of filters.getActiveFilters(); track filter.key + (filter.value || '')) {
@if (filter.key !== 'scope') { @if (filter.key !== 'scope') {
<div class="d-inline-block"> <div class="d-inline-block active-filter">
<span i18n *ngIf="filter.value">{{ filter.label }}: </span> <span i18n *ngIf="filter.value">{{ filter.label }}: </span>
<strong>{{ getFilterValue(filter) || filter.label }}</strong> <strong>{{ getFilterValue(filter) || filter.label }}</strong>
</div> </div>

View File

@ -70,7 +70,7 @@ $filters-background: pvar(--bg-secondary-400);
} }
.active-filters { .active-filters {
> div:not(:last-child)::after { .active-filter:not(:last-child)::after {
content: ''; content: '';
font-weight: normal; font-weight: normal;
display: inline-block; display: inline-block;

View File

@ -147,7 +147,6 @@
@mixin peertube-button { @mixin peertube-button {
padding: pvar(--input-y-padding) pvar(--input-x-padding); padding: pvar(--input-y-padding) pvar(--input-x-padding);
border: 0;
font-weight: $font-semibold; font-weight: $font-semibold;
border-radius: 4px; border-radius: 4px;

View File

@ -2,7 +2,7 @@
@use '_mixins' as *; @use '_mixins' as *;
@use '_icons' as *; @use '_icons' as *;
$hover-bg: pvar(--bg-secondary-350); $hover-bg: pvar(--bg-secondary-400);
/* stylelint-disable */ /* stylelint-disable */
@import 'primeng/resources/primeng.css'; @import 'primeng/resources/primeng.css';
@ -233,11 +233,11 @@ body .p-dropdown-panel .p-dropdown-items .p-dropdown-item {
margin-top: 0; margin-top: 0;
} }
.p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight { .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight {
color: pvar(--fg); color: pvar(--on-primary);
background: pvar(--bg-secondary-500); background: pvar(--primary);
} }
.p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight.p-focus { .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight.p-focus {
background: pvar(--bg-secondary-500); background: pvar(--primary);
} }
.p-dropdown-panel .p-dropdown-items .p-dropdown-item:not(.p-highlight):not(.p-disabled).p-focus { .p-dropdown-panel .p-dropdown-items .p-dropdown-item:not(.p-highlight):not(.p-disabled).p-focus {
color: pvar(--fg); color: pvar(--fg);