I am new to protractor and would like to test if a link is working.
I understand trying to get the element id but what should i expect that the link equals?
Also has anyone got any good documentation on example protractor tests?
I have been through this http://angular.github.io/protractor/#/tutorial which was helpful but i need more example of possible tests I could do.
i have this so far:
it('should redirect to the correct page', function(){
element(by.id('signmein').click();
expect(browser.driver.getCurrentUrl()).toEqual("http://localhost:8080/web/tfgm_customer/my-account");
});
would like to test if a link is working
This is a bit broad - it could mean the link to have an appropriate hrefattribute, or that after clicking a link there should be a new page opened.
To check the href attribute, use getAttribute():
expect(element(by.id('myLink')).getAttribute('href')).toEqual('http://myUrl.com');
To click the link use click(), to check the current URL, use getCurrentUrl():
element(by.id('myLink').click();
expect(browser.getCurrentUrl()).toEqual("http://myUrl.com");
Note that if there is a non-angular page opened after the click, you need to play around with ignoreSynchronization flag, see:
Non-angular page opened after a click
If the link is opened in a new tab, you need to switch to that window, check the URL and then switch back to the main window:
element(by.id('myLink')).click().then(function () {
browser.getAllWindowHandles().then(function (handles) {
browser.switchTo().window(handles[handles.length - 1]).then(function () {
expect(browser.getCurrentUrl()).toEqual("http://myUrl.com");
});
// switch back to the main window
browser.switchTo().window(handles[0]);
});
});
Related
So I am trying to figure out why my page loads me back to the default tab after being refreshed.
I want to stay in the current tab even after the page is refreshed/reloaded
It will most likely be due to your tabs being loaded on the client side.
This means each time you switch to a different tab, your not actually making a new request, only showing and hiding different tabs. If you reload tabs, it will default back to first tab.
Easiest and most common way around this would be to use a URL hash to track the user's active tab. Then when you're loading your tabs after each request, can check the URL for a hash and if one exists, show the corresponding tab.
More info here: http://www.w3schools.com/jsref/prop_loc_hash.asp
Hope this helps :)
It was the easiest way to stay the tab. Look at the code like below.
Copy this code and paste in your js file.
Don't forget to understand how does this code running. Good luck!
$(document).ready(function() {
if (location.hash) {
$("a[href='" + location.hash + "']").tab("show");
}
$(document.body).on("click", "a[data-toggle='tab']", function(event) {
location.hash = this.getAttribute("href");
});
});
$(window).on("popstate", function() {
var anchor = location.hash || $("a[data-toggle='tab']").first().attr("href");
$("a[href='" + anchor + "']").tab("show");
});
I am using createHTMLNotification for a chrome extension. The html for the notification includes a link in it. What im trying to figure out is how to close the notification when the link is clicked. My code is following
var notification = window.webkitNotifications.createHTMLNotification(
"notification.html"
);
notification.show();
The code on the notification.html page fills in the data. This page includes the jquery library. When I try to do:
$('#title > a').click(function() {
notification.cancel();
}
This of course does not work because notification is unknown on this html page. I have also tried to do a notification.onshow during the first part of the code where i create the notification, but this as well produced no results.
Well I figured it out. It was actually a pretty simple fix. All you have to do is in the click event for the href in the notification, add window.close(). This is because according to W3C specification it is a separate window so you can treat it as such
You can try following to set the focus to newly opened tab and close the notification on the way
notification.onclick = function(x) { window.focus(); this.cancel(); };
notification.show();
I am trying to write a JavaScript function that will open my extension like when the extension icon is clicked. I know how to open my extension in a new tab:
var url = "chrome-extension://kelodmiboakdjlbcdfoceeiafckgojel/login.html";
window.open(url);
But I want to open a pop-up in the upper right corner of the browser, like when the extension icon is clicked.
The Chromium dev team has explicitly said they will not enable this functionality. See Feature request: open extension popup bubble programmatically :
The philosophy for browser and page action popups is that they must be triggered by user action. Our suggestion is to use the new html notifications feature...
Desktop notifications can be used progammatically to present the user with a small HTML page much like your popup. It's not a perfect substitution, but it might provide the type of functionality you need.
Chrome team did create a method to open the popup programmatically, but it's only enabled as a private API, and plans to make it generally available have stalled due to security concerns.
So, as of March 2018 as of now, you still can't do it.
Short answer is that you cannot open browserAction programmatically. But you can create a dialog with your content script which emulates your browserAction and display that isntead (programmatically). However you won't be able to access your extension's background page from this popup directly as you can from your popup.html. You will have to pass message instead to your extension.
As mentioned there is no public API for this.
One workaround I have come up with is launching the extension as an iframe inside a content script with a button click. Whereby the background script emits the extension URL to the content script to be set as the iframe's src, something like below.
background.js
browser.runtime.onMessage.addListener((request) => {
if (request.open) {
return new Promise(resolve => {
chrome.browserAction.getPopup({}, (popup) => {
return resolve(popup)
})
})
}
})
content-scipt.js
const i = document.createElement('iframe')
const b = document.createElement('button')
const p = document.getElementById('some-id')
b.innerHTML = 'Open'
b.addEventListener('click', (evt) => {
evt.preventDefault()
chrome.runtime.sendMessage({ open: true }, (response) => {
i.src = response
p.appendChild(i)
})
})
p.appendChild(b)
This opens the extension in the DOM of the page the script is running on. You will also need to add the below to the manifest.
manifest.json
....
"web_accessible_resources": [
"popup.html"
]
....
You could emulate the popup by displaying a fixed html element on the page in the same location the popup would be and style it to look like the popup.
I had the same requirement: When the user clicks on the extension icon a small popup should open. In my case, I was writing an extension which will give updates on selective stocks whenever the icon is clicked. This is how my popup looked.
If you were having the same requirement then please read the answer below.
This is how my manifest.json file looked.
All the heavy lifting was handled by manifest.json file only. There is a section browser_action inside which there is a key called default_popup, just put the name of the HTML file that you want the popup to display.
I wanted my extension to work on all the pages that's why I added the attribute matches under content_scripts. I really didn't need to put the jquery file jquery-3.2.1.js inside the js array but the extension manager was not allowing me to keep that array empty.
Hope this helps, do comment if you have any doubt regarding the answer.
I have created a HTML link (<a>) using the Extjs BoxComponent and it works just fine. But instead of having a fixed URL associated with the link, I want to be able to update the href property when the user clicks the link.
In the code below the href is updated when the user cliks the link and I can verify this using FireBug on the HTML element. But the new page opening is missing my addition to the href.
Question:
Is it too late to modify the href on onClick or is it because I am modifying the href in the wrong way?
Code:
xtype: 'box',
html: 'Link to google',
listeners: {
render: function (c) {
c.getEl().on(
'click',
function() {
this.el.child('a', true).href = 'www.google.com/#q=' + some_dynamic_value;
},
c,
{ stopEvent: false }
);
}
}
Looks like this can work by using the mousedown event, instead of the click event.
Check out: http://jsfiddle.net/sadkinson/rF5TQ/15/
Its possible that by the time the click has happened changing the URL within it is too late. Is it not possible that whatrever causes your link to need updating can be done when that is changed rather than waiting till the user has clicked the link?
I would imagine a number of browsers would ignore this, simply because it would be an efficient way of being malicious. Putting a link to say "google" and then redirecting you to some virus ridden site etc, as even the most sensible user looking to see where a link would take them would see google until it was too late.
I'm trying to focus an existing tab when the content reloads. The usual window methods don't seem to work.
Here's whats happening: On page_1 I have a link like...
Go to my other page
If the tab doesn't exist, when the link is clicked it opens a new tab and takes focus. (Perfect)
If you then go back to page_1 and click the link again, it reloads the content in the existing tab (perfect) but doesn't focus (crap). I've tried the usual window.focus, $(window).focus methods on load with page_2 without luck.
Any recommendations?
It is impossible.
The following appears to work in IE8 and FF13:
<script type="text/javascript">
// Stupid script to force focus to an existing tab when the link is clicked.
// And yes, we do need to open it twice.
function openHelp(a) {
var tab = window.open(a.href, a.target);
tab.close();
tab = window.open(a.href, a.target);
return false;
}
</script>
Help
There is a workaround to this. Use javascript to open a window in a new tab, store a reference to that tab, and when you want to focus it; close it first and then re-open it.
if (window.existingWindow != null)
try { window.existingWindow.close(); } catch (e) { };
window.existingWindow = window.open("/your/url", "yourTabName");
We use a similar approach to opening the preview pane of the current page you're working on in our service called Handcraft where the above works as expected (we wanted the new window to always focus).
Without using a framework you can put a script block at the bottom of your page that will run once the page loads. Because it is after your HTML you can be assured that the HTML is refers to is actually available.
The script can set the focus to the element you want.