Combobox on mobile opens the keyboard even if allowFreeform={false} and autoComplete="off" - fluent-ui

After the combobox is clicked the menu doesn't expand, only the keyboard appears, then with a second tap the options are shown. The keyboard is still open and if y try to close it the options also disapears.
I have this options
allowFreeform={false}
autoComplete="off"
And tried
allowFreeform={true}
autoComplete="on"
allowFreeform={false}
autoComplete="on"
allowFreeform={false}
autoComplete="off"

Related

How to click on button when <input type =Button> using Selenium

How to click on button when input type is button , I am using below code, click on button is not working?
<p>
<img class="getdata-button" style="float:right;" src="/common/images/btn-get-data.gif" id="get" onclick="document.getElementById('submitMe').click()">
<input type="button" value="Get Results" tabindex="9" id="submitMe" onclick="submitData();" style="display:none" ;="">
</p>
I have tried
driver.find_element_by_css_selector("input[#type='button']")).click()
driver.find_element_by_id("get").click()
driver.find_element_by_id("submitMe").click()
also used xpath for both still nothing
It can be done through JavaScript if that is acceptable for you:
driver.execute_script("document.getElementById('submitMe').click()")
The <img> element fires an onclick event: onclick="document.getElementById('submitMe').click()"; it locates and clicks the <input> element button below in the DOM. The Selenium click interaction can be skipped and call the same JavaScript from the <img> element which should get you the desired result.

How to click a menu items when menu item webelements are not available

I'm trying to click a menu item, however there are no webelements for the menu items.
When the menu items is not clicked the web element is shown as:
<button aria-expanded="false" aria-haspopup="true" aria-label="More actions" aria-setsize="2" aria-posinset="2" class="icon-only bolt-button bolt-icon-button enabled icon-only bolt-focus-treatment" data-focuszone="focuszone-226" data-is-focusable="true" id="__bolt-header-command-bar-menu-button10" role="menuitem" tabindex="0" type="button">
Once I click the menu item the Button tag changes. However the elements for the menu items are still hiddend.
Image of the menu and after click changes in span tag
click on the html tag and add break on subtree modification . Then click the menu and keep pressing f8 till the drop down is visible
Output:

I have a problem with options after re-opening browser

I am having difficulty understanding what is going on with Options and radio button settings after closing and re-opening a browser with "continue where I left off" set. Chrome & Edge both behave the same way.
I want EITHER to get javascript to behave according to how the option and radio buttons are displaying OR force the option and radio buttons to display default values (i.e. to match the values that javascript thinks are set).
What I am doing:-
a) I change the radio button to Radio Button 2. I close the browser and re-open it. The radio button indicates Radio Button 1. Javascript also behaves as though Radio Button 1 is checked. All OK.
b) I change the option to Option 2, change the radio Button to Radio Button 2. I close the browser and re-open it. The radio button indicates Radio Button 1. Javascript also behaves as though Radio Button 1 is checked. The option continues to display as Option 2, but javascript indicates that option 1 is selected.
c) I change the radio Button to Radio Button 2, change the option to Option 2. I close the browser and re-open it. The radio button indicates Radio Button 2. Javascript behaves as though Radio Button 1 is checked. The option continues to display as Option 2, but javascript indicates that option 1 is selected.
This is all quite unexpected, and I don't see how to force the option and radio buttons to indicate their selected values. This only ever happens after closing and re-opening the browser.
My code is here
<select id="sel">
<option value=1 selected>Option 1</option>
<option value=2>Option 2</option>
<option value=3>Option 3</option>
</select>
<p>Radio Buttons<br/>
<input type="radio" id="r1" name="rb" value="rb1" checked> Radio Button 1
<input type="radio" id="r2" name="rb" value="rb2"> RadioButton 2
</p>
<span id="debug"></span>
<script>
debug();
function debug(){
var e=document.getElementById("sel");
var rb1val = document.getElementById("r1").checked;
document.getElementById("debug").innerHTML="Option "+e.options[e.selectedIndex].value+" is selected. Radio Button 1 is "+rb1val;
document.getElementById("r1").value;
}
</script>
After much searching, I have found the unlikely answer.
The problem goes away by enclosing the elements in a form with autocomplete="off":-
<form autocomplete="off">
<select id="sel" onchange="debug()">
<option value=1 selected>Option 1</option>
<option value=2>Option 2</option>
<option value=3>Option 3</option>
</select>
<p>Radio Buttons<br/>
<input type="radio" id="r1" name="rb" value="rb1" checked onchange="debug()"> Radio Button 1
<input type="radio" id="r2" name="rb" value="rb2" onchange="debug()"> RadioButton 2
</p>
<span id="debug"></span>
</form>
<script>
debug();
function debug(){
var e=document.getElementById("sel");
var rb1val = document.getElementById("r1").checked;
document.getElementById("debug").innerHTML="Option "+e.options[e.selectedIndex].value+" is selected. Radio Button 1 is "+rb1val;
document.getElementById("r1").value;
}
</script>

Selenium selector for checkbox pseudo-element

<label class="casllic_text" for="Checkbox">
::before
<span>Blob <a class="button link" href="abc.pdf">Terms</a> </span></label>
I want to click on checkbox.
If I use label[for="Checkbox"] as selector, webdriver clicks on Terms link which opens PDF in another tab.
How can I click on checkbox which so far only gets identified if I hover on ::before. (Used inspect element to do that)

How to show tooltip on disabled button and hide tooltip on enabled button using dojo

need to show tooltip on disabled button and hide tooltip on enabled button using dojo.
I am having a check box and a button.
On checking the checkbox i need to enable the button, on unchecking I want to disable the button and want a tootip to tell why the button is disabled.
In general scenario for disabled button the tooltip wont come.
I got a code to display the tooltip on a disabed button from the below link
displaying dojo tooltip on a disabled validation text box
but i want the tooltip to be hidden on enabling the button . Please provide a solution
I have modified the example in the link displaying dojo tooltip on a disabled validation text box to suit your need.
html
<span id="abcd">
<input type="button" disabled="true" dojoType="dijit.form.Button" id="button1" label="MyButton" />
</span>
<div dojoType="dijit.Tooltip" connectId="button1" jsId="tt1" label = "Why the button is disabled?" ></div>
Js part
<script>
dojo.require("dijit.form.Button");
dojo.require("dijit.Tooltip");
dojo.require("dijit.TooltipDialog");
dojo.require("dojox.fx");
var dialog;
dojo.addOnLoad(function() {
dojo.connect(dijit.byId('button1').domNode,'mouseenter', function(){
console.log("HI");
// Modified code ***START***
var button = dijit.byId('button1');
var disabled = button.get("disabled");
if (disabled){ // disabled == true
tt1.open(this);
};
// Modified code ***END***
})
dojo.connect(dojo.byId('abcd'),'mouseleave', function(e){
tt1.close();
console.log("HI2")
})
tt1.addTarget(dojo.query('input', dijit.byId('someId11').domNode));
});
</script>