silverstripe / silverstripe-admin

Silverstripe Admin Component
BSD 3-Clause "New" or "Revised" License
25 stars 92 forks source link

Loading indicator sits above "re-login" form/modal #809

Open NightJar opened 5 years ago

NightJar commented 5 years ago

The below screenshot is taken from the kitchen-sink testing recipe (versions of all things shown below). I am attempting to test a feature refactor for the comments module (shifting the spam buttons into the "ActionMenu" pop-out menu), and have left it too long between tests. I am being prompted to log back in, however cannot access the input to put my password into as it is below the "loading" vignette for the page, which I've triggered by clicking a GridField_ActionMenuItem.

image

$ composer show | grep framework
behat/behat                                              v3.5.0             Scenario-oriented BDD framework for PHP 5.3
composer/installers                                      v1.6.0             A multi-framework Composer library installer
phpspec/prophecy                                         1.8.0              Highly opinionated mocking framework for PHP 5.3+
phpunit/phpunit                                          5.7.27             The PHP Unit Testing framework.
silverstripe/behat-extension                             4.x-dev 64a4cd7    SilverStripe framework extension for Behat
silverstripe/controllerpolicy                            2.1.x-dev 3ca2866  SilverStripe module providing a framework for per-controller policies. Includes a...
silverstripe/framework                                   4.3.x-dev 544f9e1  The SilverStripe framework
silverstripe/frameworktest                               dev-master 6dd60fd Aids core and module developers in testing their code against a set of sample dat...
silverstripe/recipe-core                                 4.3.x-dev 825cc1a  SilverStripe framework-only core recipe
symbiote/silverstripe-queuedjobs                         4.3.1              A framework for defining and running background jobs in a queued manner
zendframework/zend-authentication                        2.6.0              provides an API for authentication and includes concrete authentication adapters ...
zendframework/zend-eventmanager                          3.2.1              Trigger and listen to events within a PHP application
zendframework/zend-ldap                                  2.10.0             Provides support for LDAP operations including but not limited to binding, search...
zendframework/zend-session                               2.8.5              manage and preserve session data, a logical complement of cookie data, across mul...
zendframework/zend-stdlib                                3.2.1              SPL extensions, array utilities, error handlers, and more

dwagstaff@dylans-pc MINGW64 ~/work/bugday (master)
$ composer show | grep silverstripe
bringyourownideas/silverstripe-composer-security-checker 2.0.x-dev 178ce88  Provides information if your SilverStripe application uses dependencies with know...
bringyourownideas/silverstripe-composer-update-checker   2.0.x-dev 31c5088  Checks if any composer packages needs to be updated.
bringyourownideas/silverstripe-maintenance               2.1.x-dev 7995e0c  Toolset to help with the day by day maintenance work.
dnadesign/silverstripe-elemental                         4.0.x-dev 33ae464  Elemental pagetype and collection of Elements
dnadesign/silverstripe-elemental-subsites                3.0.x-dev 1d2acfc  Adds subsite support to elements
dnadesign/silverstripe-elemental-userforms               3.0.x-dev b635fa1  Adds a new element for usersforms
silverstripe/admin                                       1.3.x-dev b5909ae  SilverStripe admin interface
silverstripe/akismet                                     4.0.x-dev 4829937  Akismet antispam module for Silverstripe
silverstripe/asset-admin                                 1.3.x-dev 0dfce7f  Asset management for the SilverStripe CMS
silverstripe/assets                                      1.3.x-dev 949828e  SilverStripe Assets component
silverstripe/auditor                                     2.1.x-dev b79041c  Adds security audit trail to SilverStripe.
silverstripe/behat-extension                             4.x-dev 64a4cd7    SilverStripe framework extension for Behat
silverstripe/blog                                        3.2.x-dev 9c10a86  A fresh take on blogging in Silverstripe set out to tackle the issue of a clutter...
silverstripe/campaign-admin                              1.3.x-dev 66f3725  SilverStripe campaign admin interface
silverstripe/cms                                         4.3.x-dev 0e8b870  The SilverStripe Content Management System
silverstripe/comment-notifications                       2.0.x-dev 6ffe880  Provides email notifications for visitor comments
silverstripe/comments                                    3.1.x-dev f5c7024  This module provides commenting functionality for Pages and other DataObjects on ...
silverstripe/config                                      1.0.x-dev ab03d6d  SilverStripe configuration based on YAML and class statics
silverstripe/content-widget                              2.0.x-dev 3bf7755  Display HTML content in a widget
silverstripe/contentreview                               4.1.x-dev 3d00342  Flags pages for periodical author review (incl. reporting)
silverstripe/controllerpolicy                            2.1.x-dev 3ca2866  SilverStripe module providing a framework for per-controller policies. Includes a...
silverstripe/crontask                                    2.1.x-dev 554f09d  Module for running tasks with a standard cron timeschedule
silverstripe/documentconverter                           2.0.x-dev 333e969  Imports OpenOffice-compatible files (doc, docx, etc) into SilverStripe pages and ...
silverstripe/elemental-bannerblock                       2.0.x-dev cde2dfa  A banner block for the silverstripe-elemental module
silverstripe/elemental-fileblock                         2.0.x-dev 204f344  A file block for the silverstripe-elemental module
silverstripe/environmentcheck                            2.0.x-dev f6652c2  Provides an API for building environment tests
silverstripe/errorpage                                   1.3.x-dev 5320aab  ErrorPage component for SilverStripe CMS
silverstripe/externallinks                               2.0.x-dev 1cfb249  Adds tracking of broken external links to the SilverStripe CMS
silverstripe/framework                                   4.3.x-dev 544f9e1  The SilverStripe framework
silverstripe/frameworktest                               dev-master 6dd60fd Aids core and module developers in testing their code against a set of sample dat...
silverstripe/fulltextsearch                              3.4.x-dev e4fd283  Adds support for Fulltext Search engines like Sphinx and Solr to SilverStripe CMS
silverstripe/graphql                                     3.0.x-dev 0824685  GraphQL server for SilverStripe models and other data
silverstripe/graphql-devtools                            dev-master 2af93f7 Tools to help developers building new applications on SilverStripe’s GraphQL API
silverstripe/gridfieldqueuedexport                       2.1.x-dev 236b90f  Export large data sets from your GridField in the SilverStripe CMS interface thro...
silverstripe/html5                                       2.0.x-dev dc31f70  HTML5 support for SilverStripe
silverstripe/hybridsessions                              2.1.x-dev 73c7c96  Cookie/DB session support for SilverStripe
silverstripe/iframe                                      2.0.x-dev d9c6292  Add an iFrame pagetype to SilverStripe, to show content from another website
silverstripe/ldap                                        1.0.x-dev a3d5976  Adds LDAP support to SilverStripe including user synchronisation and authentication
silverstripe/lumberjack                                  2.0.1              A module to make managing pages in a GridField easy without losing any of the fun...
silverstripe/mimevalidator                               2.0.x-dev 427757f  Checks uploaded file content roughly matches a known MIME type for the file exten...
silverstripe/mink-facebook-web-driver                    1.0.0              Mink driver for facebook's webdriver
silverstripe/realme                                      3.1.x-dev ed650a0  Adds support to SilverStripe for authentication via RealMe (https://www.realme.go...
silverstripe/recipe-authoring-tools                      1.2.x-dev 500a9b4  Extra tools for CMS authoring in SilverStripe
silverstripe/recipe-blog                                 1.1.x-dev 581b3cd  SilverStripe Blog Project Template
silverstripe/recipe-cms                                  4.3.x-dev 66b715c  SilverStripe recipe for fully featured page and asset content editing
silverstripe/recipe-collaboration                        1.2.x-dev 34e869c  Add extra functionality to enhance CMS user collaboration
silverstripe/recipe-content-blocks                       2.1.x-dev 838016f  Add content blocks to your SilverStripe project
silverstripe/recipe-core                                 4.3.x-dev 825cc1a  SilverStripe framework-only core recipe
silverstripe/recipe-form-building                        1.2.x-dev b4712bc  A recipe of modules to help you build forms in SilverStripe
silverstripe/recipe-plugin                               1.3.0              Helper plugin to install SilverStripe recipes
silverstripe/recipe-reporting-tools                      1.2.x-dev 9c288cb  Add extra CMS reporting tools to your SilverStripe project
silverstripe/recipe-services                             1.1.x-dev 22d88db  Add API and content service modules to your SilverStripe project
silverstripe/recipe-testing                              1.x-dev ab1f7d6
silverstripe/registry                                    2.1.x-dev 6bab060  Provide search and export interfaces for datasets.
silverstripe/reports                                     4.3.x-dev c797d12  Reports module for SilverStripe CMS
silverstripe/restfulserver                               2.1.x-dev 57c0597  Add a RESTful API to your SilverStripe application
silverstripe/securityreport                              2.0.x-dev 7402721  Generates a security and access report for CMS users
silverstripe/segment-field                               2.2.x-dev 17734b0  A reusable approach to segment-generating fields
silverstripe/serve                                       2.x-dev 0074569    Connects the PHP development server to SilverStripe
silverstripe/sharedraftcontent                           2.2.x-dev 3cc82ba  Share draft page content with non-CMS users
silverstripe/siteconfig                                  4.3.x-dev fa24765  Site wide settings administration.
silverstripe/sitewidecontent-report                      3.0.x-dev a6aa171  Report of all pages and files across all subsites
silverstripe/spamprotection                              3.0.x-dev 0c445a1  Spam protection module for SilverStripe.
silverstripe/spellcheck                                  2.1.x-dev 315d302  Improves spellcheck support for SilverStripe CMS, including an implementation for...
silverstripe/subsites                                    2.2.x-dev ce9dd1a  Run multiple sites from a single SilverStripe install.
silverstripe/tagfield                                    2.2.x-dev d7762a1  Tag field for SilverStripe
silverstripe/taxonomy                                    2.0.x-dev f448476  Provide extra taxonomy for cataloguing the data.
silverstripe/testsession                                 2.2.1              Support module for browser-based test sessions, e.g. for Behat behaviour testing
silverstripe/textextraction                              3.0.x-dev 07c000d  Text Extraction API for SilverStripe CMS (mostly used with 'fulltextsearch' module)
silverstripe/userforms                                   5.3.x-dev dd5dbe3  UserForms enables CMS users to create dynamic forms via a drag and drop interface...
silverstripe/vendor-plugin                               1.3.3              Allows vendor modules to expose directories to the webroot
silverstripe/versioned                                   1.3.x-dev 20509a2  SilverStripe Versioned component
silverstripe/versioned-admin                             1.1.x-dev 296b454  SilverStripe versioned admin interface
silverstripe/versionfeed                                 2.0.x-dev 9260d8c  Adds RSS feeds of content changes to SilverStripe
silverstripe/widgets                                     2.0.x-dev ade8047  Widgets are small pieces of functionality such as showing the latest Comments or ...
symbiote/silverstripe-advancedworkflow                   5.1.x-dev b098e74  Adds configurable workflow support to the CMS, with a GUI for creating custom wor...
symbiote/silverstripe-gridfieldextensions                3.2.1              A collection of useful grid field components
symbiote/silverstripe-queuedjobs                         4.3.1              A framework for defining and running background jobs in a queued manner
tractorcow/silverstripe-fluent                           4.2.x-dev b631f75  Simple localisation for Silverstripe
tractorcow/silverstripe-proxy-db                         0.1.0

I guess the short recreate steps would be:

robbieaverill commented 5 years ago

Bump the z-index for the login modal?

NightJar commented 5 years ago

In short, yes. In length: please be sure not to create a race to the sky :)

This is more than likely caused by placement of the respective stacking contexts, examining those and attempting to fix at the root is more reasonable than z-index: calc(9999999999999999+1); I didn't look into this at all, simply bumping z-index probably won't work anyway (if it's a stacking context issue).

ScopeyNZ commented 5 years ago

The other option would be to ensure the loading container is never added after the login modal in the DOM - assuming they currently have default z-index. Would be a case of updating the code that inserts the loading container to look for the login modal container before deciding where to inject the new container.

NightJar commented 5 years ago

Yep, DOM ordering is what I meant by placement :) Ideally the veil is part of the grid field/page component, but currently both of these things are rendered by entwine. In any case I'd expect the loading veil to be closer to the base of the 'main' part of LeftAndMain, rather than in the global root, where I expect the modal to live. Reality could be completely different though.

I'm also slightly befuddled by the loading indicator - should it not also have a veil backdrop over the entire admin area? I'm not 100% on this, but if so... does the loading indicator veil on the page preclude a veil being added to the entire CMS for the modal? @clarkepaul

clarkepaul commented 5 years ago

@NightJar yep there is no reason why it doesn't fill the whole space. Those loading screens should either fill the given panel or the entire screen.