diff --git a/CHANGELOG.txt b/CHANGELOG.txt index 12c2ace718..0b6f555de4 100644 --- a/CHANGELOG.txt +++ b/CHANGELOG.txt @@ -98,6 +98,7 @@ Changelog * Maintenance: Add changelog and issue tracker links to the PyPI project page (Panagiotis H.M. Issaris) * Maintenance: Add better deprecation warnings to the `search.Query` & `search.QueryDailyHits` model, move final set of templates from the admin search module to the search promotions contrib module (LB (Ben) Johnston) * Maintenance: Add generic `InspectView` to `ModelViewSet` (Sage Abdullah) + * Maintenance: Migrate select all on focus/click behavior to Stimulus, used on the image URL generator (Chiemezuo Akujobi) 5.1.3 (xx.xx.20xx) - IN DEVELOPMENT ~~~~~~~~~~~~~~~~~~ diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 76f7cecf01..a2d6360a22 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -743,6 +743,7 @@ * Panagiotis H.M. Issaris * Damilola Oladele * Olumide Micheal +* Chiemezuo Akujobi ## Translators diff --git a/client/src/controllers/ActionController.test.js b/client/src/controllers/ActionController.test.js index 94bf3f6a45..01d0b32bd0 100644 --- a/client/src/controllers/ActionController.test.js +++ b/client/src/controllers/ActionController.test.js @@ -169,4 +169,34 @@ describe('ActionController', () => { expect(window.location.assign).not.toHaveBeenCalled(); }); }); + + describe('select method', () => { + beforeEach(async () => { + await setup(` + + `); + }); + + it('select should be called when you click on text in textarea', () => { + const textarea = document.getElementById('text'); + + // check that there is no selection initially + expect(textarea.selectionStart).toBe(0); + expect(textarea.selectionEnd).toBe(0); + + // focus + textarea.focus(); + + // check that there is a selection after focus + expect(textarea.selectionStart).toBe(0); + expect(textarea.selectionEnd).toBe(textarea.value.length); + }); + }); }); diff --git a/client/src/controllers/ActionController.ts b/client/src/controllers/ActionController.ts index 567607a7ea..8e17e92ee6 100644 --- a/client/src/controllers/ActionController.ts +++ b/client/src/controllers/ActionController.ts @@ -34,9 +34,16 @@ import { WAGTAIL_CONFIG } from '../config/wagtailConfig'; * * * + * + * @example - triggering selection of the text in a field + *
*/ export class ActionController extends Controller< - HTMLButtonElement | HTMLInputElement + HTMLButtonElement | HTMLInputElement | HTMLTextAreaElement > { static values = { continue: { type: Boolean, default: false }, @@ -91,4 +98,12 @@ export class ActionController extends Controller< if (!url) return; window.location.assign(url); } + + /** + * Select all the text in an input or textarea element. + */ + select() { + if (this.element instanceof HTMLButtonElement) return; + this.element?.select(); + } } diff --git a/docs/releases/5.2.md b/docs/releases/5.2.md index bbffa3c6e8..822be65496 100644 --- a/docs/releases/5.2.md +++ b/docs/releases/5.2.md @@ -121,6 +121,7 @@ depth: 1 * Add changelog and issue tracker links to the PyPI project page (Panagiotis H.M. Issaris) * Add better deprecation warnings to the `search.Query` & `search.QueryDailyHits` model, move final set of templates from the admin search module to the search promotions contrib module (LB (Ben) Johnston) * Add generic `InspectView` to `ModelViewSet` (Sage Abdullah) + * Migrate select all on focus/click behavior to Stimulus, used on the image URL generator (Chiemezuo Akujobi) ## Upgrade considerations - changes affecting all projects diff --git a/wagtail/images/static_src/wagtailimages/js/image-url-generator.js b/wagtail/images/static_src/wagtailimages/js/image-url-generator.js index 70ef76702c..c9e50748ae 100644 --- a/wagtail/images/static_src/wagtailimages/js/image-url-generator.js +++ b/wagtail/images/static_src/wagtailimages/js/image-url-generator.js @@ -79,10 +79,5 @@ $(function () { $form.on('change', $.debounce(500, formChangeHandler)); $form.on('keyup', $.debounce(500, formChangeHandler)); formChangeHandler(); - - // When the user clicks the URL, automatically select the whole thing (for easier copying) - $result.on('click', function () { - $(this).trigger('select'); - }); }); }); diff --git a/wagtail/images/templates/wagtailimages/images/url_generator.html b/wagtail/images/templates/wagtailimages/images/url_generator.html index 7c91f1f8a0..3ff4e20a4e 100644 --- a/wagtail/images/templates/wagtailimages/images/url_generator.html +++ b/wagtail/images/templates/wagtailimages/images/url_generator.html @@ -19,7 +19,7 @@ {% trans "URL" as heading %} {% panel id="url" icon="link" heading=heading %} - + {% endpanel %} {% trans "Preview" as heading %}