In preparation for grid work where the table of contents will
be moved into a new container.
Bug: T303484
Change-Id: I931d5148e314c1c05f0474b47be5efd7c166144d
Add action=edit to the exclusions in $wgVectorMaxWidthOptions
and update the parsing of the query string values for that config
variable to accept a regex.
Bug: T307725
Change-Id: Iba526033d45e18cb340a2648378d3d90ef3ae3c6
Moves the page's title above the article toolbar (i.e. tabs) based
on the VectorTitleAboveTabs config option. This feature remains
off by default, but can be accessed via the query parameter `vectortitleabovetabs`.
Removes the Navigation.mustache template since it's just a wrapper
for the sidebar + tabs elements, which, with this change, are placed
in different locations in the DOM and don't need a common parent element.
Bug: T303549
Change-Id: Id4816b753a1b2133c53c3b1d390b45631c704daf
Self-closing tags are so XHTML. HTML5 allows them on some elements, but
doesn't require them. Cleaning up for consistency and for a few bits
saved to clients.
Change-Id: I781b8d79bbd5dd1ee75a167718964c1142ecfc5d
- `MediaWiki\Skins\Vector\Tests` is now the prefix for all tests in the skin
- we followed PSR conventions of following folder structure after the prefix
- Optimize imports/use order
- update namespace in skin.json
Bug: T303102
Change-Id: Ib76374d81d973c83adfd6c8e7863ff6d797e655d
Additional changes:
* Make the query string parameter optional and if not defined set it
to lowercase configuration name. I think this makes it more predictable
as some configuration flags are prefixed with vector and some without.
This has the following consequences:
languageinheader => vectorlanguageinheader
languageinmainpageheader => vectorlanguageinmainpageheader
languagealertinsidebar => vectorlanguagealertinsidebar
titleabovetabs => vectortitleabovetabs
Note since table of contents query string is used in the A/B test
I've kept that as tableofcontents for now.
Bug: T303484
Change-Id: Iaca026ef5f32836098dc3b6f0f18632fe84fa8d0
An issue was found in QA where certain browser/screenreader combos could not read `aria-labelledby`+`aria-label`. Instead, we avoid using `aria-labelledby` and the `label` element entirely and apply the accessible label directly to the `input`. This great simplifies our labelling and improves screenreader support, while also allowing us to hide the `label` element to reduce verbosity.
Because the `label` element is used differently in the portal menu, we use the `is-portal` variable to maintain the old markup for portal menus
Bug: T301051
Change-Id: I5a0f7d5d78838fabe561095b33176e7162b31aea
Adds a feature called VectorTitleAboveTabs that will be used to
toggle a forthcoming feature that moves the page title above the
tabs (the ones that link to talk/history etc).
Bug: T303549
Change-Id: Ibadb4293eca16a83e5e7a9f90ddcf51fab0a0e41
- Remove the 'vector-scrolled-below-table-of-contents' class, reducing the number of classes added with JS and simplifying the scrollObserver logic
- Move the 'vector-sticky-header-visible' class from the sticky header element to the body element. Hopefully, this is where other feature specific classes can go in the future
- This approach means the TOC will not need JS to update it's spacing when the sticky header is not enabled
Bug: T307345
Change-Id: I1084defc7025f5c946e22a36d373224fae6f8bd6
Creates two new templates:
- ContentHeader.mustache containing the site header and indicators or languages
- ContentSubheader.mustache containing site tagline and conditionally indicators
This changes DOM order.
- It adds the `<header class="mw-body-header">` to all pages,
including special pages & edit pages, not just pages with the language button.
- It moves the #siteSub element (tagline) outside of the
`<div id="bodyContent">` element.
- Adds a clearfix (or margin-collapse fix) to `.vector-body`.
This changes causes a minor difference (perhaps improvement) where on special pages,
the beginning of the content, starting with the `mw-specialpage-summary` element,
was positioned closer to the page title than on regular pages.
The clearfix ensures that the height between the page title and content is consistent across all pages.
Bug: T303549
Change-Id: I29ba337dbd6f9b0cf58c9a0ca517a9ba59cef414
Structural change to prepare for CSS grid usage.
ArticleToolbar component is defined and self contained with
all layout rules relating to toolbar
UI regression testing suite shows 6 failures due to pixel alignment
changes to tabs. When comparing to the current release, you should
see 34 failures before /and/ after this change.
Notable changes:
- #mw-head element is no longer present in modern Vector skin
to allow us to distinguish between cached HTML and modern HTML
Bug: T303484
Change-Id: Ia261ea53931217f32a21b33c2ab3d4ec64efa48a
This is a follow up to I34ace0aeb3e23d8f6a8c5a8680bb492f37e343ad
On Special:Userlogin a "more" menu appears that's visible but empty
that should not
Bug: T306229
Change-Id: I9384b3015de9991db41bde8ccc8f404ac533f198
* Use pt-tmpuserpage for the temp user name.
* Use the userAnonymous icon for the temp user personal tools menu.
* Suppress the logout menu item for temp users.
Depends-On: Ib14a352490fc42039106523118e8d021844e3dfb
Bug: T300263
Change-Id: I8ac5de82f76a9ec58b0fbef85546bc7fd5b793d2
Remove JavaScript that collapses tabs and replace with an easier
to maintain breakpoint based solution.
Tabs will now collapse below the tablet breakpoint
Note: In the case of mw.util.addPortletLink, to add items to the
`views` menu, these will not be collapsed into the more menu and
must now be explicitly added to both menus, ie. if the window is
resized these will hide and not appear in the more menu.
However, when mw.util.addPortletLink attempts to add to `views` menu
when there is not available space, we will redirect those links to
the more (`cactions`) dropdown menu.
Bug: T306229
Change-Id: I34ace0aeb3e23d8f6a8c5a8680bb492f37e343ad
Ideally the TOC has an h2 after the article title h1, but because of the TOC sticky positioning and its placement in the grid, we cant use an h2 without messing up the heading order.
Bug: T301051
Change-Id: I462ddfb618ddd422c9f71293280d1790c4846f50
Replaced “vector-menu-heading” with ‘’(empty string) in “$portletData['heading-class'] = '';”
in includes/SkinVector.php and updated accordingly the includes/templates/Menu.mustache file.
Updated “vector-menu-heading” with ‘’(empty string) in stories/LanguageButton.stories.data.js,
stories/UserLinks.stories.data.js, and tests/phpunit/integration/SkinVectorTest.php respectively
SkinVector and Storybook are cleaned up.
Bug: T290281
Change-Id: I4ca16953799b3dc52e45674bb398c78f14cfc842
The article ID shouldn't matter for display of table of contents
unless the A/B test is enabled.
This also has the added benefit of making the content provider
work with table of contents on articles again (content provider articles
always have a page id of 0)
Change-Id: I6af5e1476827828d0974ecbb110476ac1e5dc0c9
It didn't vary by the skin version as documented in the Constants class,
and merely another instance of GlobalVarConfig.
Change-Id: I0acd0366a241e04bb79f6aae5dc52284dfa578df
* Bucket and sample on server by using the
`WikimediaEvents.WebABTestArticleIdFactory` service from
WikimediaEvents (soft dependency)
* Add linkHijack.js so that users bucketed in one group have the
possibility of remaining in that group if they click a link to another
page.
Bug: T302046
Depends-On: Ie6627de98effb3d37a3bedda5023d08af319837f
Change-Id: Iff231a976c473217b0fa4da1aa9a8d1c2a1a19f2
The LatestSkinVersionRequirement is problematic for various reasons:
1) It uses the "useskin" query string
parameter which may or may not refer to the correct
skin (in the case of a non-existent skin it will always come to the conclusion that
it is not modern Vector and thus must be legacy).
2) It uses the User object which may or may not be safeToLoad
depending on when called.
The feature seems redundant at this point, as we are separating code
into separate classes Vector and Vector22 and all the features only apply
to modern Vector. I suggest we remove it and use the features explicitly in the skin
intended.
Bug: T305232
Bug: T305262
Bug: T302627
Change-Id: I92fa33547bd601e05ddc8c1468e681892e47c16b
Make it possible for Vector to be a non-default skin. Only set a user
preference on newly created accounts if that has been explicitly
requested in config.
This should have no effect on WMF production.
Change-Id: I52f62cf7eb78d2be4c59821a3cf29da9619602d9
Can be merged when database rows have been updated to
no longer use skin version.
* Drop migration code
* Drop skin version preference
* Drop default skin version and existing accounts skin version
* Move skin definitions into skin.json
* Repurpose SkinVector as an abstract class
* Update READMEs
Bug: T301930
Bug: T294995
Bug: T302627
Change-Id: I7454d8f1cfdef81e7f3df476d8ce86736b46fff2
- Remove references to the removed wgVectorUseWvuiSearch
configuration
- Remove mw-body qualifier on Indicators component.
- Drops some cache related FIXMEs
Change-Id: I6823b9c5bf19a067b56badf29f874a7127867a09
Removed class "vector-menu-checkbox-expanded" and "vector-menu-checkbox-collapsed" in
includes/templates/Menu.mustache and deleted the necessary lines in
resources/common/components/MenuDropdown.less, tests/jest/stickyHeader.test.js,
includes/templates/skin.mustache, skin.json, i18n/en.json and i18n/qqq.json.
Bug: T299173
Change-Id: Ibf8a08e6e5d1a6c607abf170c030a0285e84ad74
Namespaceless class aliases are left behind for migration purposes.
They can be removed at a later date when dependant extensions
and skins are fully updated.
Bug: T301204
Change-Id: I2b37c1889ff862ec8bb41325fc9f654c673cd115
Replaced h3 tag in includes/templates/Menu.mustache with label tag.
Replaced h3 elements in .storybook/icons.less, resources/common/components/Menu.less,
resources/common/components/MenuDropdown.less, resources/common/components/MenuPortal.less,
resources/common/components/MenuTabs.less,resources/skins.vector.styles.legacy/components/MenuDropdown.less,
resources/skins.vector.styles/components/UserLinks.less, resources/skins.vector.styles.legacy/components/Sidebar.less
and resources/skins.vector.styles.legacy/layouts/screen.less
by vector-menu-heading.
Bug: T290280
Change-Id: I6eee7d6bc47c74a62166d4579fd4d3da3dc88e88
- Add test for SkinVector::shouldLanguageAlertBeInSidebar() method.
- Change some methods to protected status -- acknowledging this is not
an optimal change. Until we can pull out some of the language checks
into its own class with injected dependencies (title, feature manager,
languages), this is an interim solution to try to catch regressions
since the conditional states for showing the alert are complex and
ultimately temporary. Extracting the language checks into their own
class can be done in a follow up ticket to help optimize testing
language checks in isolation.
Bug: T302018
Change-Id: I99b7df3029e0af86e4d67b3f446d4ce99260d33e
In order to make the TOC go below the sidebar menu, we must reorder the sidebar menu to be directly before the sticky TOC element.
This change involves cached HTML, so this change is separated out from the rest of the CSS changes to be merged first.
Bug: T300875
Change-Id: I8c0924f6de28b15602969de873a843b4cd69548b
This avoids the RuntimeException in old Vector, and means
we can safely enable this on the beta cluster
Note, for any users that are in migration mode e.g. skin is
set to 'vector' and the skin version is set to 2 they will
not see a table of contents in the sidebar or article.
This won't be a problem in production provided T299104
is resolved before we enable.
Change-Id: I942a1cb933e7364600fe1af7491aca20546545e5
Server render the table of contents in a collapsed state when the total
number of headings is equal or greater than the value of
`$wgVectorTableOfContentsCollapseAtCount`. Otherwise, the table of
contents will be server rendered in its "expanded" state.
In addition:
* Revise table of contents tests to call one `assertion` per element so
that it is easier to see the exact element that may fail an assertion.
* Revise table of contents tests to call a mount function that can merge
props to allow for a more flexible set of tests.
* Revise table of contents tests by wrapping a `describe` around tests
that expect the same prop state.
* Adds typedef for table of sections props
Bug: T300973
Depends-On: Ifaee451e1903f2accd0ada2f2ed6dfa3f83037b6
Change-Id: I382200bc603b6abf757a91f14a8a55a6581969bd
This uses the sticky header's `.mw-sticky-header-element` utility class
to conditionally offset the table of contents to the height of the
sticky header only when the sticky header is enabled.
Bug: T300077
Change-Id: Ibad97a11e708ba19acf27ca82320f7c3e5f80447
Collapses sub-sections in the new table of contents by default
(except for non-js and reduced-motion users) and expands the
sections when the top-level section link has been clicked.
Refactors the `activateSection` TableOfContents methods into separate
`activateSection` and `deactivateSection` functions.
Adds `expandSection` and `collapseSection` methods.
Adds triangle icon as a visual expand/collapsed indicator
next to all ToC section headings and are hidden via CSS based on
whether or not the section contains subsections.
Adds test for tableOfContents.
Bug: T299361
Change-Id: I36b3ae7f9f633877683bc17a9444c970d7fa7293
This is often used by gadgets/scripts to request
information from the API. Given `vector` means old Vector
now that leads to styling issues.
The unfortunate side effect of this is that any code
checking mw.config('skin') === 'vector' will no longer work
and we'll likely need to patch various gadgets accordingly.
Bug: T300814
Change-Id: Ic920e91960cf81790096395256b75f8ed0dc4173