Commit Graph

137 Commits (develop)

Author SHA1 Message Date
Michael Telatynski a1897583b1
Stabilise screenshot tests (#12835)
* Hide tooltips in screenshot tests by default

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Blank out dialog backgrounds by default

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Crop image-upload-preview screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise width of masked user is in user profile

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tidy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-07-30 08:20:07 +00:00
David Baker c2c108957e
Add sign out button to settings profile section (#12666)
* Add sign out button to settings profile section

And move the logic for displaying the dialog out of the user menu
to somewhere it can be re-used.

Also close any open dialog on logout, because otherwise, well... you
can guess.

* Missing import

* Update screenshot

* This button doesn't need to be an anchor

* Use Flex component

* Use new force-close function

* More tests
2024-07-29 12:53:44 +00:00
Michael Telatynski 844da7a656
Fix compound typography font component issues (#12826)
* Fix compound typography font component issues

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update playwright tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-07-29 11:19:26 +00:00
R Midhun Suresh f17d14bdab
Hide tooltip when taking screenshot (#12807) 2024-07-24 09:46:43 +00:00
R Midhun Suresh bb1b7f1fd0
Default the room header to on (#12803)
* Default the room header to on

* Refactor code into helper method

Add a method to open/close the room info panel and use it everywhere.

* Fix broken tests, update snapshots and screenshots

* Update room header tests to make sense with the new header
2024-07-23 10:56:25 +00:00
Michael Telatynski 0fc1c53a8e
Iterate design of right panel empty state (#12796)
* Add reusable empty state for the right panel

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve coverage

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-07-19 17:17:40 +00:00
Michael Telatynski f706ac4fa1
Update styling of UserInfo right panel card (#12788)
* Add colour to PresenceLabel in UserInfo

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update button positions & styles in UserInfo

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update UserInfo styles

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Revert Ignore->Block copy change

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-07-18 14:24:44 +00:00
David Baker 2920e76b64
Test for lack of WebAssembly support (#12792)
* Test for lack of WebAssembly support

* Good news: the 'only' detection works
2024-07-18 13:25:02 +00:00
David Baker 924f5a079f
Add test for the unsupported browser screen (#12787)
* Add test for the unsupported browser screen

Test a handful of APIs that are easy to disable with an init script
and assert that the app display the "Unsupported Browser" screen.

* Oops, test wasn't actually testing anything

* Remove other feature tests

They didn't work because there are two separate screens, one of
which has an iframe and one of which doesn't.

* Add screenshot test

* Rename to ts

* Fix screenshot

* Fix snapshot filename

* Rename file

* rename screenshot again

* rename screenshot again

* 16th time's a charm

* remove file

* please just be in the right place
2024-07-18 07:41:44 +00:00
Michael Telatynski f7a078d250
Update right panel base card styling to match Compound (#12768)
* Update base card styling to match Compound

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-07-16 09:03:35 +00:00
Michael Telatynski e6d9eccf1b
Add test reporter to prevent stale screenshots (#12743)
* Split up slow Playwright tests

To optimise parallelism

Deals with:

```
Slow test file: read-receipts/redactions.spec.ts (5.4m)
Slow test file: read-receipts/new-messages.spec.ts (3.9m)
Slow test file: read-receipts/high-level.spec.ts (3.6m)
Slow test file: read-receipts/editing-messages.spec.ts (3.1m)
Slow test file: read-receipts/reactions.spec.ts (2.2m)
Slow test file: crypto/crypto.spec.ts (2.4m)
Slow test file: settings/appearance-user-settings-tab/appearance-user-settings-tab.spec.ts (1.2m)
Slow test file: composer/composer.spec.ts (1.1m)
Slow test file: crypto/verification.spec.ts (1.1m)
```

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Move around snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add test reporter to prevent stale screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove darwin screenshots which should not have been checked in

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix absolute vs relative path mismatch

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Revert "Remove darwin screenshots which should not have been checked in"

This reverts commit 1e189977fa9ec873339fc02b2b231a314809b2d5.

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Revert "Revert "Remove darwin screenshots which should not have been checked in""

This reverts commit 5144b9b28e31ca543b2c5d02820c3f957dbd8c04.

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove stale screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Revert "Remove stale screenshots"

This reverts commit 9beae9974557c1ffa99c2372da280bb0da407bd1.

* Apply same sanitization as Playwright for file name consistency

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* add dev dep

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove stale screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Discard changes to playwright/flaky-reporter.ts

* Update end-to-end-tests.yaml

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-07-15 18:23:20 +00:00
David Baker 7f959036af
Fix HTML export test (#12778)
* Fix HTML export test

The masked area changed width deending on the date.

* Mask off more

* Update screenshot
2024-07-15 16:47:35 +00:00
Michael Telatynski b4ef5d3cc3
Fix HTML export missing a bunch of Compound variables (#12774) 2024-07-15 11:33:41 +01:00
Michael Telatynski c894bebaa0
Split up slow Playwright tests (#12741)
* Split up slow Playwright tests

To optimise parallelism

Deals with:

```
Slow test file: read-receipts/redactions.spec.ts (5.4m)
Slow test file: read-receipts/new-messages.spec.ts (3.9m)
Slow test file: read-receipts/high-level.spec.ts (3.6m)
Slow test file: read-receipts/editing-messages.spec.ts (3.1m)
Slow test file: read-receipts/reactions.spec.ts (2.2m)
Slow test file: crypto/crypto.spec.ts (2.4m)
Slow test file: settings/appearance-user-settings-tab/appearance-user-settings-tab.spec.ts (1.2m)
Slow test file: composer/composer.spec.ts (1.1m)
Slow test file: crypto/verification.spec.ts (1.1m)
```

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Move around snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-07-10 09:06:13 +00:00
R Midhun Suresh cf8b87fd14
Add tabs to the right panel (#12672)
* Create new method for header button behaviour

With the introduction of tabs, the behaviour of the header buttons is
changed as follows:
- Close any right panel if open
- Open the correct right panel if no panel was open before

The old method (and behaviour) is retained as showOrHidePhase.

* Implement tabs in the right panel

There are three tabs: Info, People and Threads

* Remove unwanted code from RoomSummaryCard

- Remove the menu item for opening the memberlist since that is now
  taken of by the tabs.
- Remove the close button

* Remove code for focusing close button from tac item

See https://github.com/matrix-org/matrix-react-sdk/pull/12410

There's no longer a close button to focus so we instead focus the thread
tab. This is done in RightPaneltabs.tsx so we just need to remove this
code.

* Introduce a room info icon to the header

This was previously present in the legacy room header but not in the new
header.

* BaseCard changes

- Adds id, ariaLabelledBy and role props to implement tab accessibility.
- Adds hideHeaderButtons prop to hide header buttons (think back and
  close buttons).
- Change confusing header rendering code:
  header is not rendered ONLY when no header is passed AND
  hideHeaderButtons is true.

* Refactor repeated code into function

Created a new function createSpaceScopeHeader which returns the
component if the room is a space room. Previously this code was
duplicated in every component that uses SpaceScopeHeader component.

* Pass BaseCard attributes and use helper function

Actually using the code from the last two commits

* Add, update and remove tests/screenshots/snapshots

* Fix distance between search bar and tabs

* Update compound

* Update screenshots/snapshots
2024-07-09 11:36:50 +00:00
Michael Telatynski 2a26afe438
Redesign room search interface (#12677)
* Extract SearchInfo interface and SearchScope enum

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix in-progress and update behaviour of RoomSearchView

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove search button from legacy header

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Move search from aux panel to room summary card

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Wire up Cmd/Ctrl F for moved search field

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Use cpd space tokens

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove stale props

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix ctrl/cmd f search shortcut

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update Compound

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Revert the back button for now

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* i18n

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Cancel search on escape

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix missing X

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve coverage

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Extract SearchScope and SearchInfo into Searching

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Switch to icon button for cancel search

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* yarn.lock

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* lint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* i18n

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update locators

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Revert screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

* Discard changes to package.json

* i18n

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Handle narrow viewports

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve coverage

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve coverage

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Revert copy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-07-08 09:57:41 +00:00
David Baker 81f29d13dc
Move language settings to 'preferences' (#12723)
* Move language settings to 'preferences'

Their new home is in this tab

* Update snapshot

* Move playwright test code

* Add test

* tests

* Update screenshot
2024-07-05 22:04:27 +00:00
David Baker 06117695bc
Fix close button on forgot password flow (#12732)
* Fix close button on forgot password flow

The 'x' had escaped out the right of the button for some reason

* Add test that actually opens the dialog in question

* Actually screenshot the right thing

* Unnecessary screenshot
2024-07-05 09:51:21 +00:00
Florian Duros 2f953f1d0f
New layout selector ui in user settings (#12676)
* feat: reworked the layout switcher

* feat: make the classname optional in EventTilePreview.tsx

* test: add tests to LayoutSwitcher

* feat: change appearance tab

* test: update appearance snapshot

* e2e: add tests

* css: add comment for gap overriding
2024-07-05 07:30:31 +00:00
Florian Duros 53ea045c54
Update @vector-im/compound-web (#12718)
* deps: update `@vector-im/compound-web`

* feat: use new EditInPlace

* e2e: update snapshots
2024-07-02 12:35:13 +00:00
Florian Duros 33a017b528
New theme ui in user settings (#12576)
* Add hook to get the theme

* Adapt subsection settings to new ui

* WIP new theme subsection

* Add theme selection

* Fix test types

* Disabled theme selector when system theme is used

* Update compound to `4.4.1`

* Add custom theme support

* Remove old ThemChoicePanel

* Fix QuickThemeSwitcher-test.tsx

* Fix AppearanceUserSettingsTab-test.tsx

* Update i18n

* Fix ThemeChoicePanel-test.tsx

* Update `@vector-im/compound-web`

* Small tweaks

* Fix CSS comments and use compound variable

* Remove custom theme title

* i18n: update

* test: add tests to theme selection

* test: update AppearanceUserSettingsTab-test snapshot

* test: rework custom theme

* playwright: fix audio-player.spec.ts

* playwright: appearance tab

* test: update snapshot

* playright: add custom theme

* i18n: use correct char for ellipsis

* a11y: add missing aria-label to delete button

* dialog: update close button tooltip

* theme: remove local state and handle custom delete

* theme: don't add twice the same custom theme

* test: update snapshot

* playwright: update snapshot

* custom theme: add background to custom theme list

* update compound web

* Use new destructive property on `IconButton` of theme panel

* test: update snapshots

* rename new ui into legacy

* remove wrong constructor doc

* fix theme selector padding

* theme selector: fix key

* test: fix e2e
2024-06-26 15:47:01 +00:00
David Baker ea0baee101
Split out email & phone number settings to separate components & move discovery to privacy tab (#12670)
* WIP update of threepid settings section

* Remove email / phone number section from original place

and don't show the new one if 3pids are disabled

* Update snapshots

* Pull identity server / 3pid binding settings out to separate component

and put it in the security & privacy section which is its new home

* Update snapshot

* Move relevant part of test & update screenshots / snapshots

* Remove unnecessary dependency

* Add test for discovery settings

* Add spacing in terms agreement
2024-06-26 13:04:19 +00:00
Florian Duros 6c99b91210
Minor tweaks to UserSettings dialog (#12651)
* Make user settings dialog title looks like figma design

* dialog: add title to close button

* Update dialog snapshot

* Update playwright snapshot
2024-06-20 09:29:38 +00:00
David Baker e49f8e033d
Update to compound-web 4.8.0 (#12650) 2024-06-20 09:09:20 +00:00
David Baker 650b9cb0cf
Add in-progress view to display name EditInPlace (#12609)
* Add in-progress view to display name EditInPlace

Requires https://github.com/element-hq/compound-web/pull/180

* Update to new compound-web

for editinplace component with spinner

* Update snapshots

for https://github.com/element-hq/compound-web/pull/178

* Update screenshots

* Remove margin

which isn't necessary now there's no 'Remove' link on the bottom

* Update screenshots
2024-06-14 14:16:13 +00:00
Michael Telatynski 8c49f3f2ea
Update gfm.css to github-markdown-css (#12613)
* Update gfm.css to github-markdown-css

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-06-13 16:27:37 +00:00
David Baker 25e4515c3c
Fix image upload preview size (#12607)
* Fix image upload preview size

and add a playwright test for it

* Add the actual playwright test
2024-06-12 22:35:02 +00:00
David Baker 3e7511cc5d
Keep dialog glass border on narrow screens (#12591)
* Keep dialog glass border on narrow screens

It got pushed off the edge and eventually disappeared on narrow
screens, so force it to always be present.

* Update screenshot
2024-06-11 08:31:17 +00:00
David Baker 1696c5cd0a
Change avatarsetting componment to use a menu (#12585)
* New user profile UI in User Settings

Using new Edit In Place component.

* Show avatar upload error

* Fix avatar upload error

* Wire up errors & feedback for display name setting

* Implement avatar upload / remove progress toast

* Add 768px breakpoint

* Fix display of no avatar in avatar setting controls

There was supposed to be a person icon but it was invisible, and also
would have been inappropriate for room avatars anyway.

This makes it match the designs by being the same as whatever the
default avatar is.

* Fix room profile display

* Update edit icon on avatarsetting comnponent

* Change avatarsetting componment to use a menu

As per the designs, remove the 'remove' link and instead have a menu
pop up to either upload a new file or remove the avatar.

This also changes the room profile viw, since that uses the same view.

* Update to released compund-web with required components / fixes

* Require compound-web 4.4.0

because we do need it

* Update snapshots

Because of course all the auto-generated IDs of unrelated things
have changed.

* Fix duplicate import

* Fix CSS comment

* Update snapshot

* Run all the tests so the ids stay the same

* Start of a test for ProfileSettings

* More tests

* Test that a toast appears

* Test ToastRack

* Update snapshots

* Add the usernamee control

* Fix playwright tests

 * New compound version for editinplace fixes
 * Fix useId to not just generate a constant ID
 * Use the label in the username component
 * Fix widths of test boxes
 * Update screenshots

* Put ^ back on compound-web version

* Split CSS for room & user profile settings

and name the components correspondingly

* Fix playwright test

* Update room settings screenshot

* Use original screenshot instead

* Add required props in test

* Fix test

* Also here

* Update screenshots

* Remove user icon

...which is unused now, as far as I can see.

* Fix styling of unrelated buttons

Needed to be added in other places otherwise the specificity changes.

Also put the old screenshots back.

* Add copyright year

* Fix copyright year

* Switch to useMatrixClientContext

* Fix other test

* Make clickable with no avatar again and fix tests

and renmove a test for the remove button which is no longer there

* Put back missing CSS to make the menu entry red

* Fix type error

* Fix tests

* Supply open / onOpenChange props

* Fix tests

* There is no hover anymore

* Use the computed name, not the name which may be null

* Fix room avatar remove behaviour

* Remove redundant else
2024-06-07 13:25:21 +00:00
David Baker 3c8010b719
Fix display of no avatar in avatar setting controls (#12558)
* New user profile UI in User Settings

Using new Edit In Place component.

* Show avatar upload error

* Fix avatar upload error

* Wire up errors & feedback for display name setting

* Implement avatar upload / remove progress toast

* Add 768px breakpoint

* Fix display of no avatar in avatar setting controls

There was supposed to be a person icon but it was invisible, and also
would have been inappropriate for room avatars anyway.

This makes it match the designs by being the same as whatever the
default avatar is.

* Fix room profile display

* Update to released compund-web with required components / fixes

* Require compound-web 4.4.0

because we do need it

* Update snapshots

Because of course all the auto-generated IDs of unrelated things
have changed.

* Fix duplicate import

* Fix CSS comment

* Update snapshot

* Run all the tests so the ids stay the same

* Start of a test for ProfileSettings

* More tests

* Test that a toast appears

* Test ToastRack

* Update snapshots

* Add the usernamee control

* Fix playwright tests

 * New compound version for editinplace fixes
 * Fix useId to not just generate a constant ID
 * Use the label in the username component
 * Fix widths of test boxes
 * Update screenshots

* Put ^ back on compound-web version

* Split CSS for room & user profile settings

and name the components correspondingly

* Fix playwright test

* Update room settings screenshot

* Use original screenshot instead

* Add required props in test

* Fix test

* Also here

* Update screenshots

* Remove user icon

...which is unused now, as far as I can see.

* Fix styling of unrelated buttons

Needed to be added in other places otherwise the specificity changes.

Also put the old screenshots back.

* Add copyright year

* Fix copyright year

* Switch to useMatrixClientContext

* Fix other test
2024-06-06 17:35:44 +00:00
David Baker cfa322cd62
New user profile UI in User Settings (#12548)
* New user profile UI in User Settings

Using new Edit In Place component.

* Show avatar upload error

* Fix avatar upload error

* Wire up errors & feedback for display name setting

* Implement avatar upload / remove progress toast

* Add 768px breakpoint

* Fix room profile display

* Update to released compund-web with required components / fixes

* Require compound-web 4.4.0

because we do need it

* Update snapshots

Because of course all the auto-generated IDs of unrelated things
have changed.

* Fix duplicate import

* Fix CSS comment

* Update snapshot

* Run all the tests so the ids stay the same

* Start of a test for ProfileSettings

* More tests

* Test that a toast appears

* Test ToastRack

* Update snapshots

* Add the usernamee control

* Fix playwright tests

 * New compound version for editinplace fixes
 * Fix useId to not just generate a constant ID
 * Use the label in the username component
 * Fix widths of test boxes
 * Update screenshots

* Put ^ back on compound-web version

* Split CSS for room & user profile settings

and name the components correspondingly

* Fix playwright test

* Update room settings screenshot

* Use original screenshot instead

* Fix styling of unrelated buttons

Needed to be added in other places otherwise the specificity changes.

Also put the old screenshots back.

* Add copyright year

* Fix copyright year
2024-06-06 13:56:38 +00:00
Florian Duros 1190de9028
Migrate `TooltipTarget` usage to compound `Tooltip` (#12542)
* Use new tooltip in `RoomTopic.tsx`

* Use new tooltip in `MLocationBody.tsx`

* Fix room topic

* Update location snapshot

* Use new tooltip in `AppPermission.tsx`

* Remove `TooltipTarget`

* Add tests for `RoomTopic`
2024-05-22 12:15:07 +00:00
Florian Duros f6e919021a
Fix E2E icon display in room header (#12545)
* Fix E2E icon display

* Add e2e test
2024-05-20 16:08:50 +00:00
Michael Telatynski b283b18898
Fix flakiness in playwright tests (#12512)
* Remove redundant option

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise app download dialog screenshot test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Try to stabilise user menu opening in playwright tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise one-to-one-chat.spec.ts

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise kick.spec.ts

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Discard changes to playwright/element-web-test.ts

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-05-13 16:58:49 +00:00
David Baker 948435ceb9
Collapse UserSettings tabs to just icons on narrow screens (#12505)
* Collapse UserSettings tabs to just icons on narrow screens

* Add screenshot test

* Better comment formatting.

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

* Comment the media query

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2024-05-10 16:29:50 +00:00
Michael Telatynski eee0b2a9c3
Add room topic to right panel room info (#12503)
* Add room topic to right panel room info

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak styles

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add snapshot tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-05-10 10:00:43 +00:00
Florian Duros caef3c1921
Tooltip: improve accessibility in room (#12493)
* Migrate to `AccessibleButton`

* Update snapshots

* Update snapshots
2024-05-07 10:20:46 +00:00
David Baker 18ef97161a
Move the active tab in user settings to the dialog title (#12481)
* Convert tabbedview to functional component

The 'Tab' is still a class, so now it's a functional component that
has a supporting class, which is maybe a bit... jarring, but I think
is actually perfectly logical.

* put comment back

* Fix bad tab ID behaviour

* Make TabbedView a controlled component

This does mean the logic of keeping what tab is active is now in each
container component, but for a functional component, this is a single
line. It makes TabbedView simpler and the container components always
know exactly what tab is being displayed rather than having to effectively
keep the state separately themselves if they wanted it.

Based on https://github.com/matrix-org/matrix-react-sdk/pull/12478

* Move the active tab in user settings to the dialog title

Separated by a colon, as per the new design.

* Update snapshots

* Update a playwright test

* Fix more tests / snapshots

* Attempt to test all the cases of titleForTabID

* More tests
2024-05-07 09:32:24 +00:00
Florian Duros 95ee2979c8
Tooltip: improve accessibility of the right panel (#12490)
* Move to `AccessibleButton`

* Update snapshots

* Update playwright snapshots
2024-05-03 08:44:04 +00:00
Travis Ralston d25d529e86
Extract functions for service worker usage, and add initial MSC3916 playwright test (when supported) (#12414)
* Send user credentials to service worker for MSC3916 authentication

* appease linter

* Add initial test

The test fails, seemingly because the service worker isn't being installed or because the network mock can't reach that far.

* Remove unsafe access token code

* Split out base IDB operations to avoid importing `document` in serviceworkers

* Use safe crypto access for service workers

* Fix tests/unsafe access

* Remove backwards compatibility layer & appease linter

* Add docs

* Fix tests

* Appease the linter

* Iterate tests

* Factor out pickle key handling for service workers

* Enable everything we can about service workers

* Appease the linter

* Add docs

* Rename win32 image to linux in hopes of it just working

* Use actual image

* Apply suggestions from code review

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

* Improve documentation

* Document `??` not working

* Try to appease the tests

* Add some notes

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2024-05-02 22:19:55 +00:00
Florian Duros 2df946b5b1
Tooltip: Use `AccessibleButton` in `RovingAccessibleTooltipButton` (#12458)
* Use `AccessibleButton` in `RovingAccessibleTooltipButton`

* Update snapshots

* Update @vector-im/compound-web

* Update playwright

* Remove placement
2024-04-30 09:35:58 +00:00
David Baker 281916fd96
Take the Threads Activity Centre out of labs (#12439)
* Take the TAC out of labs!

Requires https://github.com/matrix-org/matrix-react-sdk/pull/12438
and ideally https://github.com/matrix-org/matrix-react-sdk/pull/12418

* i18n

* Add test method

That's needed now we we don't include threads in the notif count in the tests

* One less labs setting

* Update snapshot

* Disable release announcement

* Unused import

* Fix some screenshots

* Fix all the unread test cases now room unreads don't include threads

* Fix more tests

* Even more test fixes

* Still more test fixes

* Oh goodness, it's more test fixes

* Fix selectors now there are 2 buttons called Threads

* Disable some tests that aren't passing

for reasons that don't appear releated to any of the TAC work, as
per the comment.

* Remove debugging

* Oops, removed too much
2024-04-29 15:30:19 +00:00
Florian Duros 5815e70b76
TAC: Release Announcement (#12380)
* WIP

* Store the release announcements in the account settings

* Update TAC release announcement description

* Fix settings content comparison

* Add logging in case of failure

* Watch settings changes

* I add release announcement settings to disable it

* Disable release announcement in e2e test

* Add release announcement in e2e test

* Add tests for ReleaseAnnouncementStore.ts

* Update compound-web to `3.3.0`

* Update TAC tests

* Update Labs tests

* Nits

* Add test for ReleaseAnnouncement.tsx

* Update `@vector-im/compound-web`

* Add playwright snapshot

* Delete false playwright screenshot

* Wait for EW to be displayed after reload

* Add screenshot

* Clean util file

* Renaming and comments fixing

* Use second store instead of looking in the store.

---------

Co-authored-by: R Midhun Suresh <hi@midhun.dev>
2024-04-08 08:43:59 +00:00
David Baker f37821d62c
Fix/disable failing playwright tests (#12402)
* Set display name earlier to fix playwright test

Unsure why this is failing on CI, it's fine locally. Let's try
setting the display name earlier to see if that fixes it.

* Disable failing presence test

also comments

* Link issue too
2024-04-05 18:07:25 +00:00
Michael Telatynski 56d7911897
Iterate styles around Link new device via QR (#12356)
* Rearrange user settings tab order to move Sessions up to 2nd

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate copy & iconography on Settings > Sessions > Link new device

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate design of Scan QR code screen

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak styles

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update tests and snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update tests and snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-03-22 15:50:06 +00:00
Robin a0795c7518
Improve readability of badges and pills (#12360)
* Improve readability of badges and pills

Badges will now always use light theme colors so that they become white-on-gray in both themes, and the contrast of pills has been increased so that they use primary action colors as the background.

* Fix tests
2024-03-22 00:27:13 +00:00
Michael Telatynski ea3fff2d2f
Fix some playwright flaky tests (#12357)
* Fix flaky test `should memorize the timeline position when switch Room A -> Room B -> Room A`

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix flaky test `should be correctly rendered - high contrast theme`

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix flaky test `Cryptography › setting up secure key backup should work isDeviceVerified=false`

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-03-21 15:49:12 +00:00
Robin 26b4d47af1
Refine the colors of some more components (#12343)
* Refine the colors of some more components

This is a reintroduction of https://github.com/matrix-org/matrix-react-sdk/pull/12255, and should be the last part of the Compound color refinement work (https://github.com/element-hq/element-web/issues/26992). I've updated the following components to reflect design decisions (https://www.figma.com/file/pqhlirZFEwEp5XpudSbiia/Theming-Web-templates?type=design&node-id=80-60219&mode=design&t=mjqwylUie1vRwzOV-0) that will help them fit in better with the new design system:

- Message bubbles
- Pills
- Sent indicators
- Jump to bottom/unread buttons
- Composer placeholder
- Notification badges
- Room sublists
- Verification shields
- Date separators
- Tooltips

Closes https://github.com/element-hq/element-web/issues/22122

* Update some screenshots
2024-03-18 15:47:55 +00:00
Florian Duros e247d31808
TAC: Order rooms by most recent after notification level (#12329)
* Order room by thread timestamp

* Fix key errors in test

* Update jest snapshots

* Update snapshots

* Rename alpha/beta to numbers

* Add playwright test
2024-03-15 09:11:52 +00:00
Florian Duros e309410266
TAC: Fix hover state when expanded (#12337)
* Fix TAC hover state

* Add playwright test

* Update playwright snapshot after last compound style changes
2024-03-14 16:21:18 +00:00
Robin 80c4c3c28c
Refine styles of menus, toasts, popovers, and modals (#12332)
* Refine styles of menus, toasts, popovers, and modals

This is a reintroduction of https://github.com/matrix-org/matrix-react-sdk/pull/12247, with the difference that modal styles have now been refreshed as well.

* Restore the fixed heights of some dialogs

* Fix formatting and flaky screenshot
2024-03-13 13:38:32 +00:00
Robin 6eafe0e5a8
Refine styles of controls to match Compound (#12299)
This changes the styles of buttons, other form controls, and tabs in settings to:

1. Improve their usage of semantic colors, so that they adapt correctly to custom themes
2. Make them more visually coherent with the new Compound design system, as we integrate more of it into the app

This is a re-introduction of https://github.com/matrix-org/matrix-react-sdk/pull/12241 with the difference that we're now using our branding colors again on form colors, and buttons have become rounded to match the appearance of new Compound buttons.
2024-03-05 04:25:47 +00:00
David Baker 5ac222e1c4
Fix alignment of user menu avatar (#12289)
* Fix alignment of user menu avatar

https://github.com/matrix-org/matrix-react-sdk/pull/12267 made the avatar
a couple of pixels out of alignment with the space icons. It just needed
to be moved 2px to the right to match the 18px margin of the space icons
(including the padding from the black border).

Also change elements in the user menu to block elements so they don't
generate extra vertical space in the user menu div, which was causing the
hairline to be too far down.

* Update snapshots

* Typo

Co-authored-by: Robin <robin@robin.town>

* Reference the span by class

* The img wasn't actually necessary here

---------

Co-authored-by: Robin <robin@robin.town>
2024-02-27 19:50:44 +00:00
David Baker ebd0a046b1
Fix the space panel getting bigger when gaining a scroll bar (#12267)
* Fix the space panel getting bigger when gaining a scroll bar

Just makes the scrollbar gutter stable and removes 8px of padding
to compensate, so it will make the bar slightly larger, but it will
no longer change size weirdly if you have too many spaces in too short
a window.

* Tweak margins to keep space panel the same size

* Try 1px more

* Try 1px more to the left

* Fix sizes and disable flex when in narrow mode

* Update screenshots

* Another screenshot

* Last screenshot hopefully
2024-02-21 15:18:58 +00:00
Florian Duros 6d55ce0217
Use browser's font size instead of hardcoded `16px` as root font size (#12246)
* WIP Use browser font size instead of hardcoded 16px

* Add font migration to v3

* Remove custom font size input

* Use a dropdown instead of a slider

* Add margin to the font size dropdown

* Fix `UpdateFontSizeDelta` action typo

* Fix `fontScale`in `Call.ts`

* Rename `baseFontSizeV3` to `fontSizeDelta`

* Update playwright test

* Add `default` next to the browser font size

* Remove remaining `TODO`

* Remove falsy `private`

* Improve doc

* Update snapshots after develop merge

* Remove commented import
2024-02-21 11:23:07 +00:00
Florian Duros 96a33b800a
Revert "Use Compound primary colors for most actions" (#12264)
* Revert ed5ef023b2

* Update failing snapshots

* Update snapshots after develop merge
2024-02-20 16:24:40 +00:00
David Baker d20e9e4f8e
Fix gradients spacings on the space panel (#12262)
* Fix gradients spacings on the space panel

Make the gradients two separate ones so they can be fixed pixel widths
from the top & bottom rather than percentages of the height.

Tweak the spacings between the user menu & threads panel to match
the figma and from Gaelle's design.

* Update snapshots

* More screenshots
2024-02-20 15:28:46 +00:00
Florian Duros ac435c8d4e
Revert "Refine menu, toast, and popover colors (#12247)" (#12263)
This reverts commit 0856c7617d.

Co-authored-by: David Langley <langley.dave@gmail.com>
2024-02-20 13:54:33 +00:00
Vri 2c0ee1e114
Fix forced lowercase username in login/registration flows (#9329)
* remove lowercase (proposal)

Lowercase doesn't make sense here (at least in German). I suggest removing it or creating a new translatable string.

* remove lowercase

Lowercase doesn't make sense here (at least in German). I suggest removing it or creating a new translatable string.

* Update screenshot

---------

Co-authored-by: David Baker <dbkr@users.noreply.github.com>
2024-02-15 12:19:15 +00:00
Robin 0856c7617d
Refine menu, toast, and popover colors (#12247)
So that they use Compound semantic colors correctly and appear more similar to the real components now found in Compound.
2024-02-14 22:30:16 +00:00
Robin ed5ef023b2
Use Compound primary colors for most actions (#12241)
* Use Compound primary colors for most actions

The "accent" color variable is something we should generally not use anymore: it maps to a Compound text token, which makes its semantics inappropriate for icons and backgrounds, and it clashes with the primary colors present on the Compound components we're now bringing into the app. As discussed with design, we would like to phase out its usage on interactive components in favor of the correct icon and background colors from Compound. This is a best-effort attempt at applying new colors to all the major places that we were previously using "accent": mainly, buttons and form controls are affected.

* Update some more colors

* Update test snapshots

* Fix broken screenshot
2024-02-13 20:10:07 +00:00
Florian Duros 1c789cbb18
Reduce TAC width by `16px` (#12239) 2024-02-08 14:46:34 +00:00
Florian Duros cf5d9f86fd
Fix TAC button alignment when expanded (#12238) 2024-02-08 14:09:32 +00:00
Florian Duros a4987060b7
Pop out of Threads Activity Centre (#12136)
* Add `Thread Activity centre` labs flag

* Rename translation string

* WIP Thread Activity Centre

* Update supportedLevels

* css lint

* i18n lint

* Fix labs subsection test

* Update Threads Activity Centre label

* Rename Thread Activity Centre to Threads Activity Centre

* Use compound `MenuItem` instead of custom button

* Color thread icon when hovered

* Make the pop-up scrollable and add a max height

* Remove Math.random in key

* Remove unused class

* Change add comments on `mx_ThreadsActivityRows` and `mx_ThreadsActivityRow`

* Make threads activity centre labs flag split out unread counts

Just shows notif & unread counts for main thread if the TAC is enabled.

* Fix tests

* Simpler fix

* Open thread panel when thread clicke in Threads Activity Centre

Hopefully this is a sensible enough way. The panel will stay open of
course (ie. if you go to a different room & come back), but that's the
nature of the right panel.

* Dynamic state of room

* Add doc

* Use the StatelessNotificationBadge component in ThreadsActivityCentre

and re-use the existing NotificationLevel

* Remove unused style

* Add room sorting

* Fix `ThreadsActivityRow` props doc

* Pass in & cache the status of the TAC labs flag

* Pass includeThreads as setting to doesRoomHaveUnreadMessages too

* Fix tests

* Add analytics to the TAC (#12179)

* Update TAC label (#12186)

* Add `IndicatorIcon` to the TAC button (#12182)

Add `IndicatorIcon` to the TAC button

* Threads don't have activity if the room is muted

This makes it match the computation in determineUnreadState.
Ideally this logic should all be in one place.

* Re-use doesRoomHaveUnreadThreads for useRoomThreadNotifications

This incorporates the logic of not showing unread dots if the room
is muted

* Add TAC description in labs (#12197)

* Fox position & size of dot on the tac button

IndicatorIcon doesn't like having the size of its icon adjusted and
we probably shouldn't do it anyway: better to specify to the component
what size we want it.

* TAC: Utils tests (#12200)

* Add tests for `doesRoomHaveUnreadThreads`
* Add tests for `getThreadNotificationLevel`

* Add test for the ThreadsActivityCentre component

* Add snapshot test

* Fix narrow hover background on TAC button

Make the button 32x32 (and the inner icon 24x24)

* Add caption for empty TAC

* s/tac/threads_activity_centre/

* Fix i18n & add tests

* Add playwright tests for the TAC (#12227)

* Fox comments

---------

Co-authored-by: David Baker <dbkr@users.noreply.github.com>
2024-02-07 13:49:40 +00:00
Robin 3052025dd0
Use new semantic tokens for username colors (#12209)
* Use new semantic tokens for username colors

To match the tokens now used by the Compound Web avatar component

* Fix incorrect lock icon

* Update screenshots
2024-02-06 20:54:30 +00:00
Florian Duros 80e75e3b70
Change Quick Settings icon (#12141)
* Change Quick Settings icon

* Update space panel playwright snapshot
2024-01-15 10:56:46 +00:00
R Midhun Suresh 82840a19f9
Playwright: Convert /e2e/polls (#12065)
* Convert tests

* Conver tests

* Move type import down

* Remove reference to cypress types

* Update screenshot

* Remove client.evaluate

* More changes

* Use credentials from bot object

* Use credentials

* Remove comment

* Update screenshots

* Use sendMessage method

* Create dummy test

* Use userId from credentials
2024-01-09 06:28:40 +00:00
R Midhun Suresh a8949ea97c
Playwright: Convert `e2e/threads` (#12066)
* Convert tests

* Update comment

* Use addInitScript

* Add thread-id to sendMessage method

* Update screenshot

* Change signature

* Fix prettier
2024-01-05 09:56:54 +00:00
Michael Telatynski 0a881e2123
Iterate landmarks around the app in order to improve a11y (#12064)
* Iterate landmarks around the app in order to improve a11y

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add missing aria-label

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* i18n

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots which have changed a fraction due to default heading margins being different in different landmarks

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-20 15:32:24 +00:00
Michael Telatynski 4f19356492
Migrate timeline.spec.ts from Cypress to Playwright (#12025)
* Migrate timeline.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Monospace font for timestamps

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* More expects

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-13 14:59:08 +00:00
Michael Telatynski c9008152c5
Migrate widgets/* from Cypress to Playwright (#12032)
* Migrate send_event.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate read_events.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate kick.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate get-openid-token.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate layout.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate events.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate stickers.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate widget-pip-close.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix types

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* expect.poll to stabilise test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-12 17:26:08 +00:00
Michael Telatynski 99cb985d53
Migrate permalinks.spec.ts from Cypress to Playwright (#12004)
* Migrate permalinks.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-12 09:56:55 +00:00
Michael Telatynski 5104d53ddf
Migrate remaining crypto tests from Cypress to Playwright (#12021)
* Fix bot MatrixClient being set up multiple times

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate verification.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate crypto.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Record trace on-first-retry

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Don't start client when not needed

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add bot log prefixing

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Turns out we need these

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix crypto tests in rust crypto

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-12 08:55:29 +00:00
Michael Telatynski 6199287fe7
Migrate audio-player.spec.ts from Cypress to Playwright (#12008)
* Migrate audio-player.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise bot MXID length

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise test user MXID

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise timestamps

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update element-web-test.ts

* Use deterministic monospace font

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-11 14:36:30 +00:00
ElementRobot f848d99f2d
Localazy Download (#12014)
* [create-pull-request] automated change

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots with deterministic language

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: github-merge-queue <github-merge-queue@users.noreply.github.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-09 18:38:01 +00:00
Michael Telatynski 5ae5855fd9
Improve stability of Playwright screenshots (#12009)
* Stabilise bot MXID length

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise test user MXID

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-07 10:32:23 +00:00
Michael Telatynski ab9604056d
Migrate invite-dialog.spec.ts from Cypress to Playwright (#11990)
* Remove old percy media query CSS

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise soft_logout.spec.ts

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots using `toMatchScreenshot` assertion with CSS overrides

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix accidentally commented test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate invite-dialog.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove spurious await

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-06 16:04:07 +00:00
Michael Telatynski fb1a97be32
Migrate room-directory.spec.ts from Cypress to Playwright (#11997)
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-05 15:20:20 +00:00
Michael Telatynski b02ff16a21
Migrate room/* from Cypress to Playwright (#11985)
* Remove old percy media query CSS

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise soft_logout.spec.ts

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots using `toMatchScreenshot` assertion with CSS overrides

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix accidentally commented test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate room/* from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update labs.ts

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-04 12:01:06 +00:00
Michael Telatynski eb6101cc1b
Migrate spaces.spec.ts from Cypress to Playwright (#11986)
* Remove old percy media query CSS

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Stabilise soft_logout.spec.ts

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots using `toMatchScreenshot` assertion with CSS overrides

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix accidentally commented test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate spaces.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-04 11:56:48 +00:00
Michael Telatynski e180ca841b
Improve stability of Playwright screenshot tests (#11983) 2023-12-04 11:02:48 +00:00
Michael Telatynski 446400b6b6
Migrate right-panel/* from Cypress to Playwright (#11954)
* Migrate file-panel.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate right-panel.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate notification-panel.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix test flakes

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Try stabilise test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* sleep

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Handle both cases

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix assertion

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Flip

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-01 12:24:49 +00:00
Michael Telatynski e897d7360d
Migrate user-view.spec.ts from Cypress to Playwright (#11944)
* Migrate user-view.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add bot support & update screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Use JSHandle

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove stale snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update element-web-test.ts

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-11-29 16:39:27 +00:00
Michael Telatynski 1b3f473c10
Migrate settings/* from Cypress to Playwright (#11949)
* Migrate location.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate location.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate appearance-user-settings-tab.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate device-management.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate general-room-settings-tab.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate general-user-settings-tab.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate preferences-user-settings-tab.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate security-user-settings-tab.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Deflake

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Move settings into subclass

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-11-29 13:50:13 +00:00
Michael Telatynski 83f0650ed4
Migrate most of editing.spec.ts from Cypress to Playwright (#11947)
* Migrate location.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate location.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Deflake

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-11-28 13:52:09 +00:00
Michael Telatynski fbf72f6a3a
Migrate register.spec.ts from Cypress to Playwright (#11942)
* Install playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add foundations for writing tests under Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* .gitignore juggling

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add tsconfig and fix eslint rules

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add docker & synapse plugins

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add login.spec.ts

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Wire up fixture which sets up ElementAppPage & bakes config.json

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove launch test, it has served its purpose

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove test which has been ported to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix test not cleaning up after itself

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Move registerUser to the Homeserver interface

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove unused fixture param

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove redundant launch test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add newline

* Run both legacy & rust crypto tests in Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove redundant comment

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Create plugin for mail-hog

* Move injectAxe into element-web-test.ts

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Switch out axe-playwright for @axe-core/playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate email.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* prettier

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Use Playwright snapshot utility over Percy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove commented our Percy badge as we're unlikely to want to go back

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate user-onboarding-old.spec.ts

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate user-onboarding-new.spec.ts

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix bad merge

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix test and re-enable

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Run linters on playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Make typescript happier

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix types

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update typescript

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate register.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update import

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: R Midhun Suresh <hi@midhun.dev>
2023-11-28 12:08:05 +00:00
Michael Telatynski dbae856141
Consolidate snapshots between Legacy & Rust crypto in the happy case (#11950)
* Consolidate snapshots between Legacy & Rust crypto in the happy case

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve user-onboarding-new screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-11-28 10:22:25 +00:00