From 8239945ad8536df9003357e3fecb7da25eefb12a Mon Sep 17 00:00:00 2001
From: Alastair Porter <alastair.porter@upf.edu>
Date: Wed, 18 Feb 2026 10:58:47 +0100
Subject: [PATCH 1/2] use array spread on document.getElementsByClassName

---
 freesound/static/bw-frontend/src/pages/messages.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/freesound/static/bw-frontend/src/pages/messages.js b/freesound/static/bw-frontend/src/pages/messages.js
index e4c9654a9..48aeea764 100644
--- a/freesound/static/bw-frontend/src/pages/messages.js
+++ b/freesound/static/bw-frontend/src/pages/messages.js
@@ -4,7 +4,7 @@ import debounce from 'lodash.debounce';
 const checkboxSelectAllElement = document.getElementById('selectAll');
 const messageCheckboxes = [...document.getElementsByClassName('message-checkbox')];
 const actionsMenu = document.getElementsByClassName('actions-menu')[0];
-const messageActionButtons = document.getElementsByClassName('message-action');
+const messageActionButtons = [...document.getElementsByClassName('message-action')];
 const LastMessageElement = document.getElementById('message-last');
 const usernameToFormField = document.getElementById('username-to-field');
 

From 210ee8445f8591b37942df24ec874c1d3f88aec2 Mon Sep 17 00:00:00 2001
From: Alastair Porter <alastair.porter@upf.edu>
Date: Wed, 18 Feb 2026 10:59:00 +0100
Subject: [PATCH 2/2] use array spread instead of Array.from for consistency

This does the same thing but everywhere else in the codebase we use [...
---
 freesound/static/bw-frontend/src/components/select.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/freesound/static/bw-frontend/src/components/select.js b/freesound/static/bw-frontend/src/components/select.js
index d9f2dc697..61e07e128 100644
--- a/freesound/static/bw-frontend/src/components/select.js
+++ b/freesound/static/bw-frontend/src/components/select.js
@@ -90,7 +90,7 @@ function makeSelect(container) {
               }
             } else {
               currentKeysPressed += evt.key;
-              Array.from(ulElement.children).every(liElement => {
+              [...ulElement.children].every(liElement => {
                 if (
                   liElement.innerHTML
                     .toLowerCase()
@@ -176,7 +176,7 @@ function makeSelect(container) {
   }
 
   function removeActiveClassFromAllLiElements(ulElement) {
-    Array.from(ulElement.children).forEach(liElement => {
+    [...ulElement.children].forEach(liElement => {
       liElement.classList.remove('active');
     });
   }
@@ -189,7 +189,7 @@ function makeSelect(container) {
     if (liElement === undefined) {
       return ulElement.children[ulElement.children.length - 1];
     }
-    const index = Array.from(ulElement.children).indexOf(liElement);
+    const index = [...ulElement.children].indexOf(liElement);
     if (index > 0) {
       return ulElement.children[index - 1];
     } else {
@@ -201,8 +201,8 @@ function makeSelect(container) {
     if (liElement === undefined) {
       return ulElement.children[0];
     }
-    const index = Array.from(ulElement.children).indexOf(liElement);
-    if (Array.from(ulElement.children).length > index + 1) {
+    const index = [...ulElement.children].indexOf(liElement);
+    if ([...ulElement.children].length > index + 1) {
       return ulElement.children[index + 1];
     } else {
       return ulElement.children[index];