Develop Reference

Click a aria-label element using xpath

I am unable to click a button using Xpath and Selenium, in this case the aria-label has a unique date which make it perfect to distinguish among some other buttons from a calendar.
This is the HTML code for the button that display the day 5 and the
price for that day.
<button type="button" class="CalendarDay__button" aria-label="Choose sunday, february 4 2018 as your check-in date. It's available." tabindex="0"><div class="calendar-day"><div class="day">4</div><div class="flybondi font-p fare-price"><span>$728*</span></div></div></button>
<button type="button" class="CalendarDay__button" aria-label="Choose monday, february 5 2018 as your check-in date. It's available." tabindex="0"><div class="calendar-day"><div class="day">5</div><div class="flybondi font-p fare-price"><span>$728*</span></div></div></button>
#Let say I want to click february 5 2018, I tried
dtd0_button = driver.find_element_by_xpath("//button[contains(#class, 'CalendarDay__button') and (#aria-label, 'Choose monday, February 5 2018 as your check-in date. It's available') ]")
dtd0_button.Click()
what is wrong with this approach and I receive the following message 'WebElement' object has no attribute 'Click' if I can Click for any date in the calendar on the web page.

There are a couple of errors with your xpath, which make it invalid:
First of all, you have to state contains before each condition:
"//button[contains(#attribute1, \"content1\") and contains(#attribute2, \"content2\")]"
The ' inside your xpath isn't escaped. Try the following:
"//button[contains(#class,\"CalendarDay__button\") and contains(#aria-label,\"Choose monday, february 5 2018 as your check-in date. It's available.\")]"
Hope it helps. Good luck!

How can one create a dynamic copyright date without document.write() in JavaScript?

How can one fetch and print the current year without using document.write() in JavaScript?
This is for a typical copyright line in the footer; e.g., © 2017 Stack Overflow.
Right now I'm using the standard document.write() method.
document.write(new Date().getFullYear());

Yes sure you can use an element:
<p>© Stack Overflow <span id="year"> </span></p>
Add a link to your JS like so:
<script src="js/app.js"></script>
And within this file you can do:
var date = new Date().getFullYear();
document.getElementById("year").innerHTML = date;
Alternatively you can simply use php like so:
<?php echo date("Y"); ?>
If you are using php just make sure you change the file ext to PHP.

document.getElementById("current-year").innerHTML = new Date().getFullYear();
<span id="current-year"></span>

with JavaScript:
Copyright &copy <script type="text/javascript"> document.write(new Date().getFullYear());</script> [companyName] Communications Inc. All rights reserved.
if you compile the above code somewhere like here , you would get an output as 2021
But for example, if you have a footer.vm file:
<div id="footerLinks" style="clear:left; text-align:left; color:#282828">
Copyright &copy <script type="text/javascript"> document.write(new Date().getFullYear());</script> DigiVie Communications Inc. All rights reserved.
</div>
and this one with the PHP:
© <?php
$fromYear = 2008;
$thisYear = (int)date('Y');
echo $fromYear . (($fromYear != $thisYear) ? '-' . $thisYear : '');?> CompanyName.

The very simple solution above that was posted by user3731460 and edited by user663031 worked perfectly.
Higher in the thread on this page, one of the commenters asked "What's wrong with using document.write (other than depending on the client to be set to the correct year)?"
I dont know the reasoning back in 2017 (when the question was originally asked here), but now (in oct 2020), lighthouse extension for chrome gives the warning 'avoid document.write because it can delay page load by tens of seconds.' the way google encourages user experience, i can see that google may penalize the use of document.write at some point.

If you want to have the year in multiple places, use a class instead:
const year = new Date().getFullYear();
document.querySelectorAll(".js-year").forEach(el => el.innerText = year);
<span class="js-year"></span>

Jquery compare two String from different elements

I want to compare a select option with text content. can it be achieved. though the strings are same, they don't match while comparing.
<div id="dateRange">
<p>27 Nov 2016_26 Dec 2016</p>
</div>
and Select option be like:
<select id="dateRangeSelect" onchange="showHideForms(this);"><option value="27 Nov 2016_26 Dec 2016" selected>nov-dec</option></select>
in Jquery I am comparing:
$("#dateRangeSelect").val() and $("#dateRange").text()
though they look same in console output, they dont match in if condition
can some one comment on what might be wrong.

Try to compare not the $("#dateRange").text(), because it returns also the p tag as a text. So change it into $("#dateRange p").text()
console.log($("#dateRangeSelect").val());
console.log($("#dateRange p").text());
console.log($("#dateRangeSelect").val() === $("#dateRange p").text());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="dateRange">
<p>27 Nov 2016_26 Dec 2016</p>
</div>
<select id="dateRangeSelect" onchange="showHideForms(this);"><option value="27 Nov 2016_26 Dec 2016" selected>nov-dec</option></select>

Need to compare the text inside p tag with the value. Also use .trim() to remove any white space
($("#dateRangeSelect").val()=== $("#dateRange p").text().trim())

use Date parse for comparing dates like this
Date.parse($("#dateRangeSelect").val()) === Date.parse($("#dateRange").text())

Trim worked.. thank you it was the extra space

hard time to make the W3C AppML tutorial example working

I try the tutorial appml on w3c
Nothing is working... ><
I downloaded appml for php, here : http://www.w3schools.com/appml/appml_download.asp
I put files in a folder called "appml"
drwxr-xr-x 16 g_pierr wheel 544 31 oct 18:25 Images
-rwxr-xr-x# 1 g_pierr wheel 7402 26 sep 2013 appml.css
-rwxr-xr-x# 1 g_pierr wheel 75662 7 jan 2014 appml.js
-rwxr-xr-x# 1 g_pierr wheel 32956 7 jan 2014 appml.php
-rwxr-xr-x# 1 g_pierr wheel 389 31 oct 18:43 appml_config.php
-rw-r--r-- 1 g_pierr wheel 142 31 oct 18:42 customers.xml
-rw-r--r-- 1 g_pierr wheel 401 31 oct 18:41 index.htm
the appml_config.php is :
<?php echo("Access Forbidden");exit(); ?>
<appml>
<database name="appmldemo">
<host>localhost:3306</host>
<name>test_db</name>
<user>root</user>
<password>root</password>
</database>
<database name="appmlsecurity">
<host>localhost:3306</host>
<name> test_db</name>
<user>root</user>
<password>root</password>
</database>
<dateformat>yyyy-mm-dd</dateformat>
test_db exists and credentials working.
test_db contains the northwind content, which is a well-known sample SQL used for tests.
The appml.js has not been modified.
The appml_config.php has not been modified.
I have customers.xml for handle data
<appml>
<datasource>
<database>
<connection>appmldemo</connection>
<sql>SELECT * FROM customers</sql>
</database>
</datasource>
</appml>
and I have index.html on the 'view' part
<h1>My First Web Application</h1>
<div id="Place01">
<table id="Template01" class="appmltable">
<tr>
<th>Customer</th>
<th>City</th>
<th>Country</th>
</tr>
<tr id="appml_row">
<td>#CustomerName#</td>
<td>#City#</td>
<td>#Country#</td>
</tr>
</table>
</div>
<script src="appml.js"></script>
<script>
app=new AppML("appml_config.php","customers");
app.run("Place01","Template01");
</script>
At the end, I got a javascript alert , always the same ><
<br />
<b>Deprecated</b>: Automatically populating $HTTP_RAW_POST_DATA is deprecated and will be removed in a future version. To avoid this warning set 'always_populate_raw_post_data' to '-1' in php.ini and use the php://input stream instead. in <b>Unknown</b> on line <b>0</b><br />
<br />
<b>Warning</b>: Cannot modify header information - headers already sent in <b>Unknown</b> on line <b>0</b><br />
Access Forbidden
The deprecated is just a warning I dont care about now.
The second warning is about header already sent by : it doesnt block script execution, then I dont care neither.
The ''Access Forbidden'' string comes from the appml_config.php file
And nothing more...
Does anyone could tell me where I'm wrong in my exact reproduction of what w3c is saying, in what they called 'a tutorial' ? thx you.

Try to change this line
app=new AppML("appml_config.php","customers");
and change it to this
app=new AppML("appml.php","customers");

AngularStrap data-start-date not allowing date selection

I've got this angular datepicker
<input type="text" bs-datepicker data-start-date="01/10/13" data-end-date="29/04/14" placeholder="Earliest date" id="BoundaryFrom" name="BoundaryFrom" ng-model="chartData.boundary.min" data-date-format="d M yyyy" />
(At the moment I've put in hard coded start and end dates just to test the functionality out. Later I will put in an Angular expression)
Now, this part data-start-date="01/10/13" data-end-date="29/04/14" correctly only displays the dates between 1st October 2013 and 29 April 2014 in the calendar control but the problem is none of those dates is selectable. I can still type in the textbox though. Why are they not selectable?

It seems that the the start date and the end date should be more specific, as well as the options being data-min-date and data-max-date. Your start and end date code should be data-min-date="10/01/2013" data-max-date="04/29/2014". The full line will be
<input type="text" bs-datepicker data-min-date="10/01/2013" data-max-date="04/29/2014" placeholder="Earliest date" id="BoundaryFrom" name="BoundaryFrom" ng-model="chartData.boundary.min" data-date-format="d M yyyy" />
Also, I think the format of the date for that would be "mm/dd/yyyy" instead of "dd/mm/yyyy" like you originally did.
Here is a plunker of working code. The calendar only allows selected dates between 1st October 2013 and 29 April 2014. I hope this helps!!!
edit: fixed a typo. Also, an upvote or accepted answer would be awesome :)