In this patch we actually have separate `Worker` and `Registration` components. All workers belonging to the same registration appear together under it.
{F2134654}
Note: I left the `Debug` button shown for every worker because sometimes we do have a target even though the worker might be waiting. I'm not sure when/how this happens, but I was able to debug it as well.
{F2134655}
BTW I found a quick –and more reliable? I seems I don't need to reload- way of testing this. **STR**:
- Start a local HTTP server at `mozilla-central/devtools/client/application/test/browser/resources/service-workers`
- Open `localhost:8080/simple.html` (or whatever the port) and open devtools there
- Open `localhost:8080/debug.html` (or whatever the port) and open devtools there
You should be able to see both workers under the same registration scope.
Differential Revision: https://phabricator.services.mozilla.com/D72173
As a result of the first part review and some testing, there were some issues re: repeating things among workers that actually belonged to the registration (the ID's for React keys, `Unregister` button, `Last updated` time…).
Initially I wanted to do the "grouping" of all the workers belonging to the same registration, but I think this is less confusing to use and test.
This patch initiates that work by renaming our `WorkerList` and `WorkerListEmpty` components to `Registration*`.
Differential Revision: https://phabricator.services.mozilla.com/D72172
> IMPORTANT: this depends on https://phabricator.services.mozilla.com/D43050 to be on central. If it has not been merged already, run `arc patch D43050` before downloading this stack.
- Put style rules into their own components stylesheet.
- Used theme-related colors instead of the same ones for both dark and light themes.
- Made selectors to be class-specific (so they have low specificity)
- Removed some unused CSS in `base.css`
- Fix extra blank space when a section of the manifest is empty (made the hardcoded icons array empty so this can be seen)
NOTE: The CSS/markup for the warnings will be handled in https://bugzilla.mozilla.org/show_bug.cgi?id=1575872
Differential Revision: https://phabricator.services.mozilla.com/D43231
> IMPORTANT: this depends on https://phabricator.services.mozilla.com/D43050 to be on central. If it has not been merged already, run `arc patch D43050` before downloading this stack.
`*View` suffixes are sometimes used in JS frameworks context in the same sense we use our `*Page` suffix in here. To avoid confusion –and to have a shorter name– I renamed components to just `Manifest*`
Differential Revision: https://phabricator.services.mozilla.com/D43229
**NOTE: This depends on D35513, so if it has not landed yet, please `arc patch D35513` before patching this one on top.**
- `.devtools-button` styles in `common.css` are kinda broken , so I decided to roll out our own button component (`UIButton`) after consulting with Victoria colors, sizes, etc. The other downside to selectors in `common.css` is that they can have a high specificity :(
- Victoria said to use the "micro" style from Photon as the default style for buttons in the panels. So I created an even smaller "micro" styles (very similar to `.devtools-togglebutton`) for when we need smaller buttons.
- I created some light/dark variables in our stylesheets instead of on `variables.css` because `--theme-button-background` was already taken (only used in a single panel, but still…). Maybe after the buttons are fixed globally in the common folder, we could use the variables there. In the meantime, to avoid losing more time, I rolled out our own vars here.
Differential Revision: https://phabricator.services.mozilla.com/D37883
**NOTE: This depends on D35513, so if it has not landed yet, please `arc patch D35513` before patching this one on top.**
- `.devtools-button` styles in `common.css` are kinda broken , so I decided to roll out our own button component (`UIButton`) after consulting with Victoria colors, sizes, etc. The other downside to selectors in `common.css` is that they can have a high specificity :(
- Victoria said to use the "micro" style from Photon as the default style for buttons in the panels. So I created an even smaller "micro" styles (very similar to `.devtools-togglebutton`) for when we need smaller buttons.
- I created some light/dark variables in our stylesheets instead of on `variables.css` because `--theme-button-background` was already taken (only used in a single panel, but still…). Maybe after the buttons are fixed globally in the common folder, we could use the variables there. In the meantime, to avoid losing more time, I rolled out our own vars here.
Differential Revision: https://phabricator.services.mozilla.com/D37883
Also fixed some CSS related to the "no workers" empty screen:
- Fixed vertical misalignment.
- Made the "You need to register a service worker" text bigger.
- Refactored some CSS rules and removed unneeded styles.
MozReview-Commit-ID: JVduSXIxcV7