As Olivero loads, the content shifts around.

This is due to two issues:

1) a BigPipe placeholder exists for the messages, which is then removed. Olivero gives this a margin bottom, which causes jank when it's removed.

2) A contextual region is loaded without the .contextual CSS class (which does a position: absolute;). Because the region is in the flow of the page, it causes a layout shift when the .contextual CSS class is added

Moving attached.

CommentFileSizeAuthor
#9 j-r-capture 2024-05-08 a la(s) 11.44.19 a. m..mov1.9 MBjavi-er
#9 j-r-capture 2024-05-08 a la(s) 11.44.02 a. m..mov2.51 MBjavi-er
olivero-jank.mp4475.81 KBmherchel

Issue fork drupal-3446078

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

mherchel created an issue. See original summary.

mherchel opened merge request !7972

mherchel changed the visibility of the branch 3446078-olivero-content-shift to hidden.

mherchel opened merge request !7974

mherchel changed the visibility of the branch 3446078-eliminate-olivero-jank to hidden.

mherchel opened merge request !7975

mherchel’s picture

mherchel
he/him
Primary language English
Location Gainesville, FL, US
commented
Issue summary: View changes
mherchel’s picture

mherchel
he/him
Primary language English
Location Gainesville, FL, US
commented
Status: Active » Needs review
javi-er’s picture

javi-er commented
Status: Needs review » Reviewed & tested by the community
StatusFileSize
new j-r-capture 2024-05-08 a la(s) 11.44.02 a. m..mov2.51 MB
new j-r-capture 2024-05-08 a la(s) 11.44.19 a. m..mov1.9 MB

Looks good to me, both functionality and code changes.

Before and after MR videos attached.

  • ckrina committed d4367113 on 11.x 
    Issue #3446078 by mherchel, javi-er: Olivero content shift on page load

  • ckrina committed 387d6d6e on 11.0.x 
    Issue #3446078 by mherchel, javi-er: Olivero content shift on page load

  • ckrina committed dd0ee83f on 10.4.x 
    Issue #3446078 by mherchel, javi-er: Olivero content shift on page load

  • ckrina committed 7b292f05 on 10.3.x 
    Issue #3446078 by mherchel, javi-er: Olivero content shift on page load
ckrina’s picture

ckrina
she/her
Primary language Catalan
Location Barcelona
commented
Status: Reviewed & tested by the community » Fixed

Committed 7b292f0 and pushed to 10.3.x. Thanks!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.