Am not able to click on links using Behat/Mink. There's a desired text in <span> tags so maybe this could be the reason?
This is part of my *.feature file:
Scenario: Tryin' to make it freakin' workin' yo!
Given I am on "/home/"
And I follow "Test"
Then I should be on "/test/"
And this is part of the page am trying to focus on:
<li id="ApplicationItem_test" class=" " data-placement="right" rel="popover" data-offset="-6" data-content="" data-original-title="test">
<a href="/app/tests/e76ee2a8d9094e11b6bb9c928c5d61e3/" data-subscription-id="e76ee2a8-d909-4e11-b6bb-9c928c5d61e3">
<i class="picon-money-icon-16"></i>
<span class="expand-element">test
</span>
<div id="nodeCounter_c592e0ce62c849fab427fc9f2a04b557" style="display:inline-block">
</div> </a>
</li>
<script type="text/javascript">
var node = { id: '#nodeCounter_c592e0ce62c849fab427fc9f2a04b557', action: '/app/tests/e76ee2a8d9094e11b6bb9c928c5d61e3/GetSidebarActionCount' };
Access.SideBar.nodesWithCounters.push(node);
</script>
And this is the error I'm getting:
And I follow "Test"
FeatureContext::clickLink()
Link with id|title|alt|text "Test" not found. (Behat\Mink\Exception\ElementNotFoundException)
Have tried all possible CSS selector functions found on the internet. Also am wondering if I shouldn't use the Selenium extension for Behat here (because of the JS?)
So answer is: I wasn't on the right page.
Basically Scenarios should be independent - that means my previous session was burnt and I missed some previous steps (login, for example.)
Related
SOLVED
I Simply did not have the closing a tag at the end. Sheesh....
I need help. I'm still a student so still learning. Any help would be appreciated. I'm lost.
I'm using bootstrap5, adding a carousel ("With captions" https://getbootstrap.com/docs/5.1/components/carousel/ for the full code.) to a page and a link in that slide on the h5.
After adding the link, the text went from white to blue and gives me this
"Cannot GET /WilliamVest/%E2%80%9CKeyWestPhotoGallery.html"
I've checked this address NUMEROUS times. Even said it out loud to myself. The link IS in the same folder as the rest of the project.
So why won't it work?
I tried to google and found "data-bs-target" does that have anything to do with it? Like I said, still new so still learning.
****Someone pointed out I missed the quotes in the link. Did not fix it.
I added that quote. It was discolored so I don't know where that came from but I think it's because you were right about the quotation style.
I commented that whole line out and started over. I just wanted to see the difference.
So now, the blue is gone in the lettering but now it won't even open another page to show an error. It does nothing.
First slide label
Key West Photo Gallery -->
This is my code snippet ---- KeyWestPhotoGallery.html is the link I'm trying to get to.
<!-- Carousel of Projects -->
<div id="carouselExampleCaptions" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="Images/palmLighthouse1.jpg" class="d-block w-100" alt="Key West Lighthouse">
<div class="carousel-caption d-none d-md-block">
<h5 class="display-2"><a href=“KeyWestPhotoGallery.html>Key West Photo Gallery</a></h5>
<!-- <p>Some representative placeholder content for the first slide.</p> -->
</div>
You have:
<a href=“KeyWestPhotoGallery.html>
That is not a quote " as used in HTML, that is a Unicode Left Double Quotation Mark a.k.a. opening typographer's quote (a display character with no special meaning). So it thinks that is part of the URL that is why it is urlencoded into that address as %E2%80%9C
let path = "/WilliamVest/%E2%80%9CKeyWestPhotoGallery.html"
console.log(decodeURI(path))
Solutions include the following:
Remove it: <a href=KeyWestPhotoGallery.html> (Unquoted attribute-value syntax)
Or, replace it adding the missing closing quote: <a href="KeyWestPhotoGallery.html"> (Double-quoted attribute-value syntax)
Or, use single quotes: <a href='KeyWestPhotoGallery.html'> (Single-quoted attribute-value syntax)
I'm trying to find a link in my navbar, nested like so:
<div class="menu logged-out" id="loggedoutmenu">
<a href="/users/auth/twitter?state=navbar_basic" data-no-instant>
<div class="option"> via Twitter</div>
</a>
</div>
I've tried using the following methods and none of them have worked:
find_link("via Twitter")
find_link("via Twitter", {href: "/users/auth/twitter?state=navbar_basic"})
find('div', {class: 'option'})
Not really sure how to grab that element... The main goal is to test the link via click_link.
Edit:
Here's the full HTML structure:
<body>
<div class="top-bar" id="top-bar">
<nav>
<--- other nav elements not listed --->
<div class="navigation-butt desktop" id="navigation-butt">
<div class="menu logged-out" id="loggedoutmenu">
<a href="/users/auth/twitter?state=navbar_basic" data-no-instant>
<div class="option"> via Twitter</div>
</a>
</div>
</div>
</nav>
</div>
</body>
I'm guessing the menu is collapsed and you haven't done anything to open it, so the link isn't actually visible on the page. Assuming you just need to click on the '#loggedoutmenu' item to open the menu you could do something like
find('#loggedoutmenu').click.click_link('via Twitter')
which will click on 'loggedoutmenu' then look for the link inside it, and click the link when found. If clicking on '#loggedoutmenu' isn't how you open the menu then you'll need to provide more info.
Update: You have now indicated that the menu opens on hover - so assuming the user has to hover over an ancestor of the button you want to click you can do
find('<css selector for the visible element the user needs to hover over>').hover.click_link('via Twitter')
Writing my solution as an extension of Thomas Walpole's, which lead me to getting it. Thanks again, Thomas!
find('#navigation-butt').hover.click_link(href:"/users/auth/twitter?state=navbar_basic")
Edit: Updated my answer since the previous explanation was incorrect.
On photoswipe docs the markup is div/figure/img. But i want other markup.
How to "Creating an Array of Slide Objects" for this ul/li/figure/img markup. I know i need somehow to edit the "var initPhotoSwipeFromDOM = function(gallerySelector) {" function. But do not now what the changes i need to do?
This is my markup:
<ul class="my-gallery" itemscope itemtype="http://schema.org/ImageGallery">
<li>
<figure>
<a href="large-image.jpg" data-size="600x400">
<img src="small-image.jpg" itemprop="thumbnail"/>
</a>
<figcaption itemprop="caption description">Image caption</figcaption>
</figure>
</li>
</ul>
Related Q i so on the internet:
https://codedump.io/share/Hc9do6CIJgwH/1/how-do-i-get-photoswipe-to-recognize-entire-gallery-from-list-of-thumbnail-images
You must correctly travers the DOM and pass proper elements, I am not able to explain it, it's just about understanding how and which nodes are selected - here's a gist: https://gist.github.com/TMMC/6ec51c46d9fa57e1fd6a480f0d5da86d - I had the same issue, exactly the same code. Look for comments starting with make it works with.
Try ".my-gallery > li > figure > a" as gallerySelector
I am testing a grails application and have the tests run by Hudson. The tests are passing 100% of the time when run on local machine.
Database Is always reset when the tests initialize.
I have problem setting the value for a dynamic form. In my .gsp I have the following :
<g:xEditableRefData owner="${license}" field="isPublic" config='YN'/>
This is generating an ‘Edit’ link,. When clicked a dropdown appears which allows the user to select between Yes or No. (screenshots at the end of mail):
Following is the generated code:
<span data-url="/demo/ajax/genericSetRel"
data-source="/demo/ajax/sel2RefdataSearch/YN?format=json&oid=License%3A1"
data-name="isPublic" data-type="select" data-pk="License:1"
class="xEditableManyToOne editable editable-click editable-empty" id="License:1:isPublic">Edit
</span>
And when clicked:
<span class="editable-inline editable-container">
<div>
<div class="editableform-loading" style="display: none;"></div>
<form class="form-inline editableform" style="">
<div class="control-group">
<div>
<div class="editable-input">
<select class="input-medium">
<option value="RefdataValue:1">Yes</option>
<option value="RefdataValue:2">No</option>
</select>
</div>
<div class="editable-buttons">
<button class="btn btn-primary editable-submit" type="submit">
<i class="icon-ok icon-white"></i>
</button>
<button class="btn editable-cancel" type="button">
<i class="icon-remove"></i>
</button>
</div>
</div>
<div class="editable-error-block help-block" style="display: none;"></div>
</div>
</form>
</div>
</span>
I have the following method in my Page class for setting the value of the edit/dropdown:
editIsPublic { option ->
$("span", 'data-name': "isPublic").click()
try {
waitFor { $("form.editableform") }
} catch (geb.waiting.WaitTimeoutException e) {
throw new RequiredPageContentNotPresent()
}
$("select.input-medium").value(option)
$("button.editable-submit").click()
}
This is always successful on my local machine, but when run headless on Hudson I get about 80% failure. When it fails the tests don’t stop, but the dropdown has wrong value, and no exceptions are thrown. I have also considered passing arrow keys instead of set the value but this is not a good option for other reasons. Any ideas why the above code is not working on Hudson? Is there any other way I could set the value?
UPDATE
Adding a lot of waitFor statements seems to have fixed the issue for now. I have defined the following closure, and I am using it on everything that is interactive.
waitElement {run ->
try{
waitFor{run()}
} catch (geb.waiting.WaitTimeoutException e) {
throw new RequiredPageContentNotPresent()
}
}
I didn't spend a lot of time trying to get headless firefox working, because I read of many issues such as these. I decided to give PhantomJS a try instead and it has been working exactly as expected so far.
To set up the PhantomJSDriver you need to:
Download/install PhantomJS per their docs
Add the PhantomJSDriver to your test dependencies 'com.github.detro.ghostdriver:phantomjsdriver:1.1.0'
Set a system property that points to the PhantomJS binary
Set PhantomJSDriver in the GebConfig file
Here's a simple example of what I put in my GebConfig:
System.setProperty("phantomjs.binary.path", "path/to/phantomjs/binary")
driver = {
def pjsDriver = new PhantomJSDriver()
// set window size manually because the default size is very small
pjsDriver.manage().window().size = new Dimension(1680, 1050)
pjsDriver
}
Sorry that doesn't directly answer the question of "why" some tests are having issues, but hopefully that will resolve it!
I am trying to implement addthisevent into my jqm application (1.4), but I have two issues.
The Link/Button doesn't appear. Looking with Firebug shows that the css class isn't loaded as hidden.
After manually activating the visibility using firebug, the link doesn't do anything.
Does anyone have experience with integrating addthisevent into a jqm app? Is there anything I have to be particularly careful of?
Many thanks in advance.
It appears that the jQM CSS interferes with AddThisEvent CSS. One solution is to add data-role="none" to the link which tells jQM to leave the link alone and not to enhance it.
<a href="#" data-role="none" title="Add to Calendar" class="addthisevent" rel="external">
Add to Calendar
<span class="_start">10-05-2014 11:38:46</span>
<span class="_end">11-05-2014 11:38:46</span>
<span class="_zonecode">38</span>
<span class="_summary">Summary of the event</span>
<span class="_description">Description of the event</span>
<span class="_location">Location of the event</span>
<span class="_organizer">Organizer</span>
<span class="_organizer_email">Organizer e-mail</span>
<span class="_facebook_event">http://www.facebook.com/events/160427380695693</span>
<span class="_all_day_event">true</span>
<span class="_date_format">DD/MM/YYYY</span>
</a>
Here is a DEMO