imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix flaky Percy tests of ReplyChain (#10450)

Browse source 
* Fix flaky Percy tests of ReplyChain

- Add media query for percy on _ReplyChain.pcss to apply the same color to vertical strokes (border-left)of ReplyChain
- Use CSS variables for visibility
- Manage those variables on _common.pcss for maintainability

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Check receptSent as well for consistency

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Add a comment

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Specify zero spacing and remove list-style

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

---------

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
This commit is contained in:
Suguru Hirahara 2023-03-27 21:13:25 +09:00 • committed by GitHub
parent cc0f38d5b4
commit afb2cb93f2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 44 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

8
res/css/_common.pcss
View file

@ -45,6 +45,14 @@ $timeline-image-border-radius: 8px;
--MessageTimestamp-width: $MessageTimestamp_width;
}
@media only percy {
:root {
--percy-color-avatar: $username-variant2-color;
--percy-color-displayName: $username-variant1-color;
--percy-color-replyChain-border: $username-variant1-color;
}
}
@media (prefers-reduced-motion) {
:root {
--transition-short: 0;

2
res/css/views/avatars/_BaseAvatar.pcss
View file

@ -58,7 +58,7 @@ limitations under the License.
@media only percy {
/* Stick the default room avatar colour, so it doesn't cause a false diff on the screenshot */
.mx_BaseAvatar_initial {
background-color: $username-variant2-color !important;
background-color: var(--percy-color-avatar) !important;
border-radius: 125px;
}
.mx_RoomAvatar_isSpaceRoom .mx_BaseAvatar_initial {

8
res/css/views/elements/_ReplyChain.pcss
View file

@ -64,3 +64,11 @@ limitations under the License.
--username-color: $username-variant8-color;
}
}
/* Percy screenshot test specific CSS */
@media only percy {
.mx_ReplyChain {
/* Override the colour in percy tests for screenshot consistency */
border-left-color: var(--percy-color-replyChain-border) !important;
}
}

2
res/css/views/messages/_DisambiguatedProfile.pcss
View file

@ -38,6 +38,6 @@ limitations under the License.
@media only percy {
.mx_DisambiguatedProfile_displayName {
/* Override the colour in percy tests for screenshot consistency */
color: $username-variant1-color !important;
color: var(--percy-color-displayName) !important;
}
}

13
res/css/views/rooms/_ReplyTile.pcss
View file

@ -139,3 +139,16 @@ limitations under the License.
}
}
}
@media only Percy {
/* Remove the list style in percy tests for screenshot consistency */
:is(ul, ol) {
padding: 0 !important;
margin: 0 !important;
list-style: none !important;
.mx_EventTile_last {
padding: 0 !important;
}
}
}