We want to make the slim_header.html as the basis for the modern header
template that will be used everywhere, eventually replacing header.html.
Rather than making the page explorer be the special case where we want
the last item to be bigger, do it the other way around i.e. use the
smaller font size on the create/edit views. This ensures that the big
font size is used on all other views e.g. Inspect view.
Remove use of shared/filters.html, as it contains a duplicate `<form>` element we don't want, and generally has more stuff we don't want than stuff we do, to the point that it'll just get in the way of restyling.
Where possible, adopt a subset of stylelint-config-wagtail changes.
- Formatting & ordering (auto applied), this includes the padding/inset shorthand changes
- Adopt a small set of no-union-classes changes as an example of changes to come in future PRs
- Ignore some areas where we are selecting against data* attributes that will not be practical to change
- Move some no-important ignore rules to specific lines
- Ignore max-combinators in modeladmin styles (legacy)
- Remove error messages forced-color-adjust setting to none
- Ensure that some rules are always ignored in overrides (aka vendor) styles. This avoids us having to add ignore comments all over these styles.
- Resolves #10719
At this point wagtailadmin/shared/field.html is still used by FieldPanel, as well as third-party code. Replace this by a template that simply pulls the relevant context variables from the template and passes them on to `{% formattedfield %}` (which renders them using the old template, now renamed formatted_field.html). This will allow us to move logic from the template to the tag function without breaking the existing wagtailadmin/shared/field.html API.
- Set the side panel width custom property ('--side-panel-width') globally, not just on the form container.
- Use this custom property to determine the max width of the form content.
- Fixes #11038
Ensures that when the iframe content is loaded there is a background on the iframe. So that transparent websites show correctly in the preview panel.
Fixes #11174
These will not be removed in 6.0, to ensure that the two-release deprecation period is still in place.
The removal of the legacy moderation is an exception, as this was slated for removal from 2.x, long before the deprecation warnings were put in place.
- Remove the sidebar duplicate JS that would also add a ready class but NOT after a settimeout, only after the component renders
- This means we now have one location in the code that does this, driven by Stimulus
- Update the Storybook preview JS so that we can rely on similar behaviour in Storybook for transitions
- Controller will automatically add or remove some initial classes when connected
- An optional delay can be set to have this run after a settimeout
- Replace the core.js ready class addition (which would run after a settimeout)
- Accessing constructor was confusing and createController is not a core requirement
- Avoid modifying the base Stimulus application class
- Expose `window.StimulusModule` as the module output
- Expose `window.wagtail.app` as the Wagtail Stimulus application instance
- Rename root element variable to `root` in initStimulus (so we do not conflict with potential action option registration that uses `element` variable names)
- Pull in the wagtail.components to the same core.js file and add JSDoc for exposed global
- Relates to #10197
- This constraint is not required in unit tests where the output of a class is not the main thing being tested
- Avoid noise in tests by just removing disabling this linting rule in these files
- There is one case where the closing tag was malformed
- All other cases are just ensuring the final backtick is on the closing tag's line
- This allows IDEs to better pick up on html within template tags
- Replace global util window.updateFooterSaveWarning with the w-messages usage
- Remove window.updateFooterSaveWarning usage in core.js & move 'delay before clearing' time delay to the Stimulus value
- Fix JSDoc usage in `enableDirtyFormCheck`
- Add aria-live="polite" so message updates can be advised to screen readers
- Add release considerations and for `window.updateFooterSaveWarning` removal
- Closes #10091
- Changes default show-delay to zero (immediate) and update the w-messages (page messages) to have the 100ms delay
- Add support for 'hide' classes to be added/removed based on clone usage
- Add support for calling the clear method from actions, and resetting classes if used after a clear delay value
- Add JSDoc descriptions to most other properties, add better TS types
- Pull out logic to get template content to class method
- Based on initial work in #10327
- Register with two identifiers; w-messages & w-clone
- Update unit tests and basic JSDoc to align with new naming
- This allows the Controller to reflect the 'behaviour' not the 'usage'
- Allow the debounced function to be used with a Promise API
- Allow debounce to be called with a non-number/falsey to indicate there should be no wait (runs immediately)
- Add error handling
- Refine types to be better to work with for callers
- Add full unit test suite to implementation
Handsontable has support for merging table cells using the `mergeCells`
plugin but there was no support in Wagtail for storing which cells have
been merged or rendering them in the output template.
The client JavaScript will now save which cells have been merged and
the output template will merge or hide cells.
See https://handsontable.com/docs/6.2.0/Options.html#mergeCells
- Adds a new generic `RevealController` that handles the ability for content to be opened/closed while updating the relevant parts of the DOM such as aria-expanded on the toggle.
- Register this controller as a generic `w-reveal` and also the `w-breadcrumb` identifiers so that we can differentiate usage via different DOM attributes and events.
- Closes #10118
- Passing anything to Promise.resolve just means that will be the return value of the promise (.then)
- This does not actually run the function (e.g. in the case of requestAnimationFrame)
- Avoiding unit tests that could cause confusion in the future
- This allows us to pass extra data for the widget to use in a backwards-compatible way.
- FieldBlock: render 'required' and 'aria-describedby' attributes when appropriate
- Ensure options passed to `render` override defaults
- FieldBlock: add test proving options are constructed and passed down
- Allow Telepath's widget rendering to take options
- Include extra accessibility-related attributes in html output
- Resolves missing required attribute on input elements for required fields
- Resolves missing aria-describedby attribute on input element when the field has help text.
- Partial work on #10300
- The `update` util's types are not compatible with future TS v5 adoption.
- This util is simply a wrapper around `Object.assign` and only used in three places.
- Instead use the Object.assign in place for simplicity instead and remove the `update` util.
- Align JS with latest Eslint package updates
- Update configs to ignore new defaults not required in test files
- Update Controller js usage & configs for classProperty naming rules
- Remove eslint ignore directives no longer required due to changed defaults
- Test that uses setTimeout never ran as Tippy relies on `transitionend` events, which JSDom will not dispatch. Rework tests to correctly test this custom event gets dispatched
- Use Stimulus dispatch method for custom event dispatching as the controller name (e.g. 'w-dropdown') will automatically be added, work around TypeScript bug in Stimulus which should be fixed in a future release https://github.com/hotwired/stimulus/issues/642
- Add show/hide methods, pull out options to own get method
- Add unit tests for show/hide, content being in dropdown
- Relates to #10557
- Removes six inline scripts completely, no longer relying on window.headerSearch
- Update the fallback Stimulus Swap controller afterLoad to be a deprecated method
- Add upgrade considerations
- Fix regression from d554cbe310 where manually submitting page search results would load the partial, not full page response
- Closes #9950
- Builds on #9952
- Create a new method `submit` and `submitLazy` to serialise a form's inputs and submit (GET) async to replace content
- Create a lazy version of `replace` and add unit tests for it
- Partial progress on #9950
- Use a console.error spy to avoid the console error bubbling into logs for FieldBlock.test.js (also allows us to confirm an error was thrown)
- Adopt proper approach to 'flush promises' now that API is available for JSDom usage of microtasks/animation frame
- Adapt to new Jest timer mocking approach, use legacy timers in one file as there is not a suitable setTimeout (with zero delay) while also using async await
- `uuid` update is required to avoid import errors - https://github.com/uuidjs/uuid/blob/main/CHANGELOG.md#900-2022-09-05
- Add stubs for window.scrollTo to avoid console errors when running tests
- Filter out warnings for Draftail React warnings, these are unlikely to be resolved anytime soon and add noise to the Jests tests that are unhelpful
- Closes #10043
- Removes the jQuery slide animation so content will be instantly replaced
- Removes the autofocus behaviour on the search fields as this is not helpful for screen readers / keyboard control
- Includes support for `window.header` if provided alongside dynamic adding of data-* attributes if not included
- Base implementation for #9950
- Co-authored-by: sage <laymonage@gmail.com>
- Stimulus CountController content is programatically generated but best to avoid writing HTML accidentally
- ChooserModel field required label should avoid risk of translations with HTML
- Image focal point chooser's label does not need to support HTML
- FieldBlock us using h util but this can be avoided by built in browser escaping when innerText is used
- focal-point-chooser gets value from its set up but we should avoid innerHTML if we can
- Add support for a default 100ms debounce on apply calls so that multiple events (e.g. keyup) do not impact performance
- Refine the delay for updating the field to not use setTimeout by default as this async behaviour is no longer needed for basic usage
- Add unit tests for debounce functionality and clean up unit testing to ensure each test can run in isolation
- Add explicit tests for non-inpu fields such as select (update code to ensure we use setter not setAttribute to support these)
- Add ability to support an action param for a fixed value being synced to another field
- Relates to #10517
- Allow compareAs behaviour to be overridden via the event detail OR a param
- Enhance types to be more strict, refine JSDoc to be clearer about the default behaviour
- Add unit tests for default compare function and make logic a bit easier to read in regards to how the slugify/urilify methods are conditionally called
- Relates to #10532
- When errors occur on chooser modal content, find the local progress buttons that are in loading state and update the value
- Stimulus will automatically resolve all DOM changes based on the dynamic value update
- Add unit tests for functionality
- Fixes #10498
- Regression from #9910 & #10062
- The function created is pluralIdx (capital I), the underlying Django function is pluralidx
- Update our gettext JSDoc to align with our usage of pluralIdx (capital I)
- Optimized/Customized/Catregorize -> Optimised/Customised/Categorise
- Github -> GitHub (80% were spelt with capital H, this is the way GitHub spells itself)
- GitPod -> Gitpod (most were without the capital P, Gitpod's site does not use capital P)
- Remove duplicate words (to to, the the)
- De-coupled -> decoupled
- implementors -> implementers (all other references used 'site implementers' so just aligning with the common case)
- Fix a/an usage in one case
- Fix one comment usage of ok, replace with OK
Fixes #10427.
In d51ec00ce1, the target was changed from
'[data-field] > .handsontable' to '.handsontable', as the .handsontable
element is no longer a direct descendant of the [data-field] element.
However, this means that we're marking ALL elements with .handsontable
as resize targets, which is not ideal as pretty much all elements
generated by Handsontable have that class.
The original logic would presumably only select the outermost element
with the .handsontable class, which is equal to the element with the
foo-handsontable-container ID (we store this in the containerId
variable).
Frankly, removing this selector outright would also fix the issue. That
said, let's keep this selector in anyway, to match the logic in older
releases.
Regression in 933a730928 introduced in 4.2.
This causes the discrepancy seen between 4.1 vs 4.2 (and later). In 4.2,
this check was broken, which means the event handler never gets added.
The combination of the event handler and the incorrect selector (fixed
in the next commit) would resize all Handsontable elements, resulting in
the bug where the table cannot be interacted with.
The commit b9f8a6b6c0 fixed another cause
of the issue, which was calling `resizeWidth(getWidth())`. The
getWidth() function should only be used to set the Handsontable's
settings, while resizeWidth should be called with '100%' as done within
the event handler.
However, seeing that the event listener is not even attached in 4.2
onwards, dispatching the resize event might not be necessary and
Handsontable might already handle this correctly. That said, let's
avoid making other changes that could potentially cause issues.
With this commit, the bug should reappear in 4.2 and later releases,
making it consistent with 4.1. The bug will be fixed in the next commit.
Previously, we rely on the fact that the SubMenuItem itself is a dismissible. So, we decide how to show/hide the number badge based on the value for the SubMenuItem's dismissible ID on the server. However, this means that if the user has dismissed the SubMenuItem and we add new dismissible child items within it (e.g. update the ID for the 'What's new in Wagtail version' child item), the number badge will not show up. This commit changes the logic to show/hide the number badge based on whether there are any undismissed items within the SubMenuItem and whether the it has been opened or not.
* Extract userbar BaseItem.get_context_data()
* Extract Axe config into smaller attributes and methods for easier overrides
* Add TypeScript interface for WagtailAxeConfiguration
* Improve typings for userbar.ts
* Separate Axe `runOnly` and `rules` options
* Pass request object to all axe configuration methods
* Remove Axe runOnly option if it's falsy
* Add docs for customising the accessibility checker
* Use lists for Axe include and exclude selectors
* Parse JSON script when testing accessibility checker config
* Add tests for customising accessibility checker configuration
Co-authored-by: Thibaud Colas <thibaudcolas@gmail.com>
- If values were false/empty string, it would fall back to the event value
- Instead, ensure that the custom event details OR the param can be used to override this and stop redirection
- Closes #10247
- adding BulkController files and removing {% block extra_js %} from submit_translation.html
- add unit tests for new controller
- partial work on CSP compliance #7053
* Move all help text above fields
* Adjust vertical spacing of form fields and panels
* Move the page title’s help text below the field
* Release notes
- Removed initAutoPopultae function from editor.js
- Added the compare and urlify methos to SlugController
- Wrote tests for SyncController, added more test cases to slugController
- Closes #10088
- move Handsontable render after load & resize width after load
- stops firing a resize event
- adjusts targets to account for the changed markup
- fixes #9107
- Ensure that the change events bubble as this is the default browser behaviour
- By default, changes to hidden values will not fire a `change` event, nor those that are a result of programatic changes to `value, so instead this needs to be added manually so that other code can listen to changes to chosen fields with DOM event listeners.
- https://stackoverflow.com/questions/6533087/jquery-detect-value-change-on-hidden-input-field/8965804#8965804
- Closes #10187
- Introduce a new controller `MessagesController` to contain the dynamic updating of messages
- Ensure the document updated label does not repeat every time a document is updated
- Using the Stimulus controller with templates approach, icons can easily be pre-loaded for each message type
- Ensure that messages are consistently cleared when new ones are added (this was done ad-hoc across some usage and not others)
- Fixes #9493
All setError methods now accept an instance of the error dict returned by get_error_json_data. Since this is consistent across all ValidationError subclasses, there is no longer any need for the exception type to match the block type (unless you care about propagating child block errors).
Fixes #5663
- use milliseconds instead of seconds for duration
- allow `em` to be used without target attribute
- added connect method for labelTarget
- closes #8232
- closes #9910
- Resolves #9972
- Avoids inline script for a solution that can be CSS/HTML only
- Use translatable alt text for when the default avatar is selected
- Relates to #1288 & #5247 (CSP compliance)
- Move dialog template code from the userbar base template to the
accessibility item template
- Use fragment for the total results count in the header
- Wrap dialog header in a div to allow styling it separately from the
rest of the dialog content
- Get selector from the first element of axe violation's node.target
Enable / disable the open-modal button on reaching the limit, as we do for InlinePanel's standard add button; and when handling the response from the modal, stop adding new items when max_num is reached
We keep data-chooser-url in the HTML output, and use it as a fallback in the JS - for backwards compatibility with existing BaseChooser subclasses that don't pass an options dict (such as AdminTaskChooser, which overrides render_js_init)
At this point we've been turning the 'opts' dict from a private API specific to PageChooser, that more or less transparently passes options on to the modal as URL query parameters, into a convention shared across all chooser widgets where the question of "will this option become a URL parameter" is an internal implementation detail. Since this is notionally a bundle of JS variables rather than a bundle of URL params, we should take this opportunity to consistently adopt camel case, before this pattern becomes widespread in third-party code and ends up as a mishmash of camel-case and snake-case.
The old signature is still accepted for backwards compatibility.
This then matches the signature of the other chooser widget JS classes, allowing PageChooserFactory to extend the generic ChooserFactory.
This will allow us to refactor it, including adding class-level references to window.PageChooser and window.PageChooserModal as necessary, without dealing with the possibility of telepath/widgets.js being imported before the includes that define those.
This matches the implementation in components/ChooserWidget. This change breaks the tests that pass a jQuery collection object rather than a DOM element, but that was never valid in the first place as per https://docs.wagtail.org/en/stable/reference/streamfield/widget_api.html - fix the tests accordingly.
Previously, anything invoking the chooser modal needed to make its own call to ModalWorkflow, which meant it needed to import the corresponding 'onloadHandlers' dict, know the appropriate chosen response identifier to listen to, and know how to modify the chooser URL to pass parameters (if applicable). This would mean a lot of duplicated logic if there were multiple places where the modal is invoked.
Here we introduce a ChooserModal base class which encapsulates those details - a caller just needs to instantiate it with the base URL, and call `open` on it to open the modal (passing an options dict and a response callback).
- Revise 'redirect' from a string to a 'continue' boolean that defaults to false
- Use 'continue=true' for cases where we do not want to create a next param on submit that takes the user back to the current page
- Fixes #9815
- Fix any issues in files being ignored
- Fixed linting errors where appropriate
- Include some rules being ignored in the src/components folder
- Closes #8731