I am not able to use a map function inside a client function.
export function availableAudioBitrates() {
const getOptionNames = ClientFunction(() => {
const select = document.querySelector('[data-testid=audioBitrate-setting]');
const options = select.querySelectorAll('option');
console.log(typeof options);
//const values = [];
const values = options.map((option) => option.TextContent);
//options.forEach((option) => values.push(option.textContent));
return values;
});
return getOptionNames();
}
I have "options.foreach" statement working, but with map function, it is throwing an error that options.map is not a function.
Check the value of options, its either undefined or not an array. .map() requires an array to run, anything else will cause that error
Because that is a HTMLCollection, not an array. Use Array.form(select.querrySelectorAll('option')).
export function availableAudioBitrates() {
const getOptionNames = ClientFunction(() => {
const select = document.querySelector('[data-testid=audioBitrate-setting]');
const options = Array.from(select.querySelectorAll('option'));
console.log(typeof options);
//const values = [];
const values = options.map((option) => option.TextContent);
//options.forEach((option) => values.push(option.textContent));
return values;
});
return getOptionNames();
}