How do I get all the options (text,not the value) of a select menu by by specifying its id
var textArr = $("#mySelect").map(function() {
return $(this).text();
}).get();
alert(textArr);
Demo here. And see http://api.jquery.com/map/
Related
I am having an e2e testing pack with protractor-cucumber-framework and Chai for asserting.
I have a Feature file with a data table as below.
Scenario: Menu Validation
Given I am on the home page
When I do Hover over the menu item I should have the menu dropdown
|menu1 |
|menu2 |
|menu3 |
I have the step definition as below.
When(/^I do Hover over the menu item I should have the menu dropdown/, (dataTable) => {
let rootMenu : Array<string> = Array.from( dataTable.rawTable )
rootMenu.forEach((ele) => {
console.log(ele[0]);
element(by.id(ele[0])).isPresent().then(function(present) {
expect(present).to.equal(true);
});
});
});
Even if the menu element ID is not present this test step never fail, I checked further the expect(present).to.equal(true); never get executed. I am not sure what I am missing.
can you try this instead
When(/^I do Hover over the menu item I should have the menu dropdown/, async (dataTable) => {
let rootMenu : Array<string> = Array.from( dataTable.rawTable )
for (let i; i < rootMenu.length; i++) {
let ele = = rootMenu[i];
console.log(ele[0]);
expect(await element(by.id(ele[0])).isPresent()).to.equal(true);
}
})
I am planning to add multiple options to the status bar. Is it possible?
Like, If we click on the language type of a file we see multiple options in the same way.
how to create it?
Thanks
Use vscode.window.createStatusBarItem to place an item on the status bar. When the item is clicked, it runs a command, that itself runs vscode.window.showQuickPick to prompt the user to select from a list of items.
export function activate(context: vscode.ExtensionContext)
{
createStatusBarItem(context) ;
}
function createStatusBarItem(context: vscode.ExtensionContext)
{
// register a command that is invoked when the status bar
// item is clicked.
const myCommandId = 'myExtension.statusBarClick';
context.subscriptions.push(vscode.commands.registerCommand(myCommandId, async () =>
{
const pageType = await vscode.window.showQuickPick(
['shell', 'fetch rows, list in table'],
{ placeHolder: 'select type of web page to make' });
}));
// create a new status bar item that we can now manage
const item = vscode.window.createStatusBarItem(vscode.StatusBarAlignment.Right, 100);
item.command = myCommandId;
context.subscriptions.push(item);
item.text = `my command`;
item.tooltip = `status bar item tooltip`;
item.show();
}
while creating an extension for vscode I got stuck in selection, now the problem is when I replace some range of textEditor through an api it replaces that range as well as make that range selected. For snippets this is a good idea but my extension requirement is not to select replaced text, I searched in api but did't find anything related to remove text selection (Selection occurs when the document is empty)
editor.edit((editBuilder)=>{ //editor is an object of active text editor
editBuilder.replace(textRange,text) // text = 'dummydummydummy'
}) //after this I got the following output
editor.edit(builder => {
builder.replace(selection, newStr);
})
// The edit call returns a promise. When that resolves you can set
// the selection otherwise you interfere with the edit itself.
// So use "then" to sure edit call is done;
.then(success => {
console.log("success:", success);
// Change the selection: start and end position of the new
// selection is same, so it is not to select replaced text;
var postion = editor.selection.end;
editor.selection = new vscode.Selection(postion, postion);
});
I believe that this is happening because the edit is being applied within the current selection. edit returns a promise that is resolved when the edit is applied, and you can use this to set the selection after the edit is successful:
editor.edit((editBuilder) => {
editBuilder.replace(textRange, text)
}).then(success => {
if (success) {
// make selection empty
editor.selection.active = editor.selection.anchor
}
})
let editor = vscode.window.activeTextEditor;
let selection = editor.selection;
editor.edit(builder => {
builder.replace(selection, newStr);
});
see: TextEditorEdit API Doc
I have two menus 'Setup' and 'Reports' with sub-menus 'admin users','Reports dashboard','partner dashboard','partner relationship' etc marked with red color.
I want to navigate or click using protractor locators but unable to find how to select these menus that have no id and common CSS. I want something like this
var userTypes = element.all(by.repeater('t in user_userTypes'));</br>
userTypes.get(2).click()
From what I see, these elements are navigation menu items, Setup and Reports are high-level menus and Admin Users, Reports Dashboard, Partner dashboard, Partner Relationship and Grading Data are submenus. To open a submenu, I assume, you should click the appropriate menu.
Let's make a reusable function that would accept a menu label and a desired submenu label and use by.repeater() locator filtering the menus by text:
function selectMenu(menuLabel, submenuLabel) {
var menu = element.all(by.repeater("mi in menuItems")).filter(function (menu) {
return menu.all(by.tagName("a")).first().getText().then(function (text) {
return text.indexOf(menuLabel) === 0;
});
}).first();
menu.click(); // open up menu
var submenu = menu.all(by.repeater("s in mi.subMenuItems")).filter(function (submenu) {
return submenu.all(by.tagName("a")).first().getText().then(function (text) {
return text.indexOf(submenuLabel) === 0;
});
}).first();
submenu.click(); // select submenu
}
Usage samples:
selectMenu("Setup", "Admin Users");
selectMenu("Reports", "Reports Dashboard");
Define a method and pass the 'hrefValue', filter by anchor tag.
var clickParticular = function(hrefValue){
element.all(by.tagName('a')).filter(function(element, index) {
return element.getAttribute('href').then(function (text) {
return text === hrefValue;
});
}).then(function(filteredElements) {
filteredElements[0].click().then(function() {
});
});
}
If the input is a select type, I want to get the text of the selected option, not the value.
This is what I have so far:
$('.encodageField').live('change', function(){
if( $(this).is('select') ) {
val = $($(this) + 'option:selected').text();
alert (val);
}else{
val = $(this).val;
alert (val);
}
save_answer($(this));
});
So I need the text of $(this) the changed select. How do I use 'this' in combination with 'option:selected' as a selector.
try this
val = $('option:selected', this).text();
I think this should be equivalent to Leigh's answer
$(this).find('option:selected').text();