I am developing a LTI tool for Canvas LMS. The tool has 2 parts, content selector and content page. The content selector is embeddable while the content page is not embeddable. When the app is launched for first time, I would like to have the content selector embedded in an iframe. After users selected certain content, the app is launched for second time, the content page will be displayed in a new tab.
For now, the content selector will be displayed in the iframe, but when it try to display content page to the user, it display nothing, and I can see the error in chrome console: refused to display in iframe because it set X-Frame-Options=DENY.
I know there is options when creating an assignment: always open the tool in a new browser window, but could I just programmatically determine when to open the tool in the iframe, when to open it in a new browser window ?
Thanks in advance.
Canvas LMS (or any LMS) doesn't allow this configuration to be made on the fly. It has to be set before when you create external tool.
Related
I have successfully created a toolbar Chrome Extension that, when a page is loaded, adds buttons and other content. These buttons can interact with the main page.
What I can't do is update those buttons when I change the state of my Extension - from the popup, for instance.
If background.js knows that a change has happened, can it communicate to the content script to tell it to update the iframe? Without updating the parent page on which it sits?
My content scripts are added to every iframe on page...so there are often 4 or 5 versions of content.js on a given page.
Any high-level guidance deeply appreciated.
Of course the user can just refresh the entire page to get the changes...but I'd prefer to have the iframe toolbar update without the user having to take that additional step.
You can message through background.js to reach the content script...
Then do the following in the content script when receiving a message from background.js:
$('#iframeID').attr('src', $('#annotatePROsidebar').attr('src'));
I'd like to point the developer tools at a specific iframe within a document. In Firefox, there is a button in the toolbar. In Chrome, I found this:
But I don't know how to use this feature in panels other than the Console. In Firefox, "If you select an entry in the list, all the tools in the toolbox - the Inspector, the Console, the Debugger and so on - will now target only that iframe, and will essentially behave as if the rest of the page does not exist."
How to inspect elements in an iframe as if the rest of the page does not exist? I need to see how the iframe fits in the parent page, but don't want to see the elements of the parent page in the Elements panel (because of the depth of the elements).
One possible workaround is to enable the still-in-development Out-of-process iframes (OOPIF) using chrome://flags/#enable-site-per-process flag:
A new devtools floating window will open when an iframe is inspected via rightclick menu.
To inspect a youtube-like iframe with a custom context menu just rightclick again on that menu.
IFRAME contents won't be shown in the parent Inspector since it's in a different process.
You may want to do it on a separate installation of Chrome like Canary or a portable because the feature breaks iframes on some sites (these flags affect the entire data folder with all profiles inside).
Can you style with css the Requests Dialog of Facebook to your own look and HOW?
see Request Dialog Image
No, you can't.
See "Display mode" section of documentation for dialogs.
Dialog can be show in three modes: page (which is full page on facebook.com), popup (which is really first option but tailored to be opened as popup window) or iframe.
All of the options are out of question, since in iframe mode content of dialog is still document on domain owned by Facebook and cannot be styled by anyone except Facebook.
Currently they do not provide any ability to style dialogs (and I believe it's not going to change).
I have created a web page which for example contains some links and an iframe. These links are opened in iframe, so everything outside iframe is static (parent content doesn't reload). All works fine and all my pages are well structured so that it's easy to understand code of page.
But when I press a middle button on one of the mentioned links (to open it in a new tab or window) that isn't in iframe and normally should open in iframe, a browser will only display the content which is inside iframe and parent content will be lost.
What could be the best solution for this problem?
The only thing I need is an iframe which works as usual, targeted links are opened in it.
If a link is opened in a new tab or window, it looks the same if the link would have opened with a left click of mouse.
Instead of links you can use buttons, on them right or middle click can't be performed.
Better solution. Now I'm using jQuery BBQ with modified and improved initialization code.
I have two iframes on a page, one of which displays a simple asp.net page, the other is used to display office documents, normally in the browser using an active x control.
This all works fine unless I 1: run on IE6 SP3 & 2: disable the activeX control and allow the document to be shown natively by the client (i.e in word etc.). When this happens the document is displayed with no issues, however the other iframe is either blank or just displaying the background image.
Using fiddler I can see that all content has come down so the troublesome iframe should render correctly, however when I view its' source all I get is the top part of the content, down as far as
var theForm = document.f
Does anyone have any ideas ???