I made an automation for a webpage which has frames, and I need to click on several menu links before returning to the maincontent to complete the tasks. This automation is run from Access-VBA. Here is a fragment of the HTML that shows the frame:
<frameset id="topFrameset">
<frameset id="BodyFrameset" cols="0,177,*">
<frame name="ButtonsFrame" id="ButtonsFrame" target="main" scrolling="NO" noresize="" src="MyMenu.action">
#document
<html>
<body>
<input type="hidden" name="listParentsId" value="[501, 502, 503]" id="listParentsId">
<div id="menu_container">
<div id="menu_1" onmouseover="MENU.ToolTipsCreate('501')">
<a onclick="MENU.showItems('501', '')">My Account</a>
<img id="img_501" src="/common/images/dropdown2_arrow.png" onclick="MENU.showItems('501', '')">
</div>
</div>
</body></html>
</frame>
</frameset>
</frameset>
I am using the SeleniumBasic v2.0.9.0 bindings for VBA. See Browser automation in Excel VBA using Selenium for install and tutorial.
I've tried webdriver.SwitchToFrame, among many other tests, all of them failed.
Dim driver As selenium.WebDriver
Set driver = New ChromeDriver
driver.Get (URL)
'Here goes the part of the code that logs in the page, it's irrelevant for this analysis...
driver.SwitchToFrame ("topFrameset") 'This line returns Error N°: 8 - NoSuchFrameError. Frame not be found. Identifier:topFrameset
Hope that someone could guide me to click the link or the img element inside "menu_1". Thanks in advance.
In 'EXAMPLE TEST 2', Can you comment this line driver.SwitchToDefaultContentand try it?
Why you switch to defaultcontent before switching to frame?
defaultContent –> Switch back to default page
Try other options as well: (In JAVA, we do.)
switchTo().frame(int) – Switch to a frame with its index
switchTo().frame(“name of the frame”) – Switch to a frame with its name
switchTo().frame (WebElement) – Switch to a frame with its web element location
After working a lot with this, I found the solution by myself.
I installed the app "SideeX" available at the Google Store. I then recorded the actions I needed to emulate with Selenium.
Then, I noticed that the frames whose names I described in the original question (topFrameset, BodyFrameset, ButtonsFrame) where recorded by SideeX through their indexes.
So I just had to perform the same actions with Selenium. In my case, for example, I had the following sequence of actions:
driver.SwitchToFrame 0
driver.SwitchToFrame 1
driver.FindElementById("img_501").Click
driver.SwitchToParentFrame
driver.SwitchToFrame 2
This is just my case, but the important thing that can be helpful for others with the same problem is to know that you can use SideeX to help you find the indexes of elements or sequence of actions needed to achieve your goal.
Is it possible to change default color of the TimePickerAndroid component ?
You would have to change it from the styles.xml file of android. Here's what you do:
1) Open up styles.xml: "android/app/src/main/res/values/styles.xml"
2) you'll need to add a few lines:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="android:timePickerDialogTheme">#style/Dialog.Theme</item>
</style>
<style name="Dialog.Theme" parent="Theme.AppCompat.Light.Dialog">
<item name="colorAccent">#FF0000</item>
<item name="android:textColorPrimary">#0000FF</item>
</style>
In styles.xml you should already have:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
If you do just add the remaining lines. If not go ahead and add them.
4) Lastly, just recompile the app. "react-native run-android". You should see the color change right away.
Using React-native, unfortunately no.
However, by changing some java files in RN and using this solution from SO you might be able to do it.
If you succeed doing this, I suggest you create a Pull Request on RN's repository as it might be very useful for other users.
You could also develop it as a module and open source via NPM.
Anytime I have read an article on html and images, I have seen an anchor tag like this:
<img src="http://www.tizag.com/pics/htmlT/sunset.gif" />
However, in my case I have stored the image in AWS-S3 and I am reading image from S3. This, I do not upfront have a path like "http://www.tizag.com/pics/htmlT/sunset.gif"
So what is the most common technique to embed image in the html page when image is stored in S3, and the path to image is not known ?
In case my question is confusing, I will ask it differently.
I am building a project, which is simple. Whenever user is logged in he gets a page saying "Welcome" and below welcome note is is profile picture.
But, assume I have 10 users, each of these 10 users will have a different URL to the image.
eg:
<img src = "http:bucket.amazonaws.com/USER1'> for user 1
<img src = "http:bucket.amazonaws.com/USER2'> for user 2
and so on.
So the image I will display is not known until run-time and path to image is dependent on who logs in.
How to make my HTML page smart so that the image src is not a constant and can be made flexible depending on who logs in ?
SOLUTION IN JSP, WHICH I COULD DO, THANKS TO SO MANY ANSWERS:
<body>
<% String url = (String)request.getAttribute("url"); %>
<img src = <%= url %>></img>
</body>
This JSP code is called from the servlet.
request.setAttribute("url", "URL to image.");
RequestDispatcher view = request.getRequestDispatcher("URLImage.jsp");
view.forward(request, response);
You require some kind of server side programming language to generate the the paths for the image dynamically for each user. Anyway you do have a setup for the users to login. For that, I believe you have some kind of framework in some server side scripting language like PHP(Laravel, Wordpress, CodeIgniter), Java(Spring), Ruby(Rails), Python(Django).
So when a user logs in, your login script should validate the user and you will render a particular html page. And you should show the name of the user and a particular image. In PHP or Ruby on Rails you can embed the actual PHP code or ruby code in HTML.
In PHP, like this :
<html>
<head> </head>
<body>
<!-- say PHP Session varibale contains the logged in user's name & bucket name -->
<img src="<?php echo "https://"+ $_SESSION["bucket_name"] +".amazonaws.com/"+$_SESSION["username"] ?>" />
</body>
</html>
In Ruby on Rails, like this:
<html>
<head> </head>
<body>
<!-- say Ruby - Rails controller passes #username & #bucketname to view -->
<img src="<%= "https://"+ #bucketname +".amazonaws.com/" + #username %>" />
</body>
</html>
In Python - Django, like this :
<html>
<head> </head>
<body>
<!-- In Python - Django Suppose you pass context variables username & bucketname to template -->
<img src="https://{{ bucketname }}.amazonaws.com/{{ username }}" />
</body>
</html>
So what I would suggest is, you get familiar with the server side scripting language that you intend to use or are already using and manipulate the url to be generated based on logged in user accordingly.
If your bucket was named my-bucket and the image file was named my-image.png, then the format for the url would be http://my-bucket.s3.amazonaws.com/my-image.png.
In order to access the file though, you need to have a policy attached to your bucket that allows anyone to access the file. Below is a policy that works for this example.
{
"Id": "some-policy-id",
"Version": "2012-10-17",
"Statement": [
{
"Sid": "some-statement-id",
"Principal": "*",
"Action": [
"s3:GetObject"
],
"Effect": "Allow",
"Resource": "arn:aws:s3:::my-bucket/my-image.png"
}]
}
See the docs for more information about accessing a bucket.
Also note that the bucket name must be DNS compatible for this to work. See here under Rules for Bucket Naming.
My suggestion is:
<img src = "http:bucket.amazonaws.com/USER1'> for user 1
<img src = "http:bucket.amazonaws.com/USER2'> for user 2
according to your examples in user1 and user2 having same path is http:bucket.amazonaws.com/ make it common for all and put variable after that and according to your user id fetch image from there.
like <img src = "http:bucket.amazonaws.com/<?php echo $userimg; ?>'
or fetch img path from database according to users
You can use javascript / jQuery:
<script type="text/javascript">
$(document).ready(function(){
var userName = getUserNameValue;
document.getElementById("<%= loginImg.ClientID %>").src = "http:bucket.amazonaws.com/" + userName;
});
</script>
with html:
<img id="loginImg" src="default.img" />
You should be able to handle this like a simple 'insert your name here' kind of Hello World exercise.
Since the user is logged in, you should have at least some sort of information from the user, or can get it - username, first/last name, uniqueID, etc. Ideally when the user logs in, your server will provide you with an image filename, but whatever.
Store that uniqueID into a variable in your JS. This will be used to build your URL in JS.
Then, have the root path of your images in a separate variable.
var uniqueID = 'avatar_e2fbfbcbb52d_128'; // from login
var urlPrefix = 'http://www.tizag.com/pics/htmlT/';
var imageURL = urlPrefix + uniqueID + '.gif';
var imgNode = document.createElement("IMG");
imgNode.src = imageURL;
document.getElementById('imageDiv').appendChild(imgNode);
Then, in your HTML,
<div id='imageDiv></div>
I can tell you the approach since you don't have a code to edit or look into.
You can have an ajax call to your server once the user logged in, get the image URL from there or if you are having any back-end language then get the url from there.
Now the hard part, assigning the URL to the img source tag, so if you are doing the ajax call just store the data(URL) into the JavaScript variable and give img src as that variable, if you are doing it using server side language then also you can do the same, different languages have different way to do it and you need to google it out, or you can have the hidden field with id, assign that hidden field that value (URL) in your JSP or ASP page and use that in the img src.
Hope the approach works. I am a dot net developer and you are java developer so can't tell you the exact code.
Its very simple just try this out. I have added your image path just run this code.
<!DOCTYPE html>
<html>
<body>
<h2>Spectacular Mountain</h2>
<img src="http://www.tizag.com/pics/htmlT/sunset.gif" style="width:304px;height:228px;">
</body>
</html>
I'm definitely quite new to Vaadin (or similar frameworks) and I'm currently having great difficulties understanding how to include a chart (created using the Vaadin wrapper for JFreeChart) to the html file, which defines one of my views in Vaadin Navigator. I've followed this tutorial to create a Vaadin-compatible chart using JFreeChart and it's wrapper for Vaadin - JFreeChartWrapper. I seem unable to find an element in Vaadin's declarative format (you can test it here) that can make it possible for me to do that. My view for now is pretty simple and it includes a label and an embedded element (an image):
<v-vertical-layout size-full>
<v-label _id="watching" size-auto :middle :center/>
<v-embedded _id="pic" :middle :center :expand/>
<!-- add chart element here! (_id="chart") -->
</v-vertical-layout>
Is there some generic container for charts and if not, how can I add one? For my Navigator stuff I have adapted the AnimalViewer example in Vaadin's book.
According to the Vaadin book you can define a prefix for you component so you can use it in the HTML file. Suppose your class where you're using the vaadin addon/wrapper is com.example.chart.MyChart the following should be a working example:
<!DOCTYPE html>
<html>
<head>
<!-- define c as prefix for package com.example.chart -->
<meta name="package-mapping" content="c:com.example.chart"/>
</head>
<body>
<v-vertical-layout size-full>
<v-label _id="watching" size-auto :middle :center/>
<v-embedded _id="pic" :middle :center :expand/>
<!-- use MyChart -->
<c-my-chart _id="chart"/>
</v-vertical-layout>
</body>
</html>
my project is (controller + views...)
is it wrong to link 2 html pages, not through the servlet controller?
<html>
page2
</html>
----or---
<html>
page2
</html>
and then the server make the forward:
if (path.equals("/gotoPage2")) {
request.getRequestDispatcher("/views/page2.html").forward(request,
response); }
The second one is more clean in terms of keeping your logic in one place instead of doing logic in your view, although performance wise and easyness the first one is faster.
Pretty much up to you and what your needs/wants are
Depends on the scenario ,
<html>
page2
</html>
can be done to serve the static content as mainly html files are intended.Because you are not modifying the request attributes
<html>
page2
</html>
Can be done , when you pass some attributes in the request or add some filters