0
200
ViewsJavascript: How do I focus the YT search bar?
I use a javascript to set the focus / cursor into the first input element. It works fine under almost all circumstances, but not on the following page:
https://www.youtube.com/
The textbox that I expected to get the focus is this one:
It has the following selector (copied from Chrome):
#search
This is its Xpath:
//*[@id="search"]
Full XPath:
/html/body/ytd-app/div[1]/div/ytd-masthead/div[3]/div[2]/ytd-searchbox/form/div[1]/div[1]/input
And this is its code:
<input id="search" autocapitalize="none" autocomplete="off" autocorrect="off" name="search_query" tabindex="0" type="text" spellcheck="false" placeholder="Suchen" aria-label="Suchen" role="combobox" aria-haspopup="false" aria-autocomplete="list" dir="ltr" class="ytd-searchbox" style="outline: none;">
However, I didn't manage to select this search box.
What am I missing?
This is the javascript code:
function pSetFocus()
{
var element = document.querySelector("*[autofocus]");
if (element)
{
}
else
{
element = document.querySelector("form input:not([type=hidden])");
}
if (element)
{
}
else
{
element = document.querySelectorAll("#search.ytd-searchbox"); //Here is try to select the YT search bar...
}
if (element)
{
}
else
{
return;
}
element.selectionStart = element.selectionEnd = element.value.length;
element.focus();
var y = element.getBoundingClientRect().top + window.scrollY;
window.scroll(
{
top: y,
behavior: "smooth"
});
};
Thank you!
·
Juan Pablo Isaza
1 answers
Answer question0
I figured out another (the most important) problem:
I feed my CEF3 based browser the function code itself, but I did not call it.
I am now using
Me.webkitx1.Eval(somecodeWithoutFunctionDeclaration)
It works.
Before, I used:
Me.webkitx1.Eval(somecodeWithFunctionDeclaration)
Here you see how I stripped the function header (which made it work for me):
var element = document.querySelector("*[autofocus]");
if (element)
{
}
else
{
element = document.querySelector("form input:not([type=hidden])");
}
if (element)
{
}
else
{
element = document.querySelector("#search");
}
if (element)
{
}
else
{
return;
}
element.selectionStart = element.selectionEnd = element.value.length;
element.focus();
var y = element.getBoundingClientRect().top + window.scrollY;
window.scroll(
{
top: y,
behavior: "smooth"
});
·
Juan Pablo Isaza
Report
Answer question