Objective:
Refactor UI widgets, improve usability and accessibility of menus, general cleanup and style improvements.
Extras:
Fixed documentation in a few other files to make descriptions of jQuery event arguments more consistent, classes inherit correctly, and made use of the @cfg functionality in jsduck.
Changes:
.docs/config.json
* Added window, HTMLDocument, HTMLElement, DocumentFragment and XMLHttpRequest to externals, so jsduck doesn't throw warnings when they are used
demos/ve/index.php, modules/ve/test/index.php, VisualEditor.php
* Moved widgets above tools (since tools use widgets)
demos/ve/index.php
* Refactored widget initialization to use options
* Renamed variables to match widget names
ve.init.mw.ViewPageTarget.css
* Adjusted text sizes to make widgets work normally
* Added margins for buttons in toolbar (since button widgets
don't have any)
* Removed styles for init buttons (button widgets now)
ve.init.mw.ViewPageTarget.js
* Switched to using button widgets (involved moving things around
a bit)
ve.ui.LinkInspector.js, ve.ui.MWLinkInspector.js
* Renamed static property "inputWidget" to
"linkTargetInputWidget" to better reflect the required base class
for the properties value
icons.ai, check.png, check.svg
* Added "check" icon, used in menu right now to show which item
is selected
ve.ui.Icons-raster.css, ve.ui.Icons-vector.css
* Added check icon
* Removed :before pseudo selectors from most of the icon classes (not need by button tool anymore, makes them more reusable now)
ve.ui.Tool.css
* Adjusted drop down tool styles so menu appears below, instead
of on top, of the label
* Adjusted paragraph font size to better match actual content
* Updated class names to still work with menu widget changes
(items are their own widgets now)
* Updated selectors as per changes in the structure of button tools
ve.ui.Widget.css
* Added styles for buttons and menu items
* Adjusted menu styles
ve.ui.*ButtonTool.js
* Added config options argument passthrough
ve.ui.ButtonTool.js
* Moved var statement to the top inside constructor
* Switched to using "a" tag to get cross-browser :active support
* Added icon to inside of button to make icon styles more reusable
* Removed disabled support (now provided by widget parent class)
ve.ui.FormatDropDownTool.js
* Updated options initialization to construct menu item objects
* Modified handling of items to account for changes in menu and
item classes
* Optimized onUpdateState method a bit, adding early exit to
inner loop
ve.ui.ButtonTool.js, ve.ui.DropdownTool.js, ve.ui.Context.js,
ve.ui.Frame, ve.ui.Tool.js, ve.ui.Widget.js
* Added chain ability to non-getter methods
ve.ui.DropdownTool.js
* Removed items argument to constructor
* Updated code as per changes in menu class
* Fixed inconsistent naming of event handler methods
* Removed item event handling (now handled by items directly)
* Made use of this.$$ to ensure tool works in other frames
ve.ui.Tool.js
* Made tools inherit from widget
* Moved trigger registry event handler to a method
ve.ui.Context.js
* Switched from using menu to contain toolbar to a simple wrapper
ve.ui.js
* Added get$$ method, a convenience function for binding jQuery
to a specific document context
ve.ui.*Widget.js
* Switched to using a config options object instead of individual arguments
* Added options
* Factored out flags and labels into their own classes
* Refactored value setting methods for inputs
ve.ui.MenuWidget.js, ve.ui.MenuItemWidget.js
* Broke items out into their own classes
* Redesigned API
* Updated code that uses these classes
* Added support for keyboard interaction
* Made items flash when selected (delaying the hiding of the menu for 200ms)
ve.ui.LinkTargetInputWidget.js, ve.ui.MWLinkTargetInputWidget
* Refactored annotation setting methods
Change-Id: I7769bd5a5b79f1ab36f258ef9f2be583ca503ce6
demos/ve/demo.css, demos/ve/index.php
* Style changes for utilities and dump output
* Initially disable the log range button, activate when there's a range to log
* Make range inputs read-only
* Rename some widget variables
* Add extra structure and classes to dump output
ve.ui.Widget.css
* Remove left/right margin for buttons
* Simplify opaque white color
* Modify selector for disabled buttons - see changes in ve.ui.Widget.js
* Added styles for text input widget's readonly and disabled states
ve.ui.Widget.js
* Added disabled state
ve.ui.ButtonWidget.js
* Moved click event handler to method
ve.ui.InputLabelWidget.js
* Moved click event handler to method
ve.ui.InputWidget.js
* Moved input change event handler to method
* Added readOnly state
ve.ui.LinkTargetInputWidget.js
* Corrected documentation
ve.ui.MenuWidget.js
* Blocked interaction while widget is disabled
ve.ui.MWLinkTargetInputWidget.js
* Corrected documentation
* Blocked interaction while widget is disabled
ve.ui.TextInputMenuWidget.js
* Blocked interaction while widget is disabled
Change-Id: I7ea89873b50a98d058d1dd1e309e3e8b7c8e7b2e
* New! Button and InputLabel widgets
* Using new buttons in the demo
* Moved styles around to generalize input styles
Change-Id: Ic42e133f8fe0fffcb61374c09dd5668db82a4799
TODO: Use these buttons other places! (like ve.init)
Graphics (*.ai, *.png, *.svg)
* Took a pass on all images making them sharper and clearer
* Renamed bold and italic to bold-b and bold-a
* Added bold-f, italic-k, bold-a and italic-a
* Reorganized illustrator file
ve.ui.Icons-raster.css, ve.ui.Icons-vector.css
* Added classes for new icons
* Appended bullet, number, indent and outdent class names with "list"
ve.ui.*ButtonTool.js
* Added definitions for static icon property
* For bold and italic, added i18n style definitions
ve.ui.ButtonTool.js
* Switched from re-using the name property (which is intended to be the symbolic name of the tool used when registering with the tool factory) to using an static icon property for defining the icon
Change-Id: I43e7c35835a1e6dfb06f2a70226fac0d395008e8
* Made method descriptions imperative: "Do this" rather than "Does this"
* Changed use of "this object" to "the object" in method documentation
* Added missing documentation
* Fixed incorrect documentation
* Fixed incorrect debug method names (as in those VeDmClassName tags we add to functions so they make sense when dumped into in the console)
* Normalized use of package names throughout
* Normalized class descriptions
* Removed incorrect @abstract tags
* Added missing @method tags
* Lots of other minor cleanup
Change-Id: I4ea66a2dd107613e2ea3a5f56ff54d675d72957e
Objectives:
* Make the link inspector easier to use
* Try to resolve a few bugs (bug 43841, bug 43063, bug 42986)
* Stop using jquery.multiSuggest (which didn't really understand annotations)
* Better divide MediaWiki specifics from generic implementations
Changes:
VisualEditor.php, modules/ve/test/index.php, demos/ve/index.php
* Updated links to files
ve.Registry
* Fixed mistake where registry was initialized as an array - this didn't cause any errors because you can add arbitrary properties to an array and use it like any other object
ve.Factory
* Removed duplicate initialization of registry property
* Added entries property, which is an array that's appended to for tracking the order of registrations
ve.CommandRegistry
* Added mwLink command which opens the mwLink inspector
ve.ui.TextInputWidget
* Added basic widget class for text inputs
ve.ui.TextInputMenuWidget
* Added widget that provides a menu of options for a text input widget
ve.ui.MWLinkTargetInputWidget
* Added MediaWiki specific link target widget
ve.ui.MenuWidget
* Converted ve.ui.Menu into a widget
* Moved the body of onSelect to onMouseUp
ve.ui.LinkTargetInputWidget
* Added link target widget which adds link annotation functionality to a normal text input
ve.ui.InputWidget
* Added generic input widget which emits reliable and instant change events and synchronizes a value property with the DOM value
ve.ui.Widget
* Added base widget class
* Widgets can be used in any frame
ve.ui.Tool
* Fixed line length issues
ve.ui.InspectorFactory
* Made use of new entries property for factories to select the most recently added inspector if more than one match a given annotation
ve.ui.Inspector
* Added auto-focus on the first visible input element on open
* Moved afterClose event to after re-focus on document on close
* Added documentation
ve.ui.Frame
* Adjusted documentation
* Added binding of $$ to the frame context so it can be passed around
* Added documentation
ve.ui.Context
* Added ve.ui.Widget.css to iframes
* Updated code as per moving of ve.ui.Menu to ve.ui.MenuWidget
* Removed unused positionBelowOverlay method
* Added CSS settings to set overlay left and width properties according to context size
* Added documentation
ve.ui.DropdownTool
* Updated code as per moving of ve.ui.Menu to ve.ui.MenuWidget
ve.ui.FormatDropdownTool
* Added documentation
ve.ui.MWLinkButtonTool
* Added MediaWiki specific version of ve.ui.LinkButtonTool, which opens the mwLink inspector
ve.ui.Widget.css
* Added styles for all widgets
ve.ui.Tool.css, ve.init.sa.css, ve.init.mw.ViewPageTarget.css, ve.init.mw.ViewPageTarget-apex.css
* Updated code as per moving of ve.ui.Menu to ve.ui.MenuWidget
ve.ui.Menu.css
* Deleted (merged into ve.ui.Widget.css)
ve.ui.Menu.css
* Deleted suggest styles (no longer used)
pending.gif, pending.psd
* Added diagonal stripe animation to indicate a pending request to the API
ve.ui.MWLinkInspector
* Added MediaWiki specific inspector which uses MediaWiki specific annotations and widgets
ve.ui.LinkInspector
* Removed mw global hint (not needed anymore)
* Switched from comparing targets to annotations (since the target text is ambiguous in some situations)
* Switched to using input widget, which is configured using a static property
* Removed use of jquery.multiSuggest
* Moved MediaWiki specifics to their own class (ve.ui.MWLinkInspector)
ve.init.mw.ViewPageTarget
* Added MediaWiki specific toolbar and command options
Change-Id: I859b5871a9d2f17d970c002067c8ff24f3513e9f
See CODING.md for how to run it.
Mistakes fixed:
* Warning: Unknown type function
-> Function
* Warning: Unknown type DOMElement
-> HTMLElement
* Warning: Unknown type DOM Node
-> HTMLElement
* Warning: Unknown type Integer
-> Mixed
* Warning: Unknown type Command
-> ve.Command
* Warning: Unknown type any
-> number
* Warning: Unknown type ve.Transaction
-> ve.dm.Transaction
* Warning: Unknown type ve.dm.AnnotationSet
-> ve.AnnotationSet
* Warning: Unknown type false
-> boolean
* Warning: Unknown type ve.dm.AlienNode
ve.dm doesn't have a generic AlienNode like ve.ce
-> Unknown type ve.dm.AlienInlineNode|ve.dm.AlienBlockNode
* Warning: Unknown type ve.ve.Surface
-> ve.ce.Surface
* ve.example.lookupNode:
-> Last @param should be @return
* ve.dm.Transaction.prototype.pushReplace:
-> @param {Array] should be @param {Array}
* Warning: ve.BranchNode.js:27: {@link ve.Node#hasChildren} links to non-existing member
-> (removed)
* Warning: ve.LeafNode.js:21: {@link ve.Node#hasChildren} links to non-existing member
-> (removed)
Differences fixed:
* Variadic arguments are like @param {Type...} [name]
instead of @param {Type} [name...]
* Convert all file headers from /** to /*! because JSDuck tries
to parse all /** blocks and fails to parse with all sorts of
errors for "Global property", "Unnamed property", and
"Duplicate property".
Find: \/\*\*([^@]+)(@copyright)
Replace: /*!$1$2
* Indented blocks are considered code examples.
A few methods had documentation with numbered lists that were
indented, which have now been updated to not be intended.
* The free-form text descriptions are parsed with Markdown,
which requires lists to be separated from paragraphs by an
empty line.
And we should use `backticks` instead of {braces} for inline
code in text paragraphs.
* Doc blocks for classes and their constructor have to be
in the correct order (@constructor, @param, @return must be
before @class, @abstract, @extends etc.)
* `@extends Class` must not have Class {wrapped}
* @throws must start with a {Type}
* @example means something else. It is used for an inline demo
iframe, not code block. For that simply indent with spaces.
* @member means something else.
Non-function properties are marked with @property, not @member.
* To create a link to a class or member, in most cases the name
is enough to create a link. E.g. Foo, Foo.bar, Foo.bar#quux,
where a hash stands for "instance member", so Foo.bar#quux,
links to Foo.bar.prototype.quux (the is not supported, as
"prototype" is considered an implementation detail, it only
indexes class name and method name).
If the magic linker doesn't work for some case, the
verbose syntax is {@link #target label}.
* @property can't have sub-properties (nested @param and @return
values are supported, only @static @property can't be nested).
We only have one case of this, which can be worked around by
moving those in a new virtual class. The code is unaltered
(only moved down so that it isn't with the scope of the main
@class block). ve.dm.TransactionProcessor.processors.
New:
* @mixins: Classes mixed into the current class.
* @event: Events that can be emitted by a class. These are also
inherited by subclasses. (+ @param, @return and @preventable).
So ve.Node#event-attach is inherited to ve.dm.BreakNode,
just like @method is.
* @singleton: Plain objects such as ve, ve.dm, ve.ce were missing
documentation causing a tree error. Documented those as a
JSDuck singleton, which they but just weren't documented yet.
NB: Members of @singleton don't need @static (if present,
triggers a compiler warning).
* @chainable: Shorthand for "@return this". We were using
"@return {classname}" which is ambiguous (returns the same
instance or another instance?), @chainable is specifically
for "@return this". Creates proper labels in the generated
HTML pages.
Removed:
* @mixin: (not to be confused with @mixins). Not supported by
JSDuck. Every class is standalone anyway. Where needed marked
them @class + @abstract instead.
Change-Id: I6a7c9e8ee8f995731bc205d666167874eb2ebe23
icons, comment.*, ve.ui.Icons-*
* Added comment icon
ve.init.mw.ViewPageTarget
* Refactored editNoticeButton into being just a tool
* Added feedback tool, which shares the editNoticeButton code
* Added feedback object construction in init constructor
* Added launching code to feedback tool
VisualEditor.i18n
* Renamed editnotices-button message to editnotices-tool to match changes in code
* Added feedback tool message
VisualEditor
* Added dependency on mediawiki.feedback
* Updated changed message key
* Added reference to new message
Change-Id: I813c89a505386a9b3206bfbcb176016e28a592cb
ApiVisualEditor
* Including notices in response to parse actions
ve.init.mw.ViewPageTarget
* Added styles for editNoticeButton and editNotices
ve.init.mw.ViewPageTarget
* Added toolbarEditNoticeButton and toolbarEditNotices
* Combined toolbarEditNoticeButton and toolbarSaveButton setup
* Moved toolbar buttons setup to onLoad (it could vary per-parse now)
* Added tearDownToolbarButtons which fires on deactivate
* Renamed some instances of teardown to tearDown
* Added click handler for toolbarEditNoticeButton
* Added toolbarEditNotices setup method, called on load
* Made notices fade in and out, in by default on load if any
* Made notices hide when save dialog is opened
ve.init.mw.Target
* Added storing of notices on parse
icons, alert, ve.ui-Icons
* Added alert icon
VisualEditor.i18n, VisualEditor
* Added notices button message
Change-Id: I581bf5a005a9c18422f952d71064d17d0ba9b540
* Permits longer page titles in suggestions without changing
the width of the dropdown.
* Addresses (Bug 40675)
Change-Id: Ie76a551970a040074b86c49bb44bda640ecd4845
ve.AnnotationAction
* Added filter to the clearAll method to allow clearing all matching annotations only
ve.dm.Document
* Some variable renaming for consistency
ve.dm.SurfaceFragment
* Added truncateRange method
* Added annotation scope to expandRange method
* Added support for passing an annotation object into annotateContent method
* Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class
* Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found
ve.ui.LinkInspector
* Moved most of the functionality elsewhere
* General reorganization
* Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow
* Check for annotation object before extracting target information from it
* Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined'
icons.ai, inspector.png, inspector.svg
* Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses
ve.ui.Inspector.Icons
* Added inspector icon
* Renamed clear icon to remove to match it's actual image
ve.ui.Context
* Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others
* Now always listening to resize events on the window rather than only while document is focused
* Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore
* Lots of cleanup and reorganization
* No need to fallback to empty array since getInspectorsForAnnotations does so already
* Only consider fully-covered annotations for inspectors
ve.ui.Frame
* Simplified the constructor by introducing the createFrame method
* General cleanup
* Typo fixes
ve.ui.Inspector
* Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.)
* Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil)
* Added getMatchingAnnotations method for convenience
* Added prepareSelection stub
* Lots of cleanup and documentation
* Type pattern is now defined in base class
* Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do
* Removed checks for onOpen or onClose methods since they are now noop stubs and are always there
* Added stub and removed checks for onRemove
* Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance
* Only consider fully-covered annotations when getting matching annotations
ve.ui.InspectorFactory
* Depending on type pattern now since it's always there
* Added getInspectorsForAnnotations method
* Return empty array if annotation set is empty
VisualEditor, VisualEditor.i18n
* Added default inspector message
Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
* Rewrite of all tools, dramatically simplifiying them and decreasing
duplication
* Tools are now created using a tool factory instead of
a make-shift facility built into the toolbar
* All UI object have a surface or a toolbar reference instead of a
surface view
Change-Id: I589ecba36bf715b452d03c8fd5c0547dc3c1dc61
* Only show the inspector if the selected text has an inspectable annotation
* Replace the inline menu with a toolbar containing inspectable annotations
* Change the appearance of the inspector to match new mockups
* Add the trash can icon for removing annotations
* Move iframe handling code into a class that manages all that nonsense
Change-Id: I840f72426f9a9e50054a28de950393f0e9913153
* Added some new icons (to be used soon in the inspector redesign)
* Added right-to-left icons for lists
* Renamed some icons for future RTL use
Change-Id: I10e3e3fcda82786e3064176e7eefe211b88db95c
MultiSuggest:
Added CSS Ellipsis config option which provides CSS to suggestion items.
LinkInspector:
-Configured multiSuggest for page suggestions with CSS ellipsis off and removed CSS definitions.
Instead, using jquery.autoEllpisis plugin for centered position ellipsis. (Bug 39591)
-Temporary tweak to link input padding to prevent text from overlapping down arrow.
Down arrow soon to be implemented differently.
RTL Fixes:
-MultiSuggest overlay positions correctly by setting a width.
-MultiSuggest background image position fix.
Change-Id: I806ead5a2c2621589f76cfb2b03805cbd0b0a18a
* Moved icons into Illustrator (used to be in Photoshop)
* Added SVG icons too
* Added support for devices with pixel ratio > 1 (they use SVG)
* Cleaned up icons (little rendering errors here and there)
* Organized icons into their own folder
* Increased the horizontal margin of the down arrows in the formatting (in the toolbar) and location (in the link inspector) drop down menus
Change-Id: I29b7084c9b1145051b2a76f514cfca9826d53ddb
* Switched a lot of classes from es-* to ve-ui-*
* Removed all the DOM structure left over from the old sandbox demo
* Got rid of transparent backgrounds
* Added menu font-size rule to stand-alone target
* Moved some rules around that were in the wrong places
* Got rid of some unused/unneeded methods in the mw target (attach and detach surface methods)
* Added active class to context icon with shallower shadow effect so it doesn't break your spacial perception when you click on it
* Renamed the iframe and iframe wrapper elements so it's easier to see where they came from
* Removed unused CSS rules
* Fixed some uses of prop( 'class', … ) to addClass
Change-Id: I54a660ca0baf0baa4463faca7a1edcf648130b6b
* function() -> function ()
* ){ -> ) {
* Quoted JSON keys (Look the other way Timo!)
* Using more descriptive group names, which also avoid using "new" as a key
* Line breaks at 100 columns using 4 spaces/tab
* Not setting classes on suggestion items that have no effect (such as 'external' on a div - even on an <a> tag this isn't enough to get the style because it's not inside #content)
Change-Id: I37032fa8ba93adb7b719d9797f9b1b806359cc13
Got rid of some commented out code we aren't going to use and fixed the order of arguments to background position to x, y
Change-Id: I4e638c33b053dd916681dc91c8c0d7cff224375d
* Added more support for making dynamic skin changes in vector (based on media queries) get applied to the toolbar while it's floating
** Added animation for toolbar wrapper margins
** Added resize handler to update left and right positions on the toolbar when it's floated
* Changed from using generic "float" and "bottom" class names which are likely going to get re-used elsewhere and cause issues
Change-Id: Ic596b2b8aceb8a2d81539e197ef4d6e17326a87a
Some of the HTML structure in the suggestions might need to be changed to pull off pixel-perfect reproduction of the original design, but this gets us very close.
Change-Id: Ie574577af4815e4f0fc9f8a03e57759dd9dfff84
-Using keydown on arrows allows preventDefault which stops the cursor movement in the input.
-Consolidated Keydown bindings, no longer unbinding keydown, instead checking for visible state first.
-Using case insensitive comparison for selected item.
-Changed use of ve.inArray to ve.indexOf because method name was changed.
-Moved clear break into suggestion container rather than after it.
Added margin bottom on suggestion container for category separation.
Change-Id: I2bd1db049a948db189194037dc8e38dfe884c197
Created jQuery plugin MultiSuggest which builds a categorized dropdown
under specified input box.
Revised inspector to no longer be an iframe but to contain an Iframe.
This reduces xbrowser issues with positioning and toggling inspector
container.
Added Inspector overlay element for positioning arbitrary elements
over the iFrame. This prevents growing the iframe to arbitrary lenghts.
Change-Id: I8efbbd091b0b24a19a4b73aa122d21a329cf97e4
* Summary label is now placeholder text
* Edit summary and options are visually connected
* Added summary length count-down label
* Removed check-mark icons from toolbar and dialog save buttons
* Made toolbar and dialog save buttons the same size
* Reduced line-height and margins of license information
* Changed from X icon for close (which might be confused with cancel) to ^ icon for collapse
Change-Id: Ib1711f49af8929be12796aecdea49467b726856e
* Classicifation (JS)
Use addClass instead of attr( 'class' ) whenever possible.
addClass will manipulate the properties directly instead of
(re-)setting an attribute which (most) browsers then sync
with the properties.
Difference between:
elem.className
and
elem.setAttribute( 'class', .. );
Just like .checked, .value, .disabled and other interactive
properties, the HTML attributes should only be used for initial
values from the html document. When in javascript, only set
properties. Attributes are either ignored or slow.
* Styling (JS)
Use .css() instead of attr( 'style' ).
Again, setting properties instead of attributes is much faster,
easier and safer. And this way it takes care of cross-browser
issues where applicable, and less prone to error due to dealing
with key-value pairs instead of css strings.
Difference between:
elem.style.foo = 'bar';
and
elem.setAttribute( 'style', 'foo: bar;' );
* Finding (JS)
Use .find( 'foo bar' ) instead of .find( 'foo' ).find( 'bar' ).
It is CSS!
* Vendor prefixes (CSS)
It is important to always list newer (standards-compliant) versions
*after* the older/prefixed variants.
See also http://css-tricks.com/ordering-css3-properties/
So the following three:
-webkit-gradient (Chrome, Safari 4)
-webkit-linear-gradient (Chrome 10, Safari 5+)
linear-gradient (CSS3 standard)
... must be in that order.
Notes:
- "-moz-opacity" is from before Mozilla 1.7 (Firefox < 0.8)
Has not been renamed to "opacity" since Firefox 0.9.
- Removed redundant "-moz-opacity"
- Added "filter: alpha(opacity=**);" where missing
- Fixed order of css3 properties (old to new)
- Add standardized css3 versions where missing
(some 'border-radius' groups didn't have the non-prefixed version)
- Spacing
- @embed
- Shorten hex colors where possible (#dddddd -> #ddd)
$ ack '#([0-9a-f])\1{5}' --css
$ ack '#([0-9a-f])\1{2};' --css
Change-Id: I386fedb9058c2567fd0af5f55291e9859a53329d
