Track the number of times people use any of the export options from the Changes panel:
- Copy All Changes button
- Copy Rule button
- Copy Rule context menu option
- Copy Declaration context menu option
Differential Revision: https://phabricator.services.mozilla.com/D22090
Adds a new option to the context menu which is visible only when it's invoked on a CSS declaration.
Builds a string with the property name and value and copies to the clipboard.
If the declaration is marked as removed, the string is wrapped in a comment block.
Differential Revision: https://phabricator.services.mozilla.com/D21526
This patch adds a boolean option to skip the cached value of `StyeRuleActor.authoredText` and re-parse the stylesheet for its value.
When changing content of a descendant rule inside an ancestor like @media or @select, the cached `authoredText` value is outdated.
This yields incorrect data when requesting the complete rule authored text, hence the need for a cache-busting option.
In addition to this change, there is a slight refactor to include the generated unique selector for the mock-rule for element inline styles.
Differential Revision: https://phabricator.services.mozilla.com/D21033
Depends on D21007
Adds a Copy All Changes button to the toolbar of the Changes panel.
When pressed, this builds a stylesheet out of the changes for all sources tracked (stylesheets, element styles, etc)
The output format is the same as the now defunct Bug 1524548 with the added code comment as separator between the sources.
Differential Revision: https://phabricator.services.mozilla.com/D21008
Adds a button that shows up when hovering selectors in the Changes panel.
When clicked, it invokes the same Copy Rule behavior implemented for the context menu: copies the full content of the rule with changes applied.
The added/changed CSS class names use BEM notation. I intend to refactor the Changes panel stylesheet to BEM in a follow-up patch.
Differential Revision: https://phabricator.services.mozilla.com/D20808
Depends on D20808
Adds a Copy All Changes button to the toolbar of the Changes panel.
When pressed, this builds a stylesheet out of the changes for all sources tracked (stylesheets, element styles, etc)
The output format is the same as the now defunct Bug 1524548 with the added code comment as separator between the sources.
Differential Revision: https://phabricator.services.mozilla.com/D21008
Adds a button that shows up when hovering selectors in the Changes panel.
When clicked, it invokes the same Copy Rule behavior implemented for the context menu: copies the full content of the rule with changes applied.
The added/changed CSS class names use BEM notation. I intend to refactor the Changes panel stylesheet to BEM in a follow-up patch.
Differential Revision: https://phabricator.services.mozilla.com/D20808
Depends on D18704
Adds a new option to the context menu to copy the changes for a rule as valid CSS text.
Removed properties are commented out. Added properties are used as-is. Style source information is listed as a code comment above the CSS rule.
Makes use of the new Redux selector introduced in Part 2 (see D18704) to build a stylesheet text with the changes per-rule. That will be reused for copying all changes per-stylesheet.
Moves the copy text selection handler out to the ChangesView to co-locate it with other (upcoming) copy actions.
Adds data-ruleid and data-sourceid to DOM elements to help match the target element to the rule/source in the Redux store.
Differential Revision: https://phabricator.services.mozilla.com/D18706
Adds three new scalars for counting the numer of times:
- the default copy action is triggered, regardless of method
- the context menu is shown
- the copy option from the context menu is used
Differential Revision: https://phabricator.services.mozilla.com/D17667
ChangesView was challenging because the async call was in the constructor. I moved it out of the
constructor to the init method, and do a check to see if its been initialized in the destroy method.
Depends on D11886
Differential Revision: https://phabricator.services.mozilla.com/D11887
- removes duplication of logic to create each panel.
- removes needless exposing of panel instances as properties on `inspector`:
- `inspector.layoutview`
- `inspector.fontinspector`
- `inspector.animationinspector`
- `inspector.changesview`
- updates tests to not rely on those exposed properties and instead
call `inspector.getPanel(toolId)` (previously created panels are stored
and a reference is returned).
- consolidates panel `destroy()` so we don't have to remember to
destroy them individually.
MozReview-Commit-ID: GVkP6z7FxKt
Differential Revision: https://phabricator.services.mozilla.com/D10053
Depends on D9659
Adds infrastructure and tests for validating that changes to CSS
declarations in the Inspector Rule view are tracked and show up in the
Changes panel.
Makes use of the `client/inspector/rules/test/head.js` file with helpers
to instrument changes in the Rule view then observe results on the
Changes panel.
This is a first pass on tests. More will follow to validate:
- declarations in at-rules;
- nested at-rules;
- declarations in various sources: inline styles, external stylesheets.
Differential Revision: https://phabricator.services.mozilla.com/D9660
Depends on D9257
We need to clear the store of previous changes but we should not remove
references and event listeners to the ChangesActor since the DevTools
session is still active.
MozReview-Commit-ID: Okp2CcSlfw
Differential Revision: https://phabricator.services.mozilla.com/D9659
