Uploaded image for project: 'Jenkins'
  1. Jenkins
  2. JENKINS-43926

REGRESSION: Loading worm turns white too early when loading dashboard

    • Blue Ocean 1.1-beta4, Blue Ocean 1.1, Blue Ocean 1.1

      When cold loading (ie no cache) things can go "all white" and look broken for a few seconds. 

      This is due to the loading worm turning white prematurely .. 

          [JENKINS-43926] REGRESSION: Loading worm turns white too early when loading dashboard

          Michael Neale added a comment -

          kzantow cliffmeyers is there any detail you could put on this and what a fix may be, perhaps may be a good one for nicu to take a look at to see how things load? 

          Michael Neale added a comment - kzantow cliffmeyers is there any detail you could put on this and what a fix may be, perhaps may be a good one for nicu to take a look at to see how things load? 

          Cliff Meyers added a comment - - edited

          Probably two potential causes to this issue: the background color is changed too early, or it's actually being hidden inappropriately. Note that the loading indicator is automatically shown and hidden as XHR calls are made.

          Files of interest:

          • blueocean-web/src/main/resources/io/jenkins/blueocean/BlueOceanUi/index.jelly - that is where the id="loadbar" element is defined. Inline style block classes are used to set it up in its "white" state and increment itself while the page is loading.
          • blueocean-core-js/.../LoadingIndicator - this is a simple JS object to show/hide the indicator and change the bg color. You may want to add some logging here to show/hide methods just to ensure you know when these methods are being called.
          • blueocean-web/.../main.jsx. Once the extensions are fetched, the loadingIndicator color is switched. Assuming the reason the worm gets hidden is because the bgcolor changes too early, we could instead move the bgcolor change to a callback function that is passed to ReactDOM.render, so it happens after initial render is complete. If it disappears because it's actually being hidden, we need to look into why that is. Could be that something is making an XHR call much earlier in the lifecycle than before.

          Cliff Meyers added a comment - - edited Probably two potential causes to this issue: the background color is changed too early, or it's actually being hidden inappropriately. Note that the loading indicator is automatically shown and hidden as XHR calls are made. Files of interest: blueocean-web/src/main/resources/io/jenkins/blueocean/BlueOceanUi/index.jelly - that is where the id="loadbar" element is defined. Inline style block classes are used to set it up in its "white" state and increment itself while the page is loading. blueocean-core-js/.../LoadingIndicator - this is a simple JS object to show/hide the indicator and change the bg color. You may want to add some logging here to show/hide methods just to ensure you know when these methods are being called. blueocean-web/.../main.jsx. Once the extensions are fetched, the loadingIndicator color is switched. Assuming the reason the worm gets hidden is because the bgcolor changes too early, we could instead move the bgcolor change to a callback function that is passed to ReactDOM.render, so it happens after initial render is complete. If it disappears because it's actually being hidden, we need to look into why that is. Could be that something is making an XHR call much earlier in the lifecycle than before.

            nicu Nicolae Pascu
            michaelneale Michael Neale
            Votes:
            0 Vote for this issue
            Watchers:
            2 Start watching this issue

              Created:
              Updated:
              Resolved: