Per T307725, the Visual Editor is meant to open within the constraints of Vector (2022)'s fixed width.
However, there are certain cases (see `===Behavior` below) when people opening VE will see the editing interface span the full width of the browser window they opening it within.
This task involves the work with making it so, in the cases listed below, VE opens within the width constraint the Vector (2022) skin introduces.
=== Behavior
**Meta**
- Skin: **Vector (2022)**
- Editing Interfaces Impacted: **Visual Editor** + **New Wikitext Editor**
- Browser width: **>960px** (I think this is the max width Vector (2022) sets)
- Operating system(s): **all**
- Relevant configuration variables: `$wgVisualEditorUseSingleEditTab`, `$wgVisualEditorEnableWikitext`
- Relevant user preferences: `visualeditor-tabs`
==== Case #1: Navigating to VE by opening the edit link (that appears at the top of content page) in a new tab
1. With the `Vector (2022)` skin setting enabled in `Special:Preferences`, visit any page where the visual editor is available. //E.g. https://en.wikipedia.org/wiki/Maya_Angelou .//
2. Open the {nav Edit this page} in a new tab (e.g. on a Mac, while pressing the {key Command}, click the {nav Edit this page} link that appear at the top of the page; or on Linux right-click the link and select {nav Open link in New Tab}).
//Actual//
3. ❗️ Notice the Visual Editor opens at a width that surpasses the 960px width constraint width Vector (2022) sets
//Expected//
3. ✅ Notice the Visual Editor opens at a width that is no wider than the 960px width constraint Vector (2022) sets
==== Case #2: Navigating to VE directly via URL
1. With the `Vector (2022)` skin setting enabled in `Special:Preferences`, visit any page where the visual editor is available. //E.g. https://en.wikipedia.org/wiki/Maya_Angelou .//
2. Open VE by going to the following URL `https://en.wikipedia.org/w/index.php?title=Maya_Angelou&veaction=edit`
//Actual//
3. ❗️ Notice the Visual Editor opens at a width that surpasses the 960px width constraint width Vector (2022) sets
//Expected//
3. ✅ Notice the Visual Editor opens at a width that is no wider than the 960px width constraint Vector (2022) sets
==== Case #3: Reload the page while the editor is open
1. With the `Vector (2022)` skin setting enabled, visit a page and open VE.
2. Reload the page you navigated to in "1."
//Actual//
3. ❗️ Notice the Visual Editor opens at a width that surpasses the 960px width constraint width Vector (2022) sets
//Expected//
3. ✅ Notice the Visual Editor opens at a width that is no wider than the 960px width constraint Vector (2022) sets
==== Case #4: Switch from wikitext to visual editing
1. Open wikitext editor, e.g. https://en.wikipedia.beta.wmflabs.org/wiki/Test?action=edit (it loads full-width)
2. Use the dropdown at the end of the toolbar to switch to {nav Visual editing}
3. Notice that the URL changes to contain `?action=edit&veswitched=1` and the page does not reload.
4.
* //Actual:// VE loads full-width
* //Expected:// VE should load with a constrained width
=== Done
- [ ] All "Expected" `===Behavior` is implemented
=== References
- T307725#7987614
- T307725#7992956