I created in my chrome extension (which because it's a webextension it works in Firefox) a window with
chrome.windows.create(windowobj);
where windowobj is an object with fields like the url, width, height, type='popup' and state='normal'.
When I use it in chrome I can use the new popup window normally, scrolling through the page. However, when I use it in Firefox I can't scroll in the new window. I tried resizing it, still doesn't scroll. When I change state to 'fullscreen' it still doesn't let me scroll.
(I'm using Firefox 59.0, if that makes any difference)
Thanks for your help,
MagnetPlant
I found the bug for this on Bugzilla - https://bugzilla.mozilla.org/show_bug.cgi?id=1331906 - which is still not fixed and the solution found by Techniko was this:
fix.html: (you could easily shorten this if you wanted to)
<script>
var url = new URL(window.location.href);
var parsedUrl = url.searchParams.get('url');
location.href = parsedUrl;
</script>
And then I set the url for a popup window to
windowobj.url = chrome.runtime.getURL('fix.html') + '?url=' + url;
For some reason after redirecting the url through there, the scrolling
in the popup window works normally
Related
I am learning Python and attempting to build a program that will scrape specific data from a website, store it and then manipulate it.
Currently I run my application, it opens a new chrome browser window and loads the page correctly. The problem is it should begin to start scrolling down and loading the remaining elements on the page.
I know the code works because if I manually click somewhere on the page that doesn't normally illicit a response (white space/empty areas) the browser somehow comes into "focus" and begins to iterate through the loop that scrolls down the page (by sending keys) prints the data I am after. I also noticed if I click another similar "dead space" area that contains the header, it doesn't have the same effect. I am unsure if this is something specific to Chrome, iFrames or something of that nature but I am completely stumped and would greatly appreciate any help.
Any thoughts on why I need to manually click on the new chrome window for it to work would be great.
Update: Still having the same issue, even tried with Safari and the same problem seems to exist.
Fixed this with:
element = driver.find_element_by_css_selector("div[id^='app-container']")
action = ActionChains(driver)
action.click(on_element = element)
action.perform()
I have been trying to load some PDFS that will show inside a Bootstrap accordion. The problem is that they load in a lot of different ways depending on the browser. I've been trying iframe and object html tags with different results and i have a huge flow in Safari where the accordion functionality breaks completely when i embed a PDF inside a panel.
So i guess my question is: Is there any sort of standard regarding crossbrowsing in order to make embeded PDF'S work in Chrome, Safari, IE11 and Firefox ?
Since i need this to work on mobile the situation is even worst. Some advice will be really appreciated.
Create a canvas element with the class "panel-body" and give it an id of your choosing. Then add the following code to your document ready event.
PDFJS.getDocument('YOURPDF.pdf').then(function(pdf) {
pdf.getPage(1).then(function(page) {
var scale = 1;
var viewport = page.getViewport(scale);
var canvas = document.getElementById('pdfOne'); // The id of your canvas
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext);
});
});
That will get the first page rendered. You'll need to create buttons to let the user navigate through the document but it should be easy enough to get that working based on what I've provided and the samples.
I am trying to make a Chrome extension such that to play songs from youtube. I have done this but I have a small problem. When I click the extension icon, a popup appears where I can search the song and play it, but when the popup disappears, the music stops playing. What can I do to make the music play in the background?
Here is the function that finds the song, and inserts iframe tag into my popup.html page
function showResponse(response) {
var responseString = response;
document.getElementById('response').innerHTML = responseString.items[0].id.videoId;
var videoId = responseString.items[0].id.videoId;
var iFrame = '<iframe width="300" height="300" src="https://www.youtube.com/embed/' + videoId + '"></iframe>';
document.getElementById('player').innerHTML = iFrame;
}
When the popup closes, the page that it contains is immediately and completely unloaded.
So your iframe is destroyed. And no, you can't keep the popup open.
An extension has one persistent page - the background page. You can try adding your iframe there - the sound should continue to play.
However, the page is invisible - you can't let the user control the player. Any user-accessible controls will need to be in the popup or some other UI.
I noticed that the Buffer app for chrome does things a little differently with a floating div when the extension icon is clicked. How is this achieved?
I don't believe they do this in a new window since I am not seeing an addition window being spawned.
Basically what I need is a thickbox to be displayed when the icon is clicked.
Any insight on how this is done would be appreciated.
They're using an api from that background page, to listen to the click event for when the browser action button gets clicked.
Here's a link to that API page:
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.executeScript(tab.id, {'file': 'createPopup.js'}, function callBackStub(){})
});
createPopup.js
You're html will be in a string. I personally recommend writing this like this:
var widgetHtml =
'<div id="main"> '+
' <p>some stuff goes here</p>'+
'</div>';
Then as your html grows, you can do a column edit of the beginning quote and end '+
Ok, now what you'll want to do is put your html in an iframe, but without setting a src property. Like this:
var iframe = document.createElement('iframe');
document.documentElement.appendChild(iframe); //fastest way to append to DOM: http://jsperf.com/insertbefore-vs-appendchild/2
iframe.contentDocument.body.innerHTML = widgetHtml;
WHY? So your stuff doesn't take on styles from the rest of the page.
Um, and then you can do a translateX or transition left/right position to slide the element into the page.
I'm stuck now, in a background page, I would like use the .html() jQuery method on the popup.html DOM from background.html.
I found something with
var x = chrome.extension.getViews({type:"popup"});
What I have to do with x?
The popup may be closed.
x will be an array of the windows you asked for, which in this case is the popup so should only be one.
Something like this should get you going....
var x = chrome.extension.getViews({type:"popup"});
if (x.length>0){
$(x[0].document.body).html('I had chicken for lunch!');
}
http://code.google.com/chrome/extensions/extension.html#method-getViews
Some more info:-
x will be only those list of popup window which is currently open, otherwise it will not return. You can access all variable and methods which are declared at popup's windows level