1
<div class="admin-welcome-hero">
   <h1>Welcome to the Meeting System</h1>
       <div class="admin-intro">
          Click on a current or previous meeting to edit or review details, or create a new meeting.
       </div>
       <button class="btn btn-lg new-meeting" ng-click="vm.newmeeting(this);"> 
         Create a new meeting 
       </button> 
   </div>

I have created the above button, that I need to 'click' through to selenium. This is my first workflow testing that I am doing, and I am having issue with this button, because it doesn't have an id.

I tried the following, and similar, even replacing with all three tags, and in combination.

What am I missing? Do I need to reference other html tags around it? Or can I focus on the button directly.:

var newMeetingButton = Driver.Instance.FindElements(By.CssSelector("btn"));
var newMeetingButton = Driver.Instance.FindElements(By.CssSelector(".btn"));
0
3

To get a CSS Selector using Chrome dev tools

 1.Right-click on the element
 2. Select "Inspect"
     a. Chrome's DevTools will on on the Elements tab with the element highlighted (in blue)
 3. Right-click the highlighted element
 4. Select "Copy" > "Copy selector"

If the selector uses the class and the class is compound (class=".btn .primary") then replace the spaces with periods. Ex., ".btn.primary".

8
  • This is what I get back...assuming from being wrapped in other html tags #main-container > div:nth-child(2) > div > div.admin-welcome-hero > button Would I just remove the spaces here? What do I do with this?
    – Greg P
    May 9 '17 at 15:28
  • No need to remove the spaces. The tipoff is that it starts with #, which means ID, so it's not using the class attribute exclusively. So, FindsBy.CssSelector("#main-container > div:nth-child(2) > div > div.admin-welcome-hero > button"). You can test it out in the "console" tab of DevTools by doing document.querySelector("#main-container > div:nth-child(2) > div > div.admin-welcome-hero > button").
    – kirbycope
    May 9 '17 at 20:49
  • yes..that shows up in the console..so I would still do 'by cssSelector? because that still doesn't work...still wondering where my disconnect is.
    – Greg P
    May 10 '17 at 11:56
  • could it be that Driver.Instance still has the previous page loaded? I have a wait in there to make sure it is at the right page, but it still has the previous page's title in it.....how can I make absolutely sure that I am on the right page if the 'wait' doesn't hold off? Or do I need to reinitialize something?
    – Greg P
    May 10 '17 at 12:10
  • It opens up in a new tab...still focused on the old tab. I will look up how to change focus to the new tab....unless you can answer it sooner. I am sure all of these solutions will work once I find out about the focus.
    – Greg P
    May 10 '17 at 12:28
0

The css selector you are looking for is:

By.CssSelector("button.new-meeting")

if you want to be more specific you can do

By.CssSelector("div.admin-welcome-hero button.new-meeting")

Hope this helps

5
  • You also can use: By.CssSelector("button[class='btn btn-lg new-meeting']") May 9 '17 at 17:09
  • thanks guys, but neither of these worked. I thought I tried Moe's first idea. But either way, neither of moes, or saura's post worked. What am I missing?
    – Greg P
    May 9 '17 at 17:23
  • By.CssSelector("button[class='btn btn-lg new-meeting']") is a compund class, so it should be By.CssSelector("button[class='btn.btn-lg.new-meeting']")
    – kirbycope
    May 9 '17 at 20:51
  • If this did not work then i am willing to bet that there is an iframe on the page that you need to switch to. Can you share the full page source? May 9 '17 at 21:11
  • it isn't an iframe...but similar...a different tab...which I see is not supported in a 2016 post..not sure about now.
    – Greg P
    May 10 '17 at 12:38
0

The Cssselector for the particular element in the question has to be

Driver.Instance.FindElement(By.CssSelector("button.btn btn-lg new-meeting"));

or

Driver.Instance.FindElement(By.CssSelector("button[class='btn btn-lg new-meeting']"));

Below is the table for Cssselector syntax, enter image description here

To get a complete hansdson using Cssselector, refer this=>css selector

3
  • The above does not work either. I am not sure what I am doing wrong.
    – Greg P
    May 9 '17 at 17:40
  • Oops... It has to be findelement and not findelements. Updated the answer. Tell me the exact err msg if it doesn't work May 9 '17 at 17:44
  • "Unable to locate element: button.btn btn-lg new-meeting"...this is with trying your first example.
    – Greg P
    May 9 '17 at 17:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.