HTMLIFrameElement.setVisible()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the setvisible() method of the htmliframeelement is used to change the visibility state of the browser <iframe>. the visible state of a browser <iframe> has nothing to do with its actual visibility (which is handled through css). the visible state is used to define the level of resources required by the browser <iframe>. if the visible state is set to true, it means that the browser <iframe> should have high priority over the resources needed to render and handle its content. on the contrary, if its vi...
...the visible state is used to define the level of resources required by the browser <iframe>. if the visible state is set to true, it means that the browser <iframe> should have high priority over the resources needed to render and handle its content. on the contrary, if its visible state is set to false, it has low priority over the resources it needs. as an example, if the content of a browser <iframe> uses the window.requestanimationframe method and if the visible state is set to true, window.requestanimationframe will be called as often as necessary. however, if the visible state is set to false, window.requestanimationframe will be called only when there are free resources to do it. syntax instanceofhtmliframeelement.setvisible(visible); returns void. parameters visible a boolean t...
...tionframe method and if the visible state is set to true, window.requestanimationframe will be called as often as necessary. however, if the visible state is set to false, window.requestanimationframe will be called only when there are free resources to do it. syntax instanceofhtmliframeelement.setvisible(visible); returns void. parameters visible a boolean that indicates if the browser <iframe> visible state is true or false. examples var browser = document.queryselector('iframe'); browser.setvisible(true); specification not part of any specification. ...

nsIFrameLoaderOwner
content/base/public/nsiframeloader.idlscriptable represents the owner of an nsiframeloader. 1.0 66 introduced gecko 1.8 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview [noscript, notxpcom] alreadyaddrefed_nsframeloader getframeloader(); void swapframeloaders(in nsiframeloaderowner aotherowner); attributes attribute type description frameloader nsiframeloader the frame loader owned by this nsiframeloaderowner. read only. methods getframeloader() returns the frame loader object owned by this object. [noscript, notxpcom] alreadyaddrefed_nsframeloader getframeloader(); parameters none. ...
...oaders(in nsiframeloaderowner aotherowner); attributes attribute type description frameloader nsiframeloader the frame loader owned by this nsiframeloaderowner. read only. methods getframeloader() returns the frame loader object owned by this object. [noscript, notxpcom] alreadyaddrefed_nsframeloader getframeloader(); parameters none. return value the nsiframeloader owned by this object. swapframeloaders() swaps frame loaders with the given nsiframeloaderowner. this may only be possible in a very limited set of circumstances, or never, depending on the object implementing this interface. void swapframeloaders( in nsiframeloaderowner aotherowner ); parameters aotherowner the other frame loader owner with which to swap frame loaders. excepti...
...therowner ); parameters aotherowner the other frame loader owner with which to swap frame loaders. exceptions thrown ns_error_dom_security_err if the swap is not allowed on security grounds. ns_error_not_implemented if the swapping logic is not implemented for the either the current frame loader owner or the specified one with which you're trying to swap. see also nsiframeloader ...

HTMLIFrameElement.referrerPolicy - Web APIs
no referrer information is sent along with requests. no-referrer-when-downgrade (default) this is the user agent's default behavior if no policy is specified. the url is sent as a referrer when the protocol security level stays the same (http→http, https→https), but isn't sent to a less secure destination (https→http). origin only send the origin of the document as the referrer in all cases. ...
... request, only send the origin when the protocol security level stays the same (https→https), and send no header to a less secure destination (https→http). unsafe-url send a full url when performing a same-origin or cross-origin request. this policy will leak origins and paths from tls-protected resources to insecure origins. carefully consider the impact of this setting. examples var iframe = document.createelement("iframe"); iframe.src = "/"; iframe.referrerpolicy = "unsafe-url"; var body = document.getelementsbytagname("body")[0]; body.appendchild(iframe); // fetch the image using the complete url as the referrer specifications specification status comment referrer policythe definition of 'referrerpolicy attribute' in that specification. candidate...
... living standard browser compatibility the compatibility table on this page is generated from structured data. if you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. ...

iframe.transparent - Archive of obsolete content
this can be used to workaround things like bug 540911 ...
...this can be used to workaround things like bug 540911 ...

HTMLIFrameElement.clearMatch()
parameters none. examples the following function is taken from our browser api demo, and (amongst other things) clears the search results when the search bar is hidden, if an existing search is active. ...
... parameters none. examples the following function is taken from our browser api demo, and (amongst other things) clears the search results when the search bar is hidden, if an existing search is active. see implementing the search bar for more explanation. ...

HTMLIFrameElement.download()
its request.onsuccess handler handles the success case, and its request.onerror handler handles the failure case. parameters url the url of the file to be downloaded. options optional an options object allowing optional settings to be specified for the download. the available options are: filename: the filename to save the downloaded file as. ...
...tional settings to be specified for the download. the available options are: filename: the filename to save the downloaded file as. if this is not specified, the filename used will be the original filename, as specified in the url. referrer: specifies a referrer for the downloaded file. if this is not specified there will be no referrer. examples var browser = document.queryselector('iframe'); var request = browser.download(foourl, { filename: 'foo.bin' }); request.onsuccess = function() { console.log("file downladed"); } request.onerror = function() { console.log("download error"); } specification not part of any specification. ...

HTMLIFrameElement.findNext()
parameters direction a string indicating the direction in which you want to cycle through the available search results. available values are forward and backward. ...
...ous instance of a search result after a findall() search has been carried out. invoking this method results in a mozbrowserfindchange event firing, which carries details about the search results. note: use of the browser api requires a privileged app, and browser and/or embed-apps permissions, depending on what you want to do. see using the browser api for more details. syntax instanceofhtmliframeelement.findnext(direction); return value void. parameters direction a string indicating the direction in which you want to cycle through the available search results. available values are forward and backward. examples the following functions are taken from our browser api demo, and cycle through the available search results. see implementing the search bar for more explanation. prev.a...

HTMLIFrameElement.getContentDimensions()
warning: removed in firefox 65. the getcontentdimensions() method of the htmliframeelement interface retrieves the x and y dimensions of the content window. note: the values returned are equivalent to document.body.scrollwidth and document.body.scrollheight. syntax var instanceofdomrequest = instanceofhtmliframeelement.getcontentdimensions(); returns a domrequest for handling the dimensions request. its request.onsuccess handler handles the success case, and its request.onerror handler handles the failure case. the x and y dimensions are available in the request.result.x and request.result.y properties, respectively. parameters none. ...
...tanceofhtmliframeelement.getcontentdimensions(); returns a domrequest for handling the dimensions request. its request.onsuccess handler handles the success case, and its request.onerror handler handles the failure case. the x and y dimensions are available in the request.result.x and request.result.y properties, respectively. parameters none. examples var browser = document.queryselector('iframe'); var request = browser.getcontentdimensions(); request.onsuccess = function() { console.log("page size:", request.result.width + "x" + request.result.height); } request.onerror = function() { console.log("download error"); } specification not part of any specification. ...

HTMLIFrameElement.getScreenshot()
warning: removed in firefox 65. the getscreenshot() method of the htmliframeelement lets you request a screenshot of a content <iframe>, scaled to fit within a specified maximum width and height. the image will be cropped if necessary but will not be distorted vertically or horizontally. note: getscreenshot() waits for the event loop to go idle before it takes the screenshot. it won't wait more than 2000ms (this delay is defined by the gecko dom.browserelement.maxscreenshotdelayms preference). syntax var instanceofdomrequest = instanceofhtmliframeelement.getscreenshot(maxwidth, maxheight, mimetype); returns a domrequest for handling the screenshot request. its request.onsuccess handler handles the success case (the screenshot is contained in request.result as a blob object)...
... in device pixels. maxheight a number representing the maximum height of the screenshot in device pixels. mimetype optional a mime type specifying the format of the image to be returned; if not specified, the default used is image/jpeg. use image/png to capture the alpha channel of the rendered result by returning a png-format image. this lets you get a transparent background for the content <iframe>. examples var browser = document.queryselector('iframe'); var request = browser.getscreenshot(100, 100); request.onsuccess = function() { var blob = request.result; var url = url.createobjecturl(blob); } specification not part of any specification. ...

HTMLIFrameElement.getStructuredData()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the getstructureddata() method of the htmliframeelement interface retrieves any structured microdata (and hcard and hcalendar microformat data) contained in the html loaded in the browser <iframe> and returns it as json. syntax var instanceofdomrequest = instanceofhtmliframeelement.getstructureddata(); returns a domrequest to handle the getstructureddata() request's success and error cases. if the request is successful, the request.result is a json object representation of all microdata contained on...
...it as json. syntax var instanceofdomrequest = instanceofhtmliframeelement.getstructureddata(); returns a domrequest to handle the getstructureddata() request's success and error cases. if the request is successful, the request.result is a json object representation of all microdata contained on the page loaded in the browser. parameters none. ...

HTMLIFrameElement.getVolume()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the getvolume() method of the htmliframeelement gets the current volume of the browser <iframe>. syntax there are two versions of this method, a callback version: var request = instanceofhtmliframeelement.getvolume(); and a promise version: instanceofhtmliframeelement.getvolume().then(function(volume) { ... }); returns callback version: a domrequest that represents the get volume request. it has an onsuccess handler to handle the success case, and an onerror handler to handle the failure case. ...
...uccess handler to handle the success case, and an onerror handler to handle the failure case. the volume value is available in the request.result property, and is a floating point number between 0 and 1. promise version: a promise that resolves with the volume value — a floating point number between 0 and 1. parameters none. example callback version: var browser = document.queryselector('iframe'); var request = browser.getvolume(); request.onsuccess = function() { console.log('the current browser volume is ' + request.result); } promise version: var browser = document.queryselector('iframe'); browser.getvolume().then(function(volume) { console.log('the current browser volume is ' + volume); }); specification not part of any specification. ...

HTMLIFrameElement.zoom()
warning: removed in firefox 65. the zoom() method of the htmliframeelement interface changes the zoom factor of the browser <iframe>'s content. this is particularly useful for zooming in/out on non-touch-enabled devices. syntax var instanceofdomrequest = instanceofhtmliframeelement.zoom(zoomfactor); returns void. parameters zoomfactor a unitless number value representing the amount to zoom in or out. it acts like a percentage, so for example 1.1 would zoom in by 10%, whereas 0.9 would zoom out by 10%. ...
...seful for zooming in/out on non-touch-enabled devices. syntax var instanceofdomrequest = instanceofhtmliframeelement.zoom(zoomfactor); returns void. parameters zoomfactor a unitless number value representing the amount to zoom in or out. it acts like a percentage, so for example 1.1 would zoom in by 10%, whereas 0.9 would zoom out by 10%. examples var browser = document.queryselector('iframe'); var zoomfactor = 1; zoomin.addeventlistener('touchend',function() { zoomfactor += 0.1; browser.zoom(zoomfactor); }); zoomout.addeventlistener('touchend',function() { zoomfactor -= 0.1; browser.zoom(zoomfactor); }); specification not part of any specification. ...

HTMLIFrameElement.addNextPaintListener()
warning: removed in firefox 65. the addnextpaintlistener() method of the htmliframeelement is used to define a handler to listen for the next mozafterpaint event coming from the browser <iframe>. this event provides information about what has been repainted. it is mainly used to investigate performance optimization. note: the handler will receive the event once and then be thrown away. syntax instanceofhtmliframeelement.addnextpaintlistener(listener); returns void. parameters listener a function handler to listen for a mozafterpaint event. examples var browser = document.queryselector('iframe'); function onnextpaint() { console.log("paint has occured"); } browser.addnextpaintlistener(onnextpaint); specification not part of any specification. ...

HTMLIFrameElement.findAll()
warning: removed in firefox 65. the findall() method of the htmliframeelement searches for a string in a browser <iframe>'s text content; if found, the first instance of the string relative to the caret position will be highlighted. invoking this method results in a mozbrowserfindchange event firing, which carries details about the search results. note: use of the browser api requires a privileged app, and browser and/or embed-apps permissions, depending on what you want to do. see using the browser api for more details. syntax instanceofhtmliframeelement.findall(searchstring, casesensitivity); returns void. parameters searchstring the string you want to search for in the browser <iframe>'s text. casesensitivity a string to declare whether you want the search to be case sensit...

HTMLIFrameElement.getActive()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the getactive() method of the htmliframeelement indicates whether the current browser <iframe> is the currently active frame. syntax var amiactive = instanceofhtmliframeelement.getactive(); returns a boolean indicating whether the current browser <iframe> is the currently active frame (true) or not (false.) parameters none. example var browser = document.queryselector('iframe'); var amiactive = browser.getactive(); specification not part of any specification. ...

HTMLIFrameElement.getCanGoBack()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the getcangoback() method of the htmliframeelement interface is used to indicate whether it's possible to go back in the navigation history of the browser <iframe>. syntax instanceofhtmliframeelement.getcangoback() .then(function(result) { ... }); returns a promise that resolves with a boolean that equals true if the history can be navigated backward or false if not. parameters none. example function canmovebwd() { browser.getcangoback().then(function(result) { if (result) { back.dis...

HTMLIFrameElement.getCanGoForward()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the getcangoforward() method of the htmliframeelement is used to indicate whether it's possible to go forward in the navigation history of the browser <iframe>. syntax instanceofhtmliframeelement.getcangoforward() .then(function(result) { ... }); returns a promise that resolves with a boolean that equals true if the history can be navigated forward or false if not. parameters none. example function canmovefwd() { browser.getcangoforward().then(function(result) { if (result) { fwd.dis...

HTMLIFrameElement.getManifest()
warning: removed in firefox 65. the getmanifest() method of the htmliframeelement interface retrieves the manifest of an app loaded in the browser <iframe> and returns it as json. syntax instanceofhtmliframeelement.getmanifest().then(function(json) { ... }); parameters none. return value a promise that resolves to a json object representation of the loaded app's manifest. examples var browser = document.queryselector('iframe'); browser.addeventlistener('mozbrowserloadend',function() { var request = browser.getmanifest().then(function(json) { console.log(json); }); }); specification not part of any specification. ...

HTMLIFrameElement.goBack()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the goback() method of the htmliframeelement interface is used to navigate backwards in the browser <iframe>'s history. by calling this method, the browser <iframe> changes its location for the previous location available in its navigation history, which sends a series of related events: mozbrowserlocationchange, mozbrowserloadstart, and so on. syntax instanceofhtmliframeelement.goback(); returns void. parameters none. examples back.addeventlistener('touchend',function() { browser.goback(); }...

HTMLIFrameElement.goForward()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the goforward() method of the htmliframeelement is used to navigate forward in the browser <iframe>'s history. by calling this method, the browser <iframe> changes its location to the next location available in its navigation history, which sends a series of related events: mozbrowserlocationchange, mozbrowserloadstart and so on. syntax instanceofhtmliframeelement.goforward(); returns void. parameters none. examples fwd.addeventlistener('touchend',function() { browser.goforward(); }); specif...

HTMLIFrameElement.mute()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mute() method of the htmliframeelement mute any audio playing in the browser <iframe>. syntax instanceofhtmliframeelement.mute(); returns void. parameters none. example var browser = document.queryselector('iframe'); browser.mute(); specification not in a specification. ...

HTMLIFrameElement.reload()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the reload() method of the htmliframeelement interface is used to reload the content of the <iframe>. syntax instanceofhtmliframeelement.reload(hardreload); returns void. parameters hardreload optional a boolean that indicates whether all the resources to reload must be revalidated (true) or may be taken directly from the browser cache (false). examples stopreload.addeventlistener('touchend',function() { if(stopreload.textcontent === 'x') { browser.stop(); } else { browser.reload...

HTMLIframeElement.removeNextPaintListener()
warning: removed in firefox 65. the removenextpaintlistener() method of the htmliframeelement interface is used to remove a handler previously set with the addnextpaintlistener method. syntax instanceofhtmliframeelement.removenextpaintlistener(listener); returns void. parameters listener a function handler previously set with addnextpaintlistener. examples var browser = document.queryselector('iframe'); function onnextpaint() { console.log("paint has occured"); } browser.addnextpaintlistener(onnextpaint); browser.removenextpaintlistener(onnextpaint); specification not part of any specification. ...

HTMLIFrameElement.setActive()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the setactive() method of the htmliframeelement sets the current <iframe> as the active frame, which has an effect on how it is prioritized by the process manager. syntax instanceofhtmliframeelement.setactive(boolean); returns void. parameters boolean a boolean that indicates whether the iframe is to be the active frame (true) or not (false). example var browser = document.queryselector('iframe'); browser.setactive(); specification not part of any specification. ...

HTMLIFrameElement.setVolume()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the setvolume() method of the htmliframeelement sets the current volume of the browser <iframe>. syntax instanceofhtmliframeelement.setvolume(number); returns void. parameters number a floating point number representing the volume you want to set — this can have a value between 0 and 1. example var browser = document.queryselector('iframe'); browser.setvolume(0.5); specification not part of any specification. ...

HTMLIFrameElement.stop()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the stop() method of the htmliframeelement interface is used to stop loading the content of the <iframe>. syntax instanceofhtmliframeelement.stop(); returns void. parameters none. examples stopreload.addeventlistener('touchend',function() { if(stopreload.textcontent === 'x') { browser.stop(); } else { browser.reload(); } }); specification not part of any specification. ...

HTMLIFrameElement.unmute()
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the unmute() method of the htmliframeelement unmutes any audio playing in the browser <iframe>. syntax instanceofhtmliframeelement.unmute(); returns void. parameters none. example var browser = document.queryselector('iframe'); browser.unmute(); specification not part of any specification. ...

nsIFrameMessageListener
be returned in the specified json object. ...

nsIIFrameBoxObject
note: please consider using nsicontainerboxobject instead. attributes attribute type description docshell nsidocshell read only. obsolete since gecko 1.9 the nsidocshell object that manages the contained document. the general.xml binding uses this property to gain access to the webnavigation, contentdocument and contentwindow properties. ...

Working with iframes - Firefox Developer Tools
you can point the developer tools at a specific iframe within a document. you'll see a button in the toolbar: click it, and you'll see a popup listing all the iframes in the document, as well as the main document itself. 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. ...

HTMLIFrameElement.contentWindow - Web APIs
the contentwindow property returns the window object of an htmliframeelement. you can use this window object to access the iframe's document and its internal dom. this attribute is read-only, but its properties can be manipulated like the global window object. example of contentwindow var x = document.getelementsbytagname("iframe")[0].contentwindow; //x = window.frames[0]; x.document.getelementsbytagname("body")[0].style.backgroundcolor = "blue"; // this would turn the 1st iframe in document blue. specifications specification status comment html living standardthe definition of 'htmliframeelement: contentwindow' in that specification. living standard ...

HTMLIFrameElement.csp - Web APIs
specifications specification status comment content security policy: embedded enforcementthe definition of 'csp' in that specification. working draft initial definition. browser compatibility the compatibility table on this page is generated from structured data. if you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. ...

HTMLIFrameElement.featurePolicy - Web APIs
the featurepolicy read-only property of the htmliframeelement interface returns the featurepolicy interface which provides a simple api for introspecting the feature policies applied to a specific frame. syntax var policy = htmliframeelement.featurepolicy value a featurepolicy object that can be used to inspect the feature policy settings applied to the frame. specification specification status comment feature policy editor's draft initial definition. ...

Index - Web APIs
f the body mixin takes a response stream and reads it to completion. it returns a promise that resolves with a usvstring object (text). the response is always decoded using utf-8. ...
...messages are broadcasted via a message event fired at all broadcastchannel objects listening to the channel. 364 broadcastchannel() api, broadcast channel api, broadcastchannel, constructor, experimental, html api, reference the broadcastchannel() constructor creates a new broadcastchannel and connects it to the underlying channel. ...
...on interface represents the caret position, an indicator for the text insertion point. you can get a caretposition using the document.caretpositionfrompoint method. 612 channel messaging api api, channel messaging, html api, overview, reference the channel messaging api allows two separate scripts running in different browsing contexts attached to the same document (e.g., two iframes, or the main document and an iframe, two documents via a sharedworker, or two workers) to communicate directly, passing messages between one another through two-way channels (or pipes) with a port at each end. 613 using channel messaging api, channel messaging, html5, messagechannel, messageport, tutorial the channel messaging api allows two separate scripts running in diffe...
...And 27 more matches

Browser API
the html browser api is an extension of the html <iframe> element that allows web apps to implement browsers or browser-like applications. it currently works in (privileged) chrome code on firefox desktop (version 47 and above). browser api concepts and usage the browser api consists of two major parts: custom <iframe> attributes: by adding a mozbrowser attribute to the <iframe> element we can make it appear like a top-level browser window to the embedded content. this means that window.top, window.parent, window.frameelement, etc. should not reflect the frame hierarchy. api extensions: the api includes several new methods and events to manipulate and listen for changes to the embedded content's state, interited by the htmliframeelement interface. browser api interfaces to support th...
...el browser window to the embedded content. this means that window.top, window.parent, window.frameelement, etc. should not reflect the frame hierarchy. api extensions: the api includes several new methods and events to manipulate and listen for changes to the embedded content's state, interited by the htmliframeelement interface. browser api interfaces to support the requirement of a browser <iframe>, the htmliframeelement dom interface has been extended with new methods that give the <iframe> some super powers. navigation methods the following navigation methods allow navigation through the browsing history of the <iframe>. they are necessary to be able to implement back, forward, stop, and reload buttons. htmliframeelement.reload() allows reloading of the <iframe> element content. h...
...the htmliframeelement dom interface has been extended with new methods that give the <iframe> some super powers. navigation methods the following navigation methods allow navigation through the browsing history of the <iframe>. they are necessary to be able to implement back, forward, stop, and reload buttons. htmliframeelement.reload() allows reloading of the <iframe> element content. htmliframeelement.stop() allows stopping of the <iframe>'s content loading. htmliframeelement.getcangoback() indicates whether it's possible to navigate backwards. htmliframeelement.goback() changes the location of the <iframe> for the previous location in its browsing history. htmliframeelement.getcangoforward() indicates whether it's possible to navigate forward. ...
...And 20 more matches

Using the Browser API
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the html browser api is an extension of the html <iframe> element that allows web apps to implement browsers or browser-like applications. ...
...this means that window.top, window.parent, window.frameelement, etc. should not reflect the frame hierarchy. ...
...rame> element that allows web apps to implement browsers or browser-like applications. it was originally used in firefox os to implement browser applications before that project was cancelled; since firefox 47 it is available to desktop chrome code and used in places like the firefox devtools. ...
...And 17 more matches

Inner-browsing extending the browser navigation paradigm - Archive of obsolete content
tions new continuity, precision and control. this model is also interesting because is optimized to access contextual data instead reloading full web pages. this article discusses the concept of inner-browsing and possible approaches for its implementation. it also provides two implementation examples using the model. the first one looks like a traditional dhtml ticker application and uses hidden iframes and javascript to provide updates inside the webpage's ticker headlines section. this sample was made using iframes to illustrate a possible implementation. an implementation can also use other transport technologies such as soap-based remote procedure calls, xmlhttprequest interfaces, or dom 3 load. the second example shows a tabbed menu that dynamically loads news headlines into the current we...
... document, or as complex as performing dynamic transformations on the data source before applying the changes into the current document. for example, if a given web site's framework uses xslt to format xml contents as html, would be appropriate to reuse xslt to format new data that is about to be part of the current document. ...
...g dynamic transformations on the data source before applying the changes into the current document. for example, if a given web site's framework uses xslt to format xml contents as html, would be appropriate to reuse xslt to format new data that is about to be part of the current document. the next section illustrates a case of implementation using javascript, iframes and dom. inner-browsing with iframes and javascript a very simple way to approach inner-browsing is to use html iframes to retrieve data from a web server and update the main page. iframes are already a very well established standard, and are implemented with the same functionalities in all modern browsers. a point worth recalling is that iframes contain documents, which can contain xml documents. the xml document is an excellent s...
...And 14 more matches

Using channel messaging - Web APIs
the channel messaging api allows two separate scripts running in different browsing contexts attached to the same document (e.g., two iframes, or the main document and an iframe, or two documents via a sharedworker) to communicate directly, passing messages between one another through two-way channels (or pipes) with a port at each end. in this article we'll explore the basics of using this technology. note: this feature is available in web workers. use cases channel messaging is mainly useful in cases where you've got a social site that embeds capabilities from other sites into its main interface via iframes, such as games, address book, or an audio player with personalized music choices. when these act as standalone units, things are ok, but the difficulty comes when you want interaction ...
...able in web workers. use cases channel messaging is mainly useful in cases where you've got a social site that embeds capabilities from other sites into its main interface via iframes, such as games, address book, or an audio player with personalized music choices. when these act as standalone units, things are ok, but the difficulty comes when you want interaction between the main site and the iframes, or the different iframes. for example, what if you wanted to add a contact to the address book from the main site, add high scores from your game into your main profile, or add new background music choices from the audio player onto the game? such things are not so easy using conventional web technology, because of the security models the web uses. you have to think about whether the origins tr...
...ing contexts. note: for more information and ideas, the ports as the basis of an object-capability model on the web section of the spec is a useful read. simple examples to get your started, we have published a couple of demos on github. ...
...And 14 more matches

Using Feature Policy - HTTP
dividual policy directives. a policy directive is a combination of a defined feature name, and an allowlist of origins that can use the feature. features within a policy are separated by semicolons. allowlist an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. specifying your policy feature policy provides two ways to specify policies to control features: ...
...the header controls features in the response and any embedded content within the page. the feature-policy http header you can send the feature-policy http header with the response of a page. ...
...And 14 more matches

Space Manager Detailed Design - Archive of obsolete content
be). it is not a general purpose class, and is not intended to be subclasses . here is the class declaration, taken from the source file as of 01.08.02 /** * class for dealing with bands of available space. the space manager * defines a coordinate space with an origin at (0, 0) that grows down * and to the right. */ class nsspacemanager { public: nsspacemanager(nsipresshell* apresshell, nsiframe* aframe); ~nsspacemanager(); void* operator new(size_t asize); void operator delete(void* aptr, size_t asize); static void shutdown(); /* * get the frame that's associated with the space manager. this frame * created the space manager, and the world coordinate space is * relative to this frame. * * you can use queryinterface() on this frame to get any additional * i...
...manager(); void* operator new(size_t asize); void operator delete(void* aptr, size_t asize); static void shutdown(); /* * get the frame that's associated with the space manager. this frame * created the space manager, and the world coordinate space is * relative to this frame. * * you can use queryinterface() on this frame to get any additional * interfaces. */ nsiframe* getframe() const { return mframe; } /** * translate the current origin by the specified (dx, dy). this * creates a new local coordinate space relative to the current * coordinate space. */ void translate(nscoord adx, nscoord ady) { mx += adx; my += ady; } /** * returns the current translation from local coordinate space to * world coordinate space. this represents the a...
...ace is * relative to the local coordinate system. * * the region is tagged with a frame * * @param aframe the frame used to identify the region. must not be null * @param aunavailablespace the bounding rect of the unavailable space * @return ns_ok if successful * ns_error_failure if there is already a region tagged with aframe */ nsresult addrectregion(nsiframe* aframe, const nsrect& aunavailablespace); /** * resize the rectangular region associated with aframe by the specified * deltas. the height change always applies to the bottom edge or the existing * rect. you specify whether the width change applies to the left or right edge * * returns ns_ok if successful, ns_error_invalid_arg if there is no region ...
...And 12 more matches

Canvas code snippets - Archive of obsolete content
note that this only works if you are running the page from chrome. if you try running the code as a plain webpage, you will get a 'security error" code: "1000' error. remotecan...
... note that this only works if you are running the page from chrome. ...
...is only works if you are running the page from chrome. if you try running the code as a plain webpage, you will get a 'security error" code: "1000' error. ...
...And 11 more matches

Event reference
d the corresponding raw samples are available. mozbeforeresize mozilla specific a window is about to be resized. mozbrowseractivitydone firefox os browser api-specific sent when some activity has been completed (complete description tbd.) mozbrowserasyncscroll firefox os browser api-specific sent when the scroll position within a browser <iframe> changes. mozbrowseraudioplaybackchange firefox os browser api-specific sent when audio starts or stops playing within the browser <iframe> content. mozbrowsercaretstatechanged firefox os browser api-specific sent when the text selected inside the browser <iframe> content changes. mozbrowserclose firefox os browser api-specific sent when wi...
...ckchange firefox os browser api-specific sent when audio starts or stops playing within the browser <iframe> content. mozbrowsercaretstatechanged firefox os browser api-specific sent when the text selected inside the browser <iframe> content changes. mozbrowserclose firefox os browser api-specific sent when window.close() is called within a browser <iframe>. mozbrowsercontextmenu firefox os browser api-specific sent when a browser <iframe> tries to open a context menu. mozbrowserdocumentfirstpaint firefox os browser api-specific sent when a new paint occurs on any document in the browser <iframe>. mozbrowsererror firefox os browser api-specific sent when an error occurred while trying to load...
...menu firefox os browser api-specific sent when a browser <iframe> tries to open a context menu. mozbrowserdocumentfirstpaint firefox os browser api-specific sent when a new paint occurs on any document in the browser <iframe>. mozbrowsererror firefox os browser api-specific sent when an error occurred while trying to load a content within a browser <iframe>. ...
...And 10 more matches

The JavaScript input interpreter - Firefox Developer Tools
f9 on windows and linux ( ctrl+r on mac) cycles backwards through the matches. once you have initiated the reverse search, you can use shift + f9 on windows or linux ( ctrl+s on mac) to search forward in the list of matches. you can also use the ⋀ and ⋁ icons in the expression search bar. when you find the expression you want, press enter (return) to execute the statement. ...
...ac) cycles backwards through the matches. once you have initiated the reverse search, you can use shift + f9 on windows or linux ( ctrl+s on mac) to search forward in the list of matches. you can also use the ⋀ and ⋁ icons in the expression search bar. when you find the expression you want, press enter (return) to execute the statement. ...
...earch, you can use shift + f9 on windows or linux ( ctrl+s on mac) to search forward in the list of matches. you can also use the ⋀ and ⋁ icons in the expression search bar. when you find the expression you want, press enter (return) to execute the statement. working with iframes if a page contains embedded iframes, you can use the cd() function to change the console's scope to a specific iframe, and then you can execute functions defined in the document hosted by that iframe. ...
...And 7 more matches

HTML attribute reference - HTML: Hypertext Markup Language
ut> list of types the server accepts, typically a file type. accept-charset <form> list of supported charsets. accesskey global attribute keyboard shortcut to activate or add focus to the element. action <form> the uri of a program that processes the information submitted via the form. align <applet>, <caption>, <col>, <colgroup>, <hr>, <iframe>, <img>, <table>, <tbody>, <td>, <tfoot> , <th>, <thead>, <tr> specifies the horizontal alignment of the element. allow <iframe> specifies a feature-policy for the iframe. alt <applet>, <area>, <img>, <input> alternative text in case an image can't be displayed. async <script> executes the script asynchronously. autocapitalize global att...
...element which will serve as the element's context menu. controls <audio>, <video> indicates whether the browser should show playback controls to the user. coords <area> a set of values specifying the coordinates of the hot-spot region. crossorigin <audio>, <img>, <link>, <script>, <video> how the element handles cross-origin requests csp <iframe> specifies the content security policy that an embedded document must agree to enforce upon itself. data <object> specifies the url of the resource. data-* global attribute lets you attach custom attributes to an html element. datetime <del>, <ins>, <time> indicates the date and time associated with the element. decoding <img> indicat...
...submit"), this attribute specifies the browsing context (for example, tab, window, or inline frame) in which to display the response that is received after submitting the form. if this attribute is specified, it overrides the target attribute of the button's form owner. headers <td>, <th> ids of the <th> elements which applies to this element. height <canvas>, <embed>, <iframe>, <img>, <input>, <object>, <video> specifies the height of elements listed here. for all other elements, use the css height property. note: in some instances, such as <div>, this is a legacy attribute, in which case the css height property should be used instead. hidden global attribute prevents rendering of given element, while keeping child elements, e...
...And 7 more matches

HTML to DOM - Archive of obsolete content
into dom for easier manipulation. however, there are potential dangers involved in injecting remote content in a privileged context in your extension, so it can be desirable to parse the html safely. the function below will safely parse simple html and return a dom object which can be manipulated like web page elements. this will remove tags like <script>, <style>, <head>, <body>, <title>, and <iframe>. it will also remove all javascript, including element attributes that contain javascript. function htmlparser(ahtmlstring){ var html = document.implementation.createdocument("http://www.w3.org/1999/xhtml", "html", null), body = document.createelementns("http://www.w3.org/1999/xhtml", "body"); html.documentelement.appendchild(body); body.appendchild(components.classes["@mozilla.org/f...
... parsing complete html to dom loading an html document seems much simpler if it's loaded using the xmlhttprequest object. for that matter, we're going to load our html document first: var request = xmlhttprequest(); request.open("get", "http://example.org/file.html", false); request.send...
...ent object with its complete functions list, therefore you can retrieve info within div tag like this: var dompars = htmlparser("<div id='userinfo'>john was a mediocre programmer, but people liked him <strong>anyway</strong>.</div>"); alert(dompars.getelementbyid('userinfo').innerhtml); to parse a complete html page, load it into an iframe whose type is content (not chrome). see using a hidden iframe element to parse html to a window's dom below. parsing complete html to dom loading an html document seems much simpler if it's loaded using the xmlhttprequest object. for that matter, we're going to load our html document first: var request = xmlhttprequest(); request.open("get", "http://example.org/file.html", false); request.send(null); our next step is to create the document object that ...
...And 6 more matches

Using Remote XUL - Archive of obsolete content
ml-based language, and this instruction tells browsers how to parse the document. the window element is the root (outermost) element in a xul document and encompasses all other elements. it is analogous to the <html> element in html. these two elements give us a valid xul document we can load and display in our web browser, even though there's nothing to see yet. ...
... other elements. it is analogous to the <html> element in html. these two elements give us a valid xul document we can load and display in our web browser, even though there's nothing to see yet. source | rendered step 2: an iframe for displaying the web site content now that we have a basic xul document, we need a way to display pages from the mozilla.org web site. for that we'll use a xul iframe element. <?xml version="1.0"?> <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <iframe src="https://www.mozilla.org/" flex="1" /> </window> the xul iframe element is just like its html counterpart: it defines an area within which web content can be displayed. its src attribute contains the url of the page being displayed in the iframe. we set this value to the...
...zilla.org/keymaster/gatekeeper/there.is.only.xul"> <iframe src="https://www.mozilla.org/" flex="1" /> </window> the xul iframe element is just like its html counterpart: it defines an area within which web content can be displayed. its src attribute contains the url of the page being displayed in the iframe. we set this value to the mozilla.org home page by default so that page loads into the iframe when we first load the xul document. the iframe's flex attribute tells the browser to stretch the iframe to fill the space available to it. without it, the iframe's size would be a fixed default and wouldn't change when the user resized their window. [optionally show what this looks like] the value of the flex attribute determines the extent to which the element will stretch relative to other ...
...And 6 more matches

Autoplay guide for media and Web Audio APIs - Web media technologies
otherwise, the playback will likely be blocked. the exact situations that result in blocking, and the specifics of how sites become whitelisted vary from browser to browser, but the above are good guidelines to go by. for details, see the auto-play policies for google chrome and webkit. note: put another way, playback of any media that includes audio is generally blocked i...
...racters), indicating that autoplay is permitted as they're hosted on the same domain as the document. you can also specify 'none' to disable autoplay entirely, '*' to allow autoplay from all domains, or one or more specific origins from which media can be automatically played. these origins are separated by space characters. note: the specified feature policy applies to the document and every <iframe> nested within it, unless those frames include an allow, which sets a new feature policy for that frame and all frames nested within it. when using the allow attribute on an <iframe> to specify a feature policy for that frame and its nested frames, you can also specify the value 'src' to allow autoplay of media only from the same domain as that specified by the frame's src attribute. example: ...
...ature policy for that frame and its nested frames, you can also specify the value 'src' to allow autoplay of media only from the same domain as that specified by the frame's src attribute. example: allowing autoplay only from the document's domain to use the feature-policy header to only allow media to autoplay from the document's origin: feature-policy: autoplay 'self' to do the same for an <iframe>: <iframe src="mediaplayer.html" allow="autoplay 'src'"> </iframe> example: allowing autoplay and fullscreen mode adding fullscreen api permission to the previous example results in a feature-policy header like the following if fullscreen access is allowed regardless of the domain; a domain restriction can be added as well as needed. feature-policy: autoplay 'self'; fullscreen the s...
...And 6 more matches

Index - Archive of obsolete content
ke asynchronous programming easier. 81 dev/panel enables you to extend the firefox developer tools. 82 event/core the event/core module allows the creation of apis to broadcast and subscribe to events. 83 event/target create objects that broadcast events. 84 frame/hidden-frame creates firefox frames (i.e. xul <iframe> elements) that are not displayed to the user. 85 frame/utils provides helper functions for working with platform internals like frames and browsers. 86 fs/path provides access to the local filesystem with the nodejs path module api. 87 io/byte-streams provides streams for reading and writing bytes. 88 io/file ...
... used in unit tests. 116 test/runner sets up unit tests. 117 test/utils helper methods used in the commonjs unit testing suite. 118 ui/button/action add a button to the firefox user interface. 119 ui/button/toggle add a toggle button to the firefox user interface. 120 ui/frame create html iframes, using bundled html, css and javascript, that can be added to a designated area of the firefox user interface. 121 ui/id create ui component ids. 122 ui/sidebar enables you to create sidebars. 123 ui/toolbar add a toolbar to the firefox user interface. 124 util/array helper functions for working with arrays.
...ce no summary! 892 homepage xul attributes, xul reference no summary! 893 href xul attributes, xul reference no summary! 894 icon xul attributes, xul reference no summary! 895 iconsize toolbar, xul, xul attribute no summary! 896 id xul attributes, xul reference no summary! 897 iframe.transparent no summary! 898 ignoreblurwhilesearching xul attributes, xul reference no summary! 899 ignorecase xul attributes, xul reference no summary! 900 ignoreincolumnpicker xul attributes, xul reference no summary! 901 ignorekeys xul attributes, xul reference no summary! 902 image xul...
...And 5 more matches

Using IndexedDB - Web APIs
e the situation where already opened apps may initiate code leading to a new attempt to open the database, but using an outdated version. security indexeddb uses the same-origin principle, which means that it ties the store to the origin of the site that creates it (typically, this is the site domain or subdomain), so it cannot be accessed by any other origin. third party window content (e.g. ...
...order-radius: 0.3em; display: inline-block; margin-bottom: 0.5em; padding: 1em; } table { border-collapse: collapse; } input { padding: 0.3em; border-color: #cccccc; border-radius: 0.3em; } .required:after { content: "*"; color: red; } .button-pane { margin-top: 1em; } #pub-viewer { float: right; width: 48%; height: 20em; border: solid #d092ff 0.1em; } #pub-viewer iframe { width: 100%; height: 100%; } #pub-list { width: 46%; background-color: #eeeeee; border-radius: 0.3em; } #pub-list li { padding-top: 0.5em; padding-bottom: 0.5em; padding-right: 0.5em; } #msg { margin-bottom: 1em; } .action-success { padding: 0.5em; color: #00d21e; background-color: #eeeeee; border-radius: 0.2em; } .action-failure { padding: 0.5em; color: #ff140...
... // thus the count text below will be displayed before the actual pub list // (not that it is algorithmically important in this case). ...
...And 5 more matches

MessageChannel - Web APIs
workers. properties messagechannel.port1 read only returns port1 of the channel. messagechannel.port2 read only returns port2 of the channel. constructor messagechannel() returns a new messagechannel object with two new messageport objects. example in the following example, you can see a new channel being created using the messagechannel.messagechannel constructor. ...
... returns port2 of the channel. constructor messagechannel() returns a new messagechannel object with two new messageport objects. example in the following example, you can see a new channel being created using the messagechannel.messagechannel constructor. when the iframe has loaded, we register an onmessage handler for messagechannel.port1 and transfer messagechannel.port2 to the iframe using the window.postmessage method along with a message. ...
...th two new messageport objects. example in the following example, you can see a new channel being created using the messagechannel.messagechannel constructor. when the iframe has loaded, we register an onmessage handler for messagechannel.port1 and transfer messagechannel.port2 to the iframe using the window.postmessage method along with a message. when a message is received back from the iframe, the onmessage function simply outputs the message to a paragraph. ...
...And 5 more matches

MessagePort - Web APIs
eserialized. events message fired when a messageport object receives a message. also available via the onmessage property. messageerror fired when a messageport object receives a message that can't be deserialized. also available via the onmessageerror property. example in the following example, you can see a new channel being created using the messagechannel() constructor. ...
...e property. messageerror fired when a messageport object receives a message that can't be deserialized. also available via the onmessageerror property. example in the following example, you can see a new channel being created using the messagechannel() constructor. when the iframe has loaded, we register an onmessage handler for messagechannel.port1 and transfer messagechannel.port2 to the iframe using the window.postmessage method along with a message. ...
...also available via the onmessageerror property. example in the following example, you can see a new channel being created using the messagechannel() constructor. when the iframe has loaded, we register an onmessage handler for messagechannel.port1 and transfer messagechannel.port2 to the iframe using the window.postmessage method along with a message. when a message is received back from the iframe, the onmessage function simply outputs the message to a paragraph. ...
...And 5 more matches

Content Panels - Archive of obsolete content
elements such the back and next buttons are the same throughout the interface. it would be much better if just the content area of the wizard changed. third, it would be difficult to co-ordinate scripts when running in different windows. note that xul does have a wizard element which may be used to create wizard interfaces. this will be described in a later section. another approach is to use the iframe element, which works much like the html element of the same name. it creates a separate document within the window. it has the advantage that it can be placed anywhere and the contents can be loaded from a different file. set the url to appear in the frame with the src attribute. this url may point to any kind of file, although it will usually point to an html file or another xul file. you can us...
...element of the same name. it creates a separate document within the window. it has the advantage that it can be placed anywhere and the contents can be loaded from a different file. set the url to appear in the frame with the src attribute. this url may point to any kind of file, although it will usually point to an html file or another xul file. ...
...ontents can be loaded from a different file. set the url to appear in the frame with the src attribute. this url may point to any kind of file, although it will usually point to an html file or another xul file. you can use a script to change the contents of the iframe without affecting the main window. in the mozilla browser window, the area where the web page is displayed is created by using an iframe. when the user enters a url or clicks on a link in a document, the source of the frame is changed. ...
...And 4 more matches

Using the Editor from XUL - Archive of obsolete content
editor creation so let's trace through the process of editor creation when bringing up the composer window. ...
... editor creation so let's trace through the process of editor creation when bringing up the composer window. ...
... editor creation so let's trace through the process of editor creation when bringing up the composer window. ...
...And 4 more matches

Storage access policy: Block cookies from trackers
origin as described in this section. currently, firefox includes some web compatibility heuristics that grant storage access to third-party resources classified as trackers when a user interacts with those third parties. we do this when we expect that not granting access would cause the web page to break. we also support an initial implementation of the storage access api, through which embedded <iframe>s can request storage access by calling document.requeststorageaccess(). although both of these approaches provide the same level of storage access, we recommend third parties switch to using the storage access api in order to guarantee their access to storage. automatic storage access upon interaction in order to improve web compatibility, firefox currently includes some heuristics to grant st...
...anted access on example.com it would be able to access its storage on bar.foo.example.com, foo.example.com, and example.com. when storage access is granted to tracker.example on example.com, all resources loaded from tracker.example on any top-level document loaded from example.com are immediately given storage access. ...
...access its storage on bar.foo.example.com, foo.example.com, and example.com. when storage access is granted to tracker.example on example.com, all resources loaded from tracker.example on any top-level document loaded from example.com are immediately given storage access. this includes all resources loaded in the main context of the page, embedded <iframe>s, and resources loaded within embedded <iframe>s. ...
...And 4 more matches

Index
ptable, xpcom, xpcom api reference, xpcom interface reference the console service is the back-end for the error console, bundled with every mozilla application, and for firefox's web console and browser console. 432 nsicontainerboxobject interfaces, interfaces:scriptable, needscontent, xpcom, xpcom interface reference the boxobject belonging to a xul browser, editor or iframe element implements this interface. 433 nsicontentframemessagemanager interface reference, interfaces:scriptable, xpcom, xpcom interface reference this interface provides the environment for scripts that are loaded into content frames using the nsiframescriptloader interface. it enables these scripts to receive messages from the chrome process and send messages back to the chr...
...1 nsicontentview electrolysis, interfaces, interfaces:scriptable, mobile, xpcom interface reference see working with content views for details on how to use this api. 442 nsicontentviewmanager electrolysis, interfaces, interfaces:scriptable, mobile, xpcom interface reference to obtain a reference to the view manager for a document, you can queryinterface() the nsiframeloader object to nsicontentviewmanager. see getting access to content views for details. once you have the view manager, you can call getcontentviewsin() to get a list of the content views for a given portion of the browser display, then use those nsicontentview objects to manipulate the content views. 443 nsicontentviewer interfaces, interfaces:scriptable, needscontent, reference, ...
...h also implements nsitreeview so that it can be passed as a tree view. 662 nsifocusmanager interfaces, interfaces:scriptable, needscontent implemented by: @mozilla.org/focus-manager;1 as a service: 663 nsiformhistory2 interfaces, interfaces:scriptable, needscontent, xpcom interface reference adds a name and value pair to the form history. ...
...And 4 more matches

Window.pageYOffset - Web APIs
s. nunc gravida, sem sit amet lobortis iaculis, dolor ligula convallis nibh, id condimentum metus libero nec odio. quisque nec ante pretium, viverra neque nec, facilisis risus. duis condimentum sapien non felis cursus blandit. ...
...").contentdocument .body.innerhtml = contenthtml; in this example, an <iframe> is created and filled with content, then a specific element within the document is scrolled into view in the frame. once that's done, the vertical scroll position is checked by looking at the value of pageyoffset in the frame's contentwindow. html the html is extremely simple and has just two elements: an <iframe> that contains the document we're going to scroll, and a <div> into which we'll output the value of pageyoffset when we've finished the scroll. ...
...hin the document is scrolled into view in the frame. once that's done, the vertical scroll position is checked by looking at the value of pageyoffset in the frame's contentwindow. html the html is extremely simple and has just two elements: an <iframe> that contains the document we're going to scroll, and a <div> into which we'll output the value of pageyoffset when we've finished the scroll. ...
...And 4 more matches

Rich-Text Editing in Mozilla - Developer guides
editors. starting in firefox 3, mozilla also supports internet explorer's contenteditable attribute which allows any element to become editable or non-editable (the latter for when preventing change to fixed elements in an editable environment). setting up rich-text editing rich-text editing is initialized by setting the designmode property of a document to "on", such as the document inside an iframe. once designmode has been set to "on", the document becomes a rich-text editing area and the user can type into it as if it were a textarea. the most basic keyboard commands such as copy and paste are available, all others need to be implemented by the website. similarly, setting contenteditable to "true" allows you to make individual elements of a document editable. executing commands when an...
... devedge provides a javascript helper class, xbdesignmode, which is a wrapper for the designmode feature which hides the differences between ie and mozilla. event handling disabled a further difference for mozilla is that onc...
...yle="font-weight: bold; font-style: italic; text-decoration: underline;">dinosaurs are big.</span> internet explorer: <strong>i love geckos.</strong> <strong><em><u>dinosaurs are big.</u></em></strong> another difference between mozilla and ie is how to access the document object of an iframe, which is usually used in conjunction with designmode. mozilla uses the w3c standard way, namely iframeelement.contentdocument, while ie requires iframeelement.document. devedge provides a javascript helper class, xbdesignmode, which is a wrapper for the designmode feature which hides the differences between ie and mozilla. event handling disabled a further difference for mozilla is that once a document is switched to designmode, all events on that particular document are disabled. once design...
...And 4 more matches

Splitters - Archive of obsolete content
e attribute, you should also add a grippy element inside the splitter which the user can use to collapse the element. the width and height attributes of the elements next the splitter are adjusted when the splitter is dragged. the exact element depends on the resizebefore and resizeafter attributes. ...
...utes of the elements next the splitter are adjusted when the splitter is dragged. the exact element depends on the resizebefore and resizeafter attributes. splitter example an example would be helpful here: example 1 : source view <hbox flex="1"> <iframe id="content-1" width="60" height="20" src="w1.html"/> <splitter collapse="before" resizeafter="farthest"> <grippy/> </splitter> <iframe id="content-2" width="60" height="20" src="w2.html"/> <iframe id="content-3" width="60" height="20" src="w3.html"/> <iframe id="content-4" width="60" height="20" src="w4.html"/> </hbox> here, four iframes have been created and a splitter has been placed in-between the first and second one. the collapse has been set to a value of before, meaning that if the splitter grippy is clicked on, t...
...litter in a collapsed state. this image shows the 4 panels with the splitter resized to the right. notice how the middle two panels have not changed size. only panel 1 and panel 4 have changed size. you can just see part of the fourth panel. if you continue to drag the splitter to the right, the other two panels will shrink. you can use the style properties such as min-width, max-height on the iframes to specify minimum or maximum widths or heights in the box. if you do, the splitter will detect this and not allow the user to drag the splitter past the minimum and maximum sizes. for example, if you specified a minimum width of 30 pixels on panel 4 above, it would not shrink below that size. the other two panels would have to shrink. if you set the minimum width of panel 1 to 50 pixels, you w...
...And 3 more matches

Index - Learn web development
tour would be boring and confusing at this stage, and we just wanted to give you an idea of the most common things you'll find in there for now! in the next article we'll be looking at html text fundamentals. 243 multimedia and embedding assessment, audio, beginner, codingscripting, embedding, flash, guide, html, images, landing, learn, multimedia, svg, vector graphics, video, web, iframes, imagemaps, img, responsive we've looked at a lot of text so far in this course, but the web would be really boring only using text. let's start looking at how to make the web come alive with more interesting content! this module explores how to use html to include multimedia in your web pages, including the different ways that images can be included, and how to embed video, audio, and eve...
...let's start looking at how to make the web come alive with more interesting content! this module explores how to use html to include multimedia in your web pages, including the different ways that images can be included, and how to embed video, audio, and even entire webpages. 244 adding vector graphics to the web beginner, graphics, guide, html, images, learn, raster, svg, vector, iframe, img this article has provided you with a quick tour of what vector graphics and svg are, why they are useful to know about, and how to include svg inside your webpages. it was never intended to be a full guide to learning svg, just a pointer so you know what svg is if you meet it in your travels around the web. so don't worry if you don't feel like you are an svg expert yet. we've included...
... about, and how to include svg inside your webpages. it was never intended to be a full guide to learning svg, just a pointer so you know what svg is if you meet it in your travels around the web. so don't worry if you don't feel like you are an svg expert yet. we've included some links below that might help you if you wish to go and find out more about how it works. ...
...And 3 more matches

mozbrowseropenwindow
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. ...
...b: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowseropenwindow event is fired when a new window is required — usually when the content of a browser <iframe> successfully calls the window.open() method, or the user clicks on a link with an unknown target. the embedder must use the <iframe> passed in the event.details.frameelement property as the new window content. ...
... bubbles read only boolean whether the event normally bubbles or not. ...
...And 3 more matches

Using the Screen Capture API - Web APIs
roduct looks like this. if your browser supports screen capture api, clicking "start capture" will present the user agent's interface for selecting a screen, window, or tab to share. security in order to function when feature policy is enabled, you will need the display-capture permission. ...
...ike this. if your browser supports screen capture api, clicking "start capture" will present the user agent's interface for selecting a screen, window, or tab to share. security in order to function when feature policy is enabled, you will need the display-capture permission. ...
...indow, or tab to share. security in order to function when feature policy is enabled, you will need the display-capture permission. this can be done using the feature-policy http header or—if you're using the screen capture api in an <iframe>, the <iframe> element's allow attribute. ...
...And 3 more matches

Feature-Policy: fullscreen - HTTP
s policy is enabled, the returned promise rejects with a typeerror. by default, top-level documents and their same-origin child frames can request and enter fullscreen mode. this directive allows or prevents cross-origin frames from using fullscreen mode. this includes same-origin frames. if both this directive (i.e. via the allow attribute) and the allowfullscreen attribute are present on an <iframe> element, this directive takes precedence. there was a bug whereby the fullscreen directive didn't work unless the allowfullscreen attribute was also present, but this has been fixed as of firefox 80 (bug 1608358). syntax feature-policy: fullscreen <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the featu...
... fullscreen directive didn't work unless the allowfullscreen attribute was also present, but this has been fixed as of firefox 80 (bug 1608358). syntax feature-policy: fullscreen <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default value is 'self'. examples general example securecorp inc. wants to d...
...And 3 more matches

Cross-domain Content Scripts - Archive of obsolete content
by default, content scripts don't have any cross-domain privileges. in particular, they can't: access content hosted in an iframe, if that content is served from a different domain make cross-domain xmlhttprequests however, you can enable these features for specific domains by adding them to your add-on's package.json under the "cross-domain-content" key, which itself lives under the "permissions" key: "permissions": { "cross-domain-content": ["http://example.org/", "http://example.com/"] } the domains listed must include the scheme and fully qualified domain name, and these must exactly match the domains serving the content - so in the example above, the content script will not be allowed to access content served from https://example.com/. wildcards are not allowed. this featu...
... the scheme and fully qualified domain name, and these must exactly match the domains serving the content - so in the example above, the content script will not be allowed to access content served from https://example.com/. wildcards are not allowed. this feature is currently only available for content scripts, not for page scripts included in html files shipped with your add-on. cross-domain iframes the following "main.js" creates a page-worker which loads a local html file called "page.html", attaches a content script called "page.js" to the page, waits for messages from the script, and logs the payload. //main.js var data = require("sdk/self").data; var pageworker = require("sdk/page-worker").page({ contenturl: data.url("page.html"), contentscriptfile: data.url("page-script.js") })...
... content script called "page.js" to the page, waits for messages from the script, and logs the payload. ...
...And 2 more matches

Migrate apps from Internet Explorer to Mozilla - Archive of obsolete content
f no w3c equivalent exists. mozilla 1.3 introduced an implementation of internet explorer's designmode feature, which turns an html document into a rich text editor field. once turned into the editor, commands can run on the document through the execcommand command. mozilla also supports internet explorer's contenteditable attribute for making any widget editable. ...
...eature, which turns an html document into a rich text editor field. once turned into the editor, commands can run on the document through the execcommand command. mozilla also supports internet explorer's contenteditable attribute for making any widget editable. alternatively, you could use an iframe to add a rich text editor. ...
...ent into a rich text editor field. once turned into the editor, commands can run on the document through the execcommand command. mozilla also supports internet explorer's contenteditable attribute for making any widget editable. alternatively, you could use an iframe to add a rich text editor. ...
...And 2 more matches

Index - Archive of obsolete content
ce no summary! 145 homepage xul attributes, xul reference no summary! 146 href xul attributes, xul reference no summary! 147 icon xul attributes, xul reference no summary! 148 iconsize toolbar, xul, xul attribute no summary! 149 id xul attributes, xul reference no summary! 150 iframe.transparent no summary! 151 ignoreblurwhilesearching xul attributes, xul reference no summary! 152 ignorecase xul attributes, xul reference no summary! 153 ignoreincolumnpicker xul attributes, xul reference no summary! 154 ignorekeys xul attributes, xul reference no summary! 155 image xul...
...rsion your code is running on. 968 using spell checking in xul add-ons, extensions spell checking functionality is available starting in firefox 2. this document describes how to use the mozispellcheckingengine component to add spell checking capabilities to your firefox extension. 969 using the editor from xul xul the editor in xul lives on top of a xul <iframe> element; it observes document loading in this <iframe>, and, when document loading is complete, it instantiates an editor on the loaded document. the <iframe> contents are then editable. 970 using the standard theme add-ons, extensions, themes no summary! 971 widget cheatsheet see the periodic table of xul for more examples. 972 window icons ...
...e sent to the observers when a change is made. 1099 broadcasterset xul elements, xul reference a container element for broadcaster elements. the broadcasterset and its descendants are not displayed. 1100 browser xul elements, xul reference a xul <browser> element represents a frame which is expected to contain a view of a web document. it is similar to an iframe except that it holds a page history and contains additional methods to manipulate the currently displayed page.type: one of the values below.the type of browser, which can be used to set access of the document loaded inside the browser. 1101 button xul elements, xul reference a button that can be pressed by the user. event handlers can be used to trap mouse, keyboard and othe...
...And 2 more matches

xbDesignMode.js - Archive of obsolete content
l code is * netscape communications corporation. * portions created by the initial developer are copyright (c) 2003 * the initial developer. all rights reserved. ...
... * portions created by the initial developer are copyright (c) 2003 * the initial developer. all rights reserved. ...
...l developer. all rights reserved. ...
...And 2 more matches

Gecko info for Windows accessibility vendors
he current document into a buffer in their own process. the content window always has the class mozillacontentwindowclass. in total, gecko supports the following window classes: mozillauiwindowclass - root ui window, at the root of the window hierarchy mozillacontentwindowclass -- root document window mozillacontentframewindowclass - root of a subdocument created by a <frame> or <iframe> element mozillahiddenwindowclass - ignore these windows, they are used to help manage other windows mozillawindowclass - general filler window, a catch all starting in firefox 2, however, you should begin switching your code to use navrelation_embeds. going forward, this may be the only way to efficiently find the content area, as mozilla will begin to become a windowless applicatio...
... vt_bstr. if it is, than variant.bstrval contains the role string. the role string may be an html tag name followed by comma, space and the namespace of the current element. in most current cases the namespace can be ignored, but it may become important in the future. the following html tags are exposed as bstr's: abbr, acronym, blockquote, dd, dl, dt, form, frame, h1, h2, h3, h4, h5, h6, iframe, q, tbody, tfoot, thead in addition, an html list uses the bullet bstr role to expose bullets and numbers that are automatically inserted into the formatting by gecko. in addition, role_list with state_readonly and role_listitem are used to expose the list structure. this makes it important to check the state_readonly flag when encountering a role_list, because the html list form element als...
...for...
...And 2 more matches

mozbrowsercaretstatechanged
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. ...
...arge incompatibilities between implementations and the behavior may change in the future. the mozbrowsercaretstatechanged event is fired when the user selects content in a page loaded in a browser <iframe>. this is used by the embedder to show a context menu for clipboard actions. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read ...
...ing rectangle, in css pixels. top: the top position of the bounding rectangle, in css pixels. bottom: the bottom position of the bounding rectangle, in css pixels. left: the left position of the bounding rectangle, in css pixels. right: the right position of the bounding rectangle, in css pixels. commands an object that defines what commands can currently be executed in the browser <iframe>. its properties are canselectall: a boolean indicating whether the selectall command is available (true) or not (false.) cancut: a boolean indicating whether the cut command is available (true) or not (false.) cancopy: a boolean indicating whether the copy command is available (true) or not (false.) canpaste: a boolean indicating whether the paste command is available (true) or not (fa...
...And 2 more matches

mozbrowserloadend
non-standard this feature is not on a current w3c standards track, but it is supported on the firefox os platform. although implementations may change in the future and it is not supported widely across browsers, it is suitable for use in code dedicated to firefox os apps. the mozbrowserloadend event is fired when the browser <iframe> has finished loading all its assets, or has failed to load. ...
... bubbles read only boolean whether the event normally bubbles or not. ...
... bubbles read only boolean whether the event normally bubbles or not. ...
...And 2 more matches

mozbrowserscrollareachanged
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserscrollareachanged event is fired when the available scrolling area in the browser <iframe> changes. ...
...compatibilities between implementations and the behavior may change in the future. the mozbrowserscrollareachanged event is fired when the available scrolling area in the browser <iframe> changes. this can occur on resize and when the page size changes (while loading for example.) general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read ...
... bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. ...
...And 2 more matches

DevTools API - Firefox Developer Tools
e has been unregistered. the parameter is a themedefinition object. toolbox-ready(toolbox) a new toolbox has been created and is ready to use. the parameter is a toolbox object instance. toolbox-destroy(target) the toolbox for the specified target is about to be destroyed. toolbox-destoyed(target) the toolbox for the specified target has been destroyed. {toolid}-init(toolbox, iframe) a tool with the given id has began to load in the given toolbox to the given frame. {toolid}-build(toolbox, panel) a tool with the given id has began to initialize in the given toolbox. the panel is the object returned by the tooldefinition.build() method. {toolid}-ready(toolbox, panel) a tool with the given id has finished its initialization and is ready to be used. the panel is ...
...oolbox is destroyed. events the toolbox object emits following events via the eventemitter interface. host-changed the host for this toolbox has changed. ready the toolbox is ready to use. select(toolid) a tool has been selected. this event is emitted before the corresponding {toolid}-selected event. {toolid}-init(frame) a tool is about to be loaded. the frame is the <iframe> element that has been created for the tool. {toolid}-build(panel) the frame for a tool has loaded and the toolpanel.build() method has been called but the asynchronous initialization has not started. the parameter is a toolpanel object. {toolid}-ready(panel) the asynchronous initialization for a tool has completed and it is ready to be used. the parameter is a toolpanel object. {t...
...etwork monitor initialized to toolbox", toolbox); }); toolsidebar to build a sidebar in your tool, first, add a xul:tabbox where you want the sidebar to live: <splitter class="devtools-side-splitter"/> <tabbox id="mytool-sidebar" class="devtools-sidebar-tabs" hidden="true"> <tabs/> <tabpanels flex="1"/> </tabbox> a sidebar is composed of tabs. each tab will hold an iframe. for example, in the inspector, there are 3 tabs (computed view, rule view, layout view). the user can select the tab he wants to see. if the availability of the tabs depends on some tool-related conditions, we might want to not let the user select a tab. this api provides methods to hide the tabstripe. for example, in the web console, there are 2 views (network view and object view). these v...
...And 2 more matches

MediaDevices.getUserMedia() - Web APIs
a(). a secure context is, in short, a page loaded using https or the file:/// url scheme, or a page loaded from localhost. in addition, user permission is always required to access the user's audio and video inputs. only a window's top-level document context for a valid origin can even request permission to use getusermedia(), unless the top-level context expressly grants permission for a given <iframe> to do so using feature policy. otherwise, the user will never even be asked for permission to use the input devices. for additional details on these requirements and rules, how they are reflected in the context in which your code is running, and about how browsers manage user privacy and security issues, read on. user privacy as an api that may involve significant privacy concerns, getusermed...
...ure policy security management feature of http is in the process of being introduced into browsers, with support available to some extent in many browsers (though not always enabled by default, as in firefox). getusermedia() is one method which will require the use of feature policy, and your code needs to be prepared to deal with this. ...
... prepared to deal with this. for example, you may need to use the allow attribute on any <iframe> that uses getusermedia(), and pages that use getusermedia() will eventually need to supply the feature-policy header. the two permissions that apply to getusermedia() are camera and microphone. ...
...And 2 more matches

Viewport concepts - CSS: Cascading Style Sheets
ottom of the layout viewport into view, displaying the sticky footer, which will then stay stuck at the bottom. the visual viewport is the visual portion of a screen not including on-screen keyboards, areas outside of a pinch-zoom area, or other feature that doesn't scale with the dimensions of a page. the visual viewport is the same size as the layout viewport or smaller. for a page containing iframes, objects, or external svg, both the containing pages and each included file has their own unique window object. only the top-level window has a visual viewport that may be distinct from the layout viewport. for included documents, the visual viewport and layout viewport are the same. css the layout viewport and visual viewport described above are not the only viewports you will encounter. any ...
...wport that is fully or partially displayed within the layout viewport is considered a visual viewport. we generally think of width and height media queries as being relative to the width and height of the browser window. ...
... height of the browser window. they are actually relative to the viewport, which is the window in the main document but is the intrinsic size of the element's parent in a nested browsing context like objects, iframes and svg. in css, we also have length units based on the viewport size. a vh unit is 1% of the layout viewport's height. similarly, the vw unit is 1% of the layout viewport's width. <iframe> inside an iframe, the visual viewport is the size of the inner width and height of the iframe, rather than the parent document. ...
...And 2 more matches

Feature-Policy: geolocation - HTTP
ir same-origin child frames. this directive allows or prevents cross-origin frames from accessing geolocation. this includes same-origin frames. syntax feature-policy: geolocation <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. the default value is 'self'. examples general example securecorp inc. wants to disable the geoloca...
... and nested browsing contexts. the default value is 'self'. examples general example securecorp inc. wants to disable the geolocation api within all browsing contexts except for its own origin and those whose origin is https://example.com. ...
...And 2 more matches

Feature-Policy - HTTP
this header is still in an experimental state, and is subject to change at any time. be wary of this when implementing it on your website. the header has now been renamed to permissions-policy in the spec, and this article will eventually be updated to reflect that change. for more information, see the main feature policy article. ...
...yes syntax feature-policy: <directive> <allowlist> <directive> the feature policy directive to apply the allowlist to. see directives below for a list of the permitted directive names. <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. directives accelerometer controls whether the current document is allowed to gather information...
...And 2 more matches

Index - HTTP
nt-security-policy (csp) block-all-mixed-content directive prevents loading any assets using http when the page is loaded using https. 31 csp: child-src csp, directive, http, reference, security the deprecated http content-security-policy (csp) child-src directive defines the valid sources for web workers and nested browsing contexts loaded using elements such as <frame> and <iframe>. for workers, non-compliant requests are treated as fatal network errors by the user agent. 32 csp: connect-src csp, directive, http, reference, security the http content-security-policy (csp) connect-src directive restricts the urls which can be loaded using script interfaces. the apis that are restricted are: 33 csp: default-src csp, directive, http, referen...
... csp, directive, http, security the http content-security-policy (csp) form-action directive restricts the urls which can be used as the target of a form submissions from a given context. 36 csp: frame-ancestors csp, directive, http, security the http content-security-policy (csp) frame-ancestors directive specifies valid parents that may embed a page using <frame>, <iframe>, <object>, <embed>, or <applet>. 37 csp: frame-src csp, directive, http, reference, security the http content-security-policy (csp) frame-src directive specifies valid sources for nested browsing contexts loading using elements such as <frame> and <iframe>. 38 csp: img-src csp, directive, http, reference, security the http content-security-policy img-src...
...or csp, directive, http, reference, security the http content-security-policy require-sri-for directive instructs the client to require the use of subresource integrity for scripts or styles on the page. 46 csp: sandbox csp, directive, http, security the http content-security-policy (csp) sandbox directive enables a sandbox for the requested resource similar to the <iframe> sandbox attribute. it applies restrictions to a page's actions including preventing popups, preventing the execution of plugins and scripts, and enforcing a same-origin policy. 47 csp: script-src csp, directive, http, reference, security the http content-security-policy (csp) script-src directive specifies valid sources for javascript. this includes not only urls loaded dire...
...And 2 more matches

HTTP Index - HTTP
-content directive prevents loading any assets using http when the page is loaded using https. 79 csp: child-src csp, child, content-security-policy, directive, http, reference, security, child-src, source the http content-security-policy (csp) child-src directive defines the valid sources for web workers and nested browsing contexts loaded using elements such as <frame> and <iframe>. for workers, non-compliant requests are treated as fatal network errors by the user agent. 80 csp: connect-src csp, content-security-policy, directive, http, reference, security, connect-src, source the http content-security-policy (csp) connect-src directive restricts the urls which can be loaded using script interfaces. the apis that are restricted are: 81 csp:...
...curity-policy (csp) form-action directive restricts the urls which can be used as the target of a form submissions from a given context. 84 csp: frame-ancestors ancestors, csp, content-security-policy, directive, frame, http, security, frame-ancestors the http content-security-policy (csp) frame-ancestors directive specifies valid parents that may embed a page using <frame>, <iframe>, <object>, <embed>, or <applet>. 85 csp: frame-src csp, content-security-policy, directive, frame, http, reference, security, frame-src, source the http content-security-policy (csp) frame-src directive specifies valid sources for nested browsing contexts loading using elements such as <frame> and <iframe>. 86 csp: img-src csp, content-security-policy, directi...
...uire-sri-for the http content-security-policy require-sri-for directive instructs the client to require the use of subresource integrity for scripts or styles on the page. 97 csp: sandbox csp, content-security-policy, directive, http, sandbox, security the http content-security-policy (csp) sandbox directive enables a sandbox for the requested resource similar to the <iframe> sandbox attribute. it applies restrictions to a page's actions including preventing popups, preventing the execution of plugins and scripts, and enforcing a same-origin policy. 98 csp: script-src csp, content, content-security-policy, directive, http, reference, script, security, script-src, source the http content-security-policy (csp) script-src directive specifies valid s...
...And 2 more matches

Privacy, permissions, and information security
content security policy provides the ability to define the extent to which a document's content can be accessed by other devices over the web; used in particular to prevent or mitigate attacks on the server feature policy lets web developers selectively enable, disable, and modify the behavior of certain features and apis both for a document and for subdocuments loaded in <iframe>s <iframe>'s allow attribute technically part of feature policy, the allow attribute on an <iframe> specifies which web features the document in the frame should be allowed to access http public key pinning (hpkp) hpkp is used by servers to instruct a client to associate a specific public key with the server going forward in order to decrease the likelihood of man-in-the-m...
... transport layer security (tls); formerly known as secure sockets layer (ssl) tls provides security and privacy by encrypting data during transport over the network. ...
...y used within code; notably, the permissions api, feature policy, and the allow attribute on <iframe> elements are primary tools directly used by code to help secure a site and its content. keeping personal data safe managing site permissions bringing it all together <using feature policy with permissions and so forth; how to use them together, how they interact, etc> permission requests in <iframe> elements things can get tricky when your web app uses the <iframe> element to embed content from another site inside your own, especially if the document you load into the frame has its own permission needs to consider. while specifications for these technologies either state or recommend tactics for handling situations like this, browsers may offer different solutions to improve security even...
...And 2 more matches

page-mod - Archive of obsolete content
contentstyle lists stylesheets to attach, supplied as strings. contentstylefile lists stylesheets to attach, supplied in separate files. contentscriptoptions defines read-only values accessible to content scripts. attachto controls whether to attach scripts to tabs that were already open when the page-mod was created, and whether to attach scripts to iframes as well as the topmost document. contentscriptwhen controls the point during document load at which content scripts are attached. exclude has the same syntax as include, but specifies the urls to which content scripts should not be attached, even if they match include: so it's a way of excluding a subset of the urls that include specifies. the exclude option is new i...
...ose specified by the contentstylefile option. name: attachto type: string,array if this option is not specified, content scripts: are not attached to any tabs that are already open when the page-mod is created. ...
...ment that satisfies the rule includes ten iframes using a relative url, then your page-mod is applied eleven times. you can modify this behavior using the attachto option. it accepts the following values: "existing": the page-mod will be automatically applied on already opened tabs. "top": the page-mod will be applied to top-level tab documents "frame": the page-mod will be applied to all iframes inside tab documents if the option is set at all, you must set at least one of "top" and "frame". ...
...alues: "existing": the page-mod will be automatically applied on already opened tabs. "top": the page-mod will be applied to top-level tab documents "frame": the page-mod will be applied to all iframes inside tab documents if the option is set at all, you must set at least one of "top" and "frame". for example, the following page-mod will be attached to already opened tabs, but not to any iframes: var pagemod = require("sdk/page-mod"); pagemod.pagemod({ include: "*", contentscript: "", attachto: ["existing", "top"], onattach: function(worker) { console.log(worker.tab.url); } }); name: onattach type: function assign a listener function to this option to listen to the page-mod's attach event. see the documentation for attach and communic...

Interaction between privileged and non-privileged pages - Archive of obsolete content
can create security holes. a workaround is to treat the communication between webpage and chrome as a normal network protocol and use xml. with element attributes and e4x, this is fairly easy. you do need to convert your data to/from e4x objects, though. and your chrome needs to carefully check every value passed (you need to do that either way). ...
...s to treat the communication between webpage and chrome as a normal network protocol and use xml. with element attributes and e4x, this is fairly easy. you do need to convert your data to/from e4x objects, though. and your chrome needs to carefully check every value passed (you need to do that either way). ...
...tion between webpage and chrome as a normal network protocol and use xml. with element attributes and e4x, this is fairly easy. you do need to convert your data to/from e4x objects, though. and your chrome needs to carefully check every value passed (you need to do that either way). ...
...hrome as a normal network protocol and use xml. with element attributes and e4x, this is fairly easy. you do need to convert your data to/from e4x objects, though. and your chrome needs to carefully check every value passed (you need to do that either way). ...

Chapter 3: Introduction to XUL—How to build a more intuitive UI - Archive of obsolete content
des = gbrowser.mtabcontainer.childnodes; for (var i = 0; i < nodes.length; i++) alert(nodes[i].label); ]]></script> listing 18: embedding a script in xul note: although embedding javascript is permitted, it's generally encouraged that you instead place your javascript code in an external file. browser and tabbrowser xul allows you to use inline frames. ...
...label); ]]></script> listing 18: embedding a script in xul note: although embedding javascript is permitted, it's generally encouraged that you instead place your javascript code in an external file. browser and tabbrowser xul allows you to use inline frames. you can set the src attribute of an iframe element to the uri of another xul document or web page, and it will be displayed there. but iframes are rarely used in xul—in practice, the browser element is used more often. ...
...for building applications linked to external web pages, this is a more secure and more convenient approach. ...
...at uri will be opened by default. if the src attribute's value changes, you can dynamically open a different web page or xul document. functions like back, forward, reload can all be called using the goback(), goforward(), and reload() methods. using the stop() method stops loading the page currently in the process of being opened. access restrictions with frames defined using html's frame and iframe elements, it is possible for a child frame to access its parent and ancestor frames by getting the parent and top properties of window objects. for an application that can open any web page, this could give a script on a web page access to an xul document's frame, creating a dangerous opening for personal information to leak out. in the interests of security, you can enforce access restrictions ...

Style System Overview - Archive of obsolete content
rents (ugly when we have multiple frames per content node). there is one rule node on the path from the root rule node to the style context's rule node for each rule that the element matches. style context api the style context api allows data to be obtained through a set of structs (see nsstylestruct.h). a struct for a style context can be obtained through nsistylecontext::getstyledata. nsiframe::getstyledata does the same thing for the frame's mstylecontext member, and the global ::getstyledata is a typesafe helper that doesn't require the style struct id. this style struct is always const, and should always be declared as such (evil old-style casts often used with the non-typesafe forms sometimes hide this error), since the struct may be shared with other elements. the rule tree ...
...estroys and recreates style contexts for existing frames (rule node pointer immutable). reresolvestylecontext is messy because it needs to create and parent style contexts correctly (sibling sharing may not be the same) rather than just changing data. [design flaw, again] any specially-parented style contexts (not along frame parents, which need not be content parents) are reconstructed using nsiframe::getparentstylecontextframe. can return same style context due to sibling sharing unless we're destroying the rule tree for a style sheet/rule removal. dynamic changes to content reresolvestylecontext calculates differences (repaint, reflow, reframe, etc.) between style old and new style contexts and does appropriate cleanup it uses nsistylecontext::calcstyledifference, which only computes...
...ee for a style sheet/rule removal. dynamic changes to content reresolvestylecontext calculates differences (repaint, reflow, reframe, etc.) between style old and new style contexts and does appropriate cleanup it uses nsistylecontext::calcstyledifference, which only computes differences for structs that have been requested. (i'll call this the data-struct-based hint mechanism.) caller of nsiframemanager::computestylechangefor processes the change list, which has been built to avoid duplication. we also have reparentstylecontext, used in a few places (usually during frame construction), but it's broken (has many bugs that reresolvestylecontext used to have). dynamic changes to content: optimizations we optimize attribute changes by storing all the attributes that have an effect on wh...
...hashtable just for inline style rules so that we don't have to walk the whole tree to find the nodes. nscssframeconstructor::attributechanged only re-resolves style on the subtree of the element, just like other attribute changes. different hint mechanism (from rule structs, not data structs) could make attributechanged just go straight to a frame-change, instead. bugs due to failure to call nsiframe::didsetstylecontext. style sheet addition and removal handled in pres shell. presshell::reconstructstyledata calls framemanager::computestylechangefor (reresolve) and then processes the frame-change list. rebuilds rule tree if stylesheet was removed to avoid dangling pointers (and perhaps aliasing that would cause problems). otherwise we'd have to walk rule tree and compare each rule node ...

mozbrowserasyncscroll
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserasyncscroll event is fired when the content of a browser <iframe> is scrolled. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cance...
...ead only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: top the scroll top position in css pixels of the document within the browser <iframe>. left the scroll left position in css pixels of the document within the browser <iframe>. width the width in css pixels of the visible part of the document within the browser <iframe>. height the height in css pixels of the visible part of the document within the browser <iframe>. scrollwidth the total content width in css pixels of the document within the browser <iframe>. scrollheight...
... note: top + height may be larger than scrollheight. this indicates that the content is over-scrolled, which occurs when the page "rubber-bands" after being scrolled all the way to the bottom. similarly, left + width may be greater than scrollwidth, and both left and top may be negative. note: for performance reasons, this event is asynchronous. ...
...ing scrolled all the way to the bottom. similarly, left + width may be greater than scrollwidth, and both left and top may be negative. note: for performance reasons, this event is asynchronous. that means that the value retrieved through the event object can be different than the real current position of the scroll when the event is processed. ...

mozbrowserfindchange
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserfindchange event is fired when a search method is invoked in the browser <iframe> content. ...
...tandard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserfindchange event is fired when a search method is invoked in the browser <iframe> content. ...
... non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserfindchange event is fired when a search method is invoked in the browser <iframe> content. this includes htmliframeelement.findall(), htmliframeelement.findnext(), and htmliframeelement.clearmatch(). general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read...
...ng representing the string that is currently being searched for. searchlimit a number indicating the maximum number of searches that can be returned. numberofmatches a number indicating the number of matches returned by the search. activematchordinal a number indicating the position of the currently highlighted search result, e.g. 3 out of 5. ...

mozbrowserresize
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserresize event is fired when a browser <iframe> viewport is resized in some way. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. ...
...of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. ...
...not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: width a number representing the new width of the <iframe> viewport, in device pixels. height a number representing the new height of the <iframe> viewport, in device pixels. ...
... not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: width a number representing the new width of the <iframe> viewport, in device pixels. height a number representing the new height of the <iframe> viewport, in device pixels. ...

mozbrowserscroll
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserscroll event is fired when the browser <iframe> content scrolls. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable r...
... bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. ...
...is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: top a number representing the new vertical scroll position of the <iframe> viewport — in css pixels — from the top of the viewport. left a number representing the new horizontal scroll position of the <iframe> viewport — in css pixels — from the left of the viewport. ...
...eturns an anonymous javascript object with the following properties: top a number representing the new vertical scroll position of the <iframe> viewport — in css pixels — from the top of the viewport. left a number representing the new horizontal scroll position of the <iframe> viewport — in css pixels — from the left of the viewport. ...

mozbrowserusernameandpasswordrequired
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. ...
... bubbles read only boolean whether the event normally bubbles or not. ...
... bubbles read only boolean whether the event normally bubbles or not. ...
...proxy a boolean indicating whether the server dealing with the authentication is a proxy server (true) or not (false). authenticate() a function that is called to enable the authentication to go ahead. it needs to take two parameters — the username and password to authenticate. cancel() a function that is called to cancel the authentication. ...

Embedding the editor
ul application developers need to embed composer widgets in their xul applications, by using the <editor> tag as we do today. they should need to do as little work as possible to get basic editing functionality, be able to have any number of <editor>s per window, and control whether those <editor>s are in html or plain text mode. composer embedded in a native application in this application, the <iframe> on which the editor lives is embedded directly in the native application; this is equivalent to embedding the browser via nsiwebbrowser, but instead having an editable document. the composer chrome (toolbars etc) may be implemented by the embedder using native widgets, or using some amount of xul. that chrome needs to be configurable - dockable floating toolbars, toolbar shared between composer ...
...destroyed by the nseditorboxobject. the box object is a layout structure that is owned by content nodes, and survives frame destruction/recreation. the box object also has a reference to the docshell for the editor frame. xbl creates an nseditorboxobject for each <editor> tag, and allows javascript to access properties of this box object (such as the nsieditorshell). the <editor> tag is simply a <iframe> on which an editor is created; in all other respects, it behaves like a xul <iframe>. the problem with this ownership model is that there can be only one editor per <editor> tag, yet the document loaded in the <iframe> may itself contain multiple <iframe>s (consider a frameset document, or a document itself containing an <html:iframe>). currently, composer does not deal gracefully with such docu...
...tor in a xul application should be able to have multiple <editor>s per xul window should be able to embed an editable content frame in a native application embedders should be able to supply their own chrome (toolbars etc). meeting these objectives will also solve the following existing composer problems: composer should handle frameset documents composer should handle documents with <iframe>s. composer shouldn't rely on certain xul document structure proposed solutions fixing editor rooting as described above, editor rooting needs to be changed so that an editor lives on top of an nsdocshell, rather than hanging off the nseditorboxobject. there is a docshell for each editable <iframe>. this will involve: making a new interface, nsieditorframe, that is implemented by nsdocshell...
...ieditorframe should contain methods for getting the editing session, and doing some generic editor-related stuff (probably common to html and plain text editing). a subset of nsieditorshell will probably move into this interface. (this would be analogous to the nsiwebnavigation interface used for a browser.) when we have one editor per docshell, loading a frameset document, or a page with an <iframe> in composer, will instantiate more than one low-level editor. we need a concept of an "editing session" - a single top-level document which is editable, and which may embody more than one editor. this interface will be called nsi????. high-level ui and emebedding code should deal with this editing session interface, without knowledge of the underlying editors. the editing session will forward co...

Pointer Lock API - Web APIs
the ability to avoid this limitation, in the form of the att...
... animation = null; canvasdraw(); }); } } the canvasdraw() function draws the ball in the current x and y positions: function canvasdraw() { ctx.fillstyle = "black"; ctx.fillrect(0, 0, canvas.width, canvas.height); ctx.fillstyle = "#f00"; ctx.beginpath(); ctx.arc(x, y, radius, 0, degtorad(360), true); ctx.fill(); } iframe limitations pointer lock can only lock one iframe at a time. ...
...vasdraw(); }); } } the canvasdraw() function draws the ball in the current x and y positions: function canvasdraw() { ctx.fillstyle = "black"; ctx.fillrect(0, 0, canvas.width, canvas.height); ctx.fillstyle = "#f00"; ctx.beginpath(); ctx.arc(x, y, radius, 0, degtorad(360), true); ctx.fill(); } iframe limitations pointer lock can only lock one iframe at a time. ...
...w() function draws the ball in the current x and y positions: function canvasdraw() { ctx.fillstyle = "black"; ctx.fillrect(0, 0, canvas.width, canvas.height); ctx.fillstyle = "#f00"; ctx.beginpath(); ctx.arc(x, y, radius, 0, degtorad(360), true); ctx.fill(); } iframe limitations pointer lock can only lock one iframe at a time. if you lock one iframe, you cannot try to lock another iframe and transfer the target to it; pointer lock will error out. to avoid this limitation, first unlock the locked iframe, and then lock the other. while iframes work by default, "sandboxed" iframes block pointer lock. the ability to avoid this limitation, in the form of the attribute/value combination <iframe sandbox="allow-pointer-lock">, is expected to appear in chrome soon. specifications ...

Using the Storage Access API - Web APIs
ince embedded content won’t know which storage policy is in use by the user, it’s best to always check whether the embedded frame has storage access before attempting to read or write from storage. this is particularly true for document.cookie access, as browsers will often return an empty cookie jar when third-party cookies are blocked. ...
...use by the user, it’s best to always check whether the embedded frame has storage access before attempting to read or write from storage. this is particularly true for document.cookie access, as browsers will often return an empty cookie jar when third-party cookies are blocked. ...
...e from storage. this is particularly true for document.cookie access, as browsers will often return an empty cookie jar when third-party cookies are blocked. accessing a user's cookies in an embedded cross-origin iframe in this example we show how an embedded cross-origin <iframe> can access a user’s cookies under a storage access policy that blocks third-party cookies. ...
...ss a user’s cookies under a storage access policy that blocks third-party cookies. first of all, if the <iframe> is sandboxed, the embedding website needs to add the allow-storage-access-by-user-activation sandbox token to allow storage access requests to be successful, along with allow-scripts and allow-same-origin to allow it to call the api, and execute in an origin that can have cookies: <iframe sandbox="allow-storage-access-by-user-activation allow-scripts allow-same-origin"> ... </iframe> now on to the code executed inside the embedded document. since it does not know whether it currently has access to storage, it should first call document.hasstorageaccess(). if that call returns false, we can then call document.requeststorageaccess(), returning th...

Storage Access API - Web APIs
ces loaded from all embedded origins and possibly across all websites. the storage access api is intended to solve this problem; embedded cross-origin content can request unrestricted access to its first-party storage on a site-by-site basis via the document.requeststorageaccess() method, and check whether it already has access via the document.hasstorageaccess() method. ...
...addition, sandboxed <iframe>s cannot be granted storage access by default for security reasons. the api therefore also adds the allow-storage-access-by-user-activation sandbox token. the embedding website needs to add this to allow storage access requests to be successful, along with allow-scripts and allow-same-origin to allow it to call the api, and execute in an origin that can have cookies: <iframe sandbox="allow-storage-access-by-user-activation allow-scripts allow-same-origin"> ... </iframe> the api is designed to limit the potential storage exceptions to origins for which the user has shown an intent to interact. this is enforced through the following constraints: access requests are automatically denied unless the embedded content is currently pro...
...fox are summarized here: if the embedded origin tracker.example has already obtained first-party storage access on the top-level origin foo.example, and the user visits a page from foo.example embedding a page from tracker.example again in less than 30 days, the embedded origin will have storage access immediately when loading. if a page from top-level origin foo.example embeds more than one <iframe> from tracker.example, and one of those <iframe>s uses the storage access api in order to obtain storage access successfully, all other iframes from tracker.example on foo.example top-level origins will immediately gain storage access as well, without needing to call requeststorageaccess() separately. if an embedded page from tracker.example has previously successfully obtained storage access on...
...rty storage was granted, and rejects if access was denied. note: user interaction propagates to the promise returned by both of these methods, allowing the callers to take actions that require user interaction without requiring a second click from the user. for example, a caller could open a pop-up window from the resolved promise without triggering firefox’s pop-up blocker. extensions to <iframe> sandbox the <iframe> element's sandbox attribute has a new token, allow-storage-access-by-user-activation, which permits sandboxed <iframe>s to use the storage access api to request storage access. specifications the api is currently only at the proposal stage — the standardization process has yet to begin. you can currently find specification details of the api at apple's introducing stora...

Window.print() - Web APIs
t-data and send us a pull request. ...
...dals.edge full support 12firefox full support 1ie full support 5opera full support 6notes full support 6notes notes starting with opera 33, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.safari full support 1.1webview android full support 1notes full support 1notes notes starting with webview 46, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-moda...
... full support 1notes notes starting with webview 46, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.chrome android full support 18notes full support 18notes notes starting with chrome 46, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.firefox android no support nonotes no support nonotes notes see bug 1247609.opera android full support 10.1notes full support 10.1notes notes starting with oper...
...alue allow-modals.firefox android no support nonotes no support nonotes notes see bug 1247609.opera android full support 10.1notes full support 10.1notes notes starting with opera 33, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.safari ios full support 1samsung internet android full support 1.0notes full support 1.0notes notes starting with samsung internet 5.0, this method is blocked inside an <iframe> unless its sandbox attribute...

Window.prompt() - Web APIs
-data and send us a pull request. ...
...r for windows 8. it does not display a prompt to the user, and always returns undefined. it is not clear whether this is a bug or intended behavior. ...
...tarting with opera 33, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.safari full support 1webview android full support 1notes full support 1notes notes starting with webview 46, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.chrome android full support 18notes full support 18notes notes starting with chrome 46, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.firefox android full support ...
... chrome 46, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.firefox android full support 4opera android full support 10.1notes full support 10.1notes notes starting with opera 33, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.safari ios full support 1samsung internet android full support 1.0notes full support 1.0notes notes starting with samsung internet 5.0, this method is blocked inside an <iframe> unless its sandbox attribute...

aspect-ratio - CSS: Cascading Style Sheets
feature can be used to test the aspect ratio of the viewport. syntax the aspect-ratio feature is specified as a <ratio> value representing the width-to-height aspect ratio of the viewport. it is a range feature, meaning you can also use the prefixed min-aspect-ratio and max-aspect-ratio variants to query minimum and maximum values, respectively. examples the example below is contained in an <iframe>, which creates its own viewport. resize the <iframe> to see aspect-ratio in action. html <div id='inner'> watch this element as you resize your viewport's width and height. </div> css /* minimum aspect ratio */ @media (min-aspect-ratio: 8/5) { div { background: #9af; /* blue */ } } /* maximum aspect ratio */ @media (max-aspect-ratio: 3/2) { div { background: #9ff; /* cyan ...
...and height. ...
...um aspect ratio */ @media (min-aspect-ratio: 8/5) { div { background: #9af; /* blue */ } } /* maximum aspect ratio */ @media (max-aspect-ratio: 3/2) { div { background: #9ff; /* cyan */ } } /* exact aspect ratio, put it at the bottom to avoid override*/ @media (aspect-ratio: 1/1) { div { background: #f9a; /* red */ } } _example used iframe and dataurl to enable this iframe could resize html <label id="wf" for="w">width:165</label> <input id="w" name="w" type="range" min="100" max="250" step="5" value="165"> <label id="hf" for="w">height:165</label> <input id="h" name="h" type="range" min="100" max="250" step="5" value="165"> <iframe id="outer" src="data:text/html,<style> @media (min-aspect-ratio: 8/5) { div { background: %239af; } } @media (max-aspect-ratio: 3/2...
... name="h" type="range" min="100" max="250" step="5" value="165"> <iframe id="outer" src="data:text/html,<style> @media (min-aspect-ratio: 8/5) { div { background: %239af; } } @media (max-aspect-ratio: 3/2) { div { background: %239ff; } } @media (aspect-ratio: 1/1) { div { background: %23f9a; } }</style><div id='inner'> watch this element as you resize your viewport's width and height.</div>"> </iframe> css iframe{ display:block; } javascript outer.style.width=outer.style.height="165px" w.onchange=w.oninput=function(){ outer.style.width=w.value+"px" wf.textcontent="width:"+w.value } h.onchange=h.oninput=function(){ outer.style.height=h.value+"px" hf.textcontent="height:"+h.value } result specifications specification status comment media querie...

Content-Security-Policy - HTTP
tent-security-policy: <policy-directive>; <policy-directive> where <policy-directive> consists of: <directive> <value> with no internal punctuation. directives fetch directives fetch directives control the locations from which certain resource types may be loaded. child-src defines the valid sources for web workers and nested browsing contexts loaded using elements such as <frame> and <iframe>. instead of child-src, if you want to regulate nested browsing contexts and workers, you should use the frame-src and worker-src directives, respectively. connect-src restricts the urls which can be loaded using script interfaces default-src serves as a fallback for the other fetch directives. font-src specifies valid sources for fonts loaded using @font-face. frame-src specifies...
...s, you should use the frame-src and worker-src directives, respectively. connect-src restricts the urls which can be loaded using script interfaces default-src serves as a fallback for the other fetch directives. font-src specifies valid sources for fonts loaded using @font-face. frame-src specifies valid sources for nested browsing contexts loading using elements such as <frame> and <iframe>. img-src specifies valid sources of images and favicons. manifest-src specifies valid sources of application manifest files. media-src specifies valid sources for loading media using the <audio> , <video> and <track> elements. object-src specifies valid sources for the <object>, <embed>, and <applet> elements. elements controlled by object-src are perhaps coincidentally considered legac...
...fest files. media-src specifies valid sources for loading media using the <audio> , <video> and <track> elements. object-src specifies valid sources for the <object>, <embed>, and <applet> elements. elements controlled by object-src are perhaps coincidentally considered legacy html elements and are not receiving new standardized features (such as the security attributes sandbox or allow for <iframe>). therefore it is recommended to restrict this fetch-directive (e.g., explicitly set object-src 'none' if possible). prefetch-src specifies valid sources to be prefetched or prerendered. script-src specifies valid sources for javascript. script-src-elem specifies valid sources for javascript <script> elements. script-src-attr specifies valid sources for javascript inline event handler...
...ves document directives govern the properties of a document or worker environment to which a policy applies. base-uri restricts the urls which can be used in a document's <base> element. plugin-types restricts the set of plugins that can be embedded into a document by limiting the types of resources which can be loaded. sandbox enables a sandbox for the requested resource similar to the <iframe> sandbox attribute. navigation directives navigation directives govern to which locations a user can navigate or submit a form, for example. form-action restricts the urls which can be used as the target of a form submissions from a given context. frame-ancestors specifies valid parents that may embed a page using <frame>, <iframe>, <object>, <embed>, or <applet>. navigate-to restrict...

Displaying web content in an extension without security issues - Archive of obsolete content
extension that needs to display web content (which is always potentially dangerous) will use all of them. displaying untrusted data as content in firefox, there is a distinction between chrome and content documents. the top document in a window is always a chrome document. if you look at the frames it loads, those will usually be chrome documents as well. however, if the document is loaded into <iframe type="content"> or <browser type="content">, it will be considered a content document, and so will be all the frames it loads (the "type" attribute is ignored at that point). so if we look at the frame hierarchy there is a boundary between chrome and content, and at that boundary a number of security mechanisms apply. in particular, a content document can only go up in the frame hierarchy until t...
... to have any privileges at all. here the "data:" protocol is useful. this protocol is special because it inherits the privileges from its parent document. however, if a "data:" document is the topmost content document, there is no parent document (remember, content documents have no access to the chrome documents above them) and consequently no privileges. ...
....allowjavascript = false; frame.docshell.allowmetaredirects = false; frame.docshell.allowplugins = false; frame.docshell.allowsubframes = false; but what about interactivity, for example if you want a certain reaction to mouse clicks? ...

The life of an HTML HTTP request - Archive of obsolete content
ke nshtmlcontentsink::willinterrupt() and nshtmlcontentsink::didbuildmodel(). willinterrup is called by the parser between every 8kb block of data (unless the parser is temporarily blocked). (7) since the presentation shell (nspresshell) has registred as an documentobserver with the nsidocument it also gets notified of changes in the document/content tree. this is used to create and update the nsiframe hierarchy. this is done by the nscssframeconstructor, which creates frames for each content node according to the rules specified in the user agent stylesheet (ua.css) and the document specific style sheets. each content node corresponds to one or more nsiframe, except content with displaytype "none". if there are several frames created from a content node, then the first of these are called the ...
...de according to the rules specified in the user agent stylesheet (ua.css) and the document specific style sheets. each content node corresponds to one or more nsiframe, except content with displaytype "none". if there are several frames created from a content node, then the first of these are called the "primary" node, and the following frames can be found by using the getnextinflow() method of nsiframe. the initial reflow is done by the nshtmlcontentsink::startlayout(), startlayout() calls presshell::initialreflow(). startlayout is called quite early in the parsing process, for html it's called in nshtmlcontentsink::openbody() (among other places). todo: how are nsiframes reflowed after a change when they already exist? (8) each nsiframe knows how how to draw itself on the screen. when the pr...
...these get passed references to the presentation context and a rendering context to do the drawing on. ...

Test your skills: Links - Learn web development
ple.com". you'll get a bonus point if you also set it so that the subject line of the email is automatically filled in as "question about whales". note: the first link in the example has the target="_blank" attribute set on it, so that when you click on it, it opens the page in a new tab. this is not strictly best practice, but we've done it here so that the page doesn't open in the embedded <iframe>, getting rid of your example code in the process! try updating the live code below to recreate the finished example: download the starting point for this task to work in your own editor or in an online editor. links 2 in this task we want you to fill in the four links so that they link to the appropriate places: the first link should link to an image called blue-whale.jpg, which is l...
...tory called imghp. the fourth link should link to the paragraph at the very bottom of the current page. it has an id of bottom. note: the first three links in the example have the target="_blank" attribute set on them, so that when you click on them, they open the linked page in a new tab. this is not strictly best practice, but we've done it here so that the pages don't open in the embedded <iframe>, getting rid of your example code in the process! try updating the live code below to recreate the finished example: download the starting point for this task to work in your own editor or in an online editor. links 3 the following links link to an info page about narwhals, a support email address, and a pdf factfile that is 4mb in size. in this task we want you to: take the existing...
...written link text, and rewrite them so that they have good link text. add a warning to any links that need a warning added. note: the first and third links in the example have the target="_blank" attribute set on them, so that when you click on them, they open the linked page in a new tab. this is not strictly best practice, but we've done it here so that the pages don't open in the embedded <iframe>, getting rid of your example code in the process! try updating the live code below to recreate the finished example: download the starting point for this task to work in your own editor or in an online editor. assessment or further help you can practice these examples in the interactive editors above. if you would like your work assessed, or are stuck and want to ask for help: put y...

Adding vector graphics to the Web - Learn web development
ould cache regular image assets, so pages that include the image will not load faster after the first page containing the image is loaded. you may include fallback in a <foreignobject> element, but browsers that support svg still download any fallback images. you need to weigh whether the extra overhead is really worthwhile, just to support obsolescent browsers. ...
...containing the image is loaded. you may include fallback in a <foreignobject> element, but browsers that support svg still download any fallback images. you need to weigh whether the extra overhead is really worthwhile, just to support obsolescent browsers. how to embed an svg with an <iframe> you can open svg images in your browser just like webpages. so embedding an svg document with an <iframe> is done just like we studied in from <object> to <iframe> — other embedding technologies. ...
...wnload any fallback images. you need to weigh whether the extra overhead is really worthwhile, just to support obsolescent browsers. how to embed an svg with an <iframe> you can open svg images in your browser just like webpages. so embedding an svg document with an <iframe> is done just like we studied in from <object> to <iframe> — other embedding technologies. here's a quick review: <iframe src="triangle.svg" width="500" height="500" sandbox> <img src="triangle.png" alt="triangle with three unequal sides" /> </iframe> this is definitely not the best method to choose: cons iframes do have a fallback mechanism, as you can see, but browsers only display the fallback if they lack support for iframes altogether. moreover, unless the svg and your current webpage have the same or...

Mozilla accessibility architecture
the real work. the nsaccessibletreewalker walks both the dom and anonymous content in the document, and asks nsiaccessibilityservice::getaccessible() for an accessible for each node. if it's in the cache, that is returned. xul elements are checked for support of the nsiaccessibleprovider interface, which can return an accessible. html elements ask the node's primary frame for an accessible via nsiframe::getaccessible(). if nsnull is returned than the tree walker checks the next node, in depth first order. calling sequence: how an accessible node is returned by nsiaccessible's traversal methods atk/msaa toolkit traversal method → nsaccessible traversal method → nsaccessibletreewalker method which traverses dom & anonymous content → nsiaccessibilityservice::getaccessible() with th...
... is returned by nsiaccessible's traversal methods atk/msaa toolkit traversal method → nsaccessible traversal method → nsaccessibletreewalker method which traverses dom & anonymous content → nsiaccessibilityservice::getaccessible() with the content node → nsdocaccessible::getcachedaccessnode() and returns if successful, or → nsiaccessibleprovider::getaccessible() (if xul) or → nsiframe::getaccessible() (if html), which either return nothing or → nsiaccessibilityservice::create[inserttypenamehere]accessible() → operator new, which finally constructs the object. whether via nsiaccessibleprovider::getaccessible() or nsiframe::getaccessible(), new accessibles are created by calling back to the accessibility service, and using a specific method for creating each type of acc...
... doesn't have a dom node or anonymous content for its s textfield, button or list. in the future xbl form controls may be used, in which case there will be dom content for these sub-parts, and we will not need to override the traversal methods. that is why we don't need to override these traversal methods for nsxulcomboboxaccessible (<menulist>). nsouterdocaccessible: used for elements such as <iframe>, <browser> and <editor>, which spawn an entire new document, but don't actually have any child nodes in their own dom. nsxultreeaccessible: which does not have a dom node for each tree item, a special interface is provided by the tree itself to get the text for each row, column in the tree. in all of these accessible implementations we override nsiaccessible::getaccchildcount(), ::getaccfirst...

Inner and outer windows
r to represent these levels of complexity, two "types" of window need to be considered. these don't technically refer to windows as the user sees them, but rather a perspective on what the user is looking at. windows and the bfcache an outer window is a browsing context; that is, the actual environment in which a document is presented to the user. this may be a window or a tab, or it might be an <iframe> contained within another document. html5 refers to the outer window as the windowproxy. an inner window represents the actual content being displayed; it's the current view of what the user sees. consider this view of a window and the browser history: as the user navigates, documents are added to the backward-forward cache (often referred to as the bfcache). these are, in essence, inner windows...
...w as the answer. that lets the document interact with the "physical" window, while the outer window can keep track of all the documents (inner windows) it contains. in other words, window always returns the outer window. nested windows things become slightly more complex when you consider that documents can contain other documents. this happens, for example, when a document contains a <frame> or <iframe>. not only can the outermost document be navigated, but if the user clicks a link in one of the frames, that frame can navigate. this means there needs to be a hierarchy of outer and inner windows. consider a document that has three <iframe> elements in it. the hierarchy would look something like this: in this diagram, objects you interact with directly in the dom (that is, window, document, and...
...sent the more abstract inner and outer windows, which are real objects that you don't directly interact with when working with the dom. the window at the top of the diagram is an outer window. as the user navigates in each of the documents in the various frames, each of those inner windows has its own history that can be moved forward and backward through, just like in the previous diagram. the <iframe> element offers the contentwindow property, which gives you the outer window window object containing the frame's document. the frame's contentdocument property, similarly, gives you the document object inside the frame. you can get the window containing the frame from the window.parent property. this hierarchy can continue on, if frames contain additional frames. ...

Message manager overview
window message manager ...
...it does not refer...
... most important functions are: loadframescript() : load a frame script into this browser frame (tab) sendasyncmessage() : send a message to all frame scripts in this browser frame addmessagelistener() : start listening to a specific message from frame scripts removemessagelistener() : stop listening to a specific message interfaces nsiprocesschecker nsiframescriptloader nsimessagelistenermanager nsimessagesender how to access the browser message manager can be accessed as a property of the xul <browser> element: // chrome script let browsermm = gbrowser.selectedbrowser.messagemanager; content process content frame message manager description there's a content frame message manager for...

Message manager overview
a web browser. global message manager the global message manager operates on every <browser> (that is, every open content tab). loadframescript() loads the given script into every <browser> in every browser window. broadcastasyncmessage() sends the message to every <browser> in every browser window. ...
...ger is associated with a specific browser window, and operates on every <browser> (that is, every content tab) loaded into that window: loadframescript() loads the given script into every <browser> in that browser window broadcastasyncmessage() sends the message to every <browser> in that browser window. ...
... sendasyncmessage() sends the message only to that <browser>. you can mix and match: so for example, you could load a script into every <browser> using the global message manager, but then send a message to the script instance loaded into a specific <browser> using the browser message manager. it's a chromemessagesender object, which implements the following interfaces: nsiprocesschecker nsiframescriptloader nsimessagelistenermanager nsimessagesender the browser message manager can be accessed as a property of the xul <browser> element: // chrome script let browsermm = gbrowser.selectedbrowser.messagemanager; process message managers process message managers correspond to process boundaries, and enable code running in different processes to communicate. multiprocess firefox has the...

mozbrowseractivitydone
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowseractivitydone event is fired when something inside the browser <iframe> triggers a web activity, and that web activity's message is consumed by the receiving app. if the activity has a returnvalue set to true, then the activity is consumed when postresult or posterror is invoked on the activity by the receiving app. note: for activities where the receiving app's activity definition in its manifest does not include returnvalue or returnvalue is false, no mozbrowseractivitydone event will ...
...pp's activity definition in its manifest does not include returnvalue or returnvalue is false, no mozbrowseractivitydone event will be generated as of the landing of bug 1194525 in firefox os 2.5. postresult and posterror calls made on such an activity will be ignored and have no effect. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read ...
...cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: success a boolean that indicates whether the activity has completed successfully (true) or not (false). ...

mozbrowserclose
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserclose event is fired when the content of a browser <iframe> calls the window.close() method. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the event target (the topmost target in the dom tree). type read only domstring the type of event. bubbles read only boolean ...
...escription target read only eventtarget the event target (the topmost target in the dom tree). type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. ...
... type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. ...

mozbrowsercontextmenu
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowsercontextmenu event is fired when the user tried to access a context menu over a browser <iframe>. this event can be used to control what will appear in the menu. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. b...
...s read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: clientx the x value of the coordinate that was clicked inside the browser <iframe>'s viewport. clienty the y value of the coordinate that was clicked inside the browser <iframe>'s viewport. systemtargets an array containing one or more menusystem objects (see the menusystem object, below), containing details of the standard menu(s) that will be shown. for example, if the user clicked on an image nested in an <a> tag, two menus are available — one with information related...
...nu being accessed is a menu item. id the menu item's id, if the context menu being accessed is a menu item. this is passed to the contextmenuitemselected() function, to indicate which item has been selected. items an array of further menu objects, which indicate the menu options available in a menu, if the context menu being accessed is a menu. ...

mozbrowserloadstart
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserloadstart event is fired when the browser <iframe> starts to load a new page. ...
... type read only domstring the type of event. ...
... bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. example in this example the mozbrowserloadend and mozbrowserloadstart events are used to change the icon shown on the stop/reload button between stop (x) and reload (r), as appropriate. ...

mozbrowsermanifestchange
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. ...
...mentations and the behavior may change in the future. the mozbrowsermanifestchange event is fired when the manifest location of the app loaded in the browser <iframe> changes. by this, we are referring to the href of the manifest, as defined in <link rel="manifest" href=" … ">. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read ...
... boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: href the url of the new app manifest. ...

mozbrowseropentab
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. ...
...incompatibilities between implementations and the behavior may change in the future. the mozbrowseropentab event is fired when a new tab is opened within a browser <iframe> as a result of the user issuing a command to open a link target in a new tab (for example ctrl/cmd + click.) general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read ...
...event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: url a domstring representing the url of the new document loaded. ...

mozbrowserselectionstatechanged
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserselectionstatechanged event is fired when the text selected inside the browser <iframe> content changes. ...
...plementations and the behavior may change in the future. the mozbrowserselectionstatechanged event is fired when the text selected inside the browser <iframe> content changes. note that this is deprecated, and current implementations should use mozbrowsercaretstatechanged instead. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read ...
...nitless and represents a percentage increase/decrease, e.g. 1.1 is a 10% zoom in, and 0.9% is a 10% zoom out. iscollapsed a boolean indicating whether the current selection is collapsed (true) or not (false). visible a boolean indicating whether the current selection is visible (true) or not (false). states the current state of the selection. ...

mozbrowsershowmodalprompt
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowsershowmodalprompt event is fired when the content of a browser <iframe> calls the window.alert(), window.confirm(), or window.prompt() methods. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only ...
...t. details the details property is an anonymous javascript object with the following properties: prompttype a domstring defining the type of the prompt. it can be alert, confirm, or prompt. title a domstring representing the title of the prompt. message a domstring representing the value passed to the window.alert(), window.confirm(), or window.prompt() methods within the browser <iframe>'s content. returnvalue a domstring representing the return value for the window.prompt() methods. this should be set by the embedder. unblock() a function to be called when the iframe is unblocked. note that if the embedder calls preventdefault() on this event, the iframe is blocked until unblock() is called. obsolete properties of details msg_name a string representing the type of mes...
...e is unblocked. note that if the embedder calls preventdefault() on this event, the iframe is blocked until unblock() is called. obsolete properties of details msg_name a string representing the type of message. for that event, it's always showmodalprompt. initialvalue a string representing the initial value for the window.prompt() methods. ...

mozbrowservisibilitychange
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowservisibilitychange event is fired when the visibility state of the current browser iframe <iframe> changes, for example due to a call to setvisible(). general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read ...
...event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. ...
.... cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: visible a boolean that indicates whether the browser iframe is visible (true) or not (false). ...

Mozilla Style System Documentation
complete although less detailed documentation. style context management a style context (class nsstylecontext, currently also interface nsistylecontext although the interface should go away when all of the style systems can be moved back into the layout dll) represents the style data for a css formatting object. in the layout system, these formatting objects are described as frames (interface nsiframe), although a pair of frames represents table formatting objects. the css specification describes formatting objects that correspond to elements in the content model and formatting objects that correspond to pseudo-elements. (mozilla has a bunch of its pseudo-elements that are not in the css specification.) we also create style contexts for some things that are not css formatting objects: text no...
...e unordered, since the order is not relevant. thus the parent style context is an argument to the functions that create style contexts. if the parent is not given, the style context is taken to be the root of the style context tree. the functions that form the style context automatically adds the context to the tree correctly. dynamic changes describe nsframemanager::reresolvestylecontext and nsiframe::getparentstylecontextframe ...</p> describe nscssframeconstructor::attributechanged hack for style attribute that avoids style context tree manipulation. problems: dynamic style changes scrap the whole thing and start over. this is very hard to fix because of the "sibling-sharing" optimisation. matters dealing with dynamic style changes are also tricky because the style contexts don't have poi...
...efault or single properties that are set to the initial value by default (see css26.1.1), which is essential for the ruletree. ...

nsIChromeFrameMessageManager
content/base/public/nsimessagemanager.idlscriptable handles loading of content in a remote chrome frame. 1.0 66 introduced gecko 2.0 inherits from: nsiframemessagemanager last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview void loadframescript(in astring aurl, in boolean aallowdelayedload); void removedelayedframescript(in astring aurl); methods loadframescript() loads a script into the remote frame. void loadframescript( in astring aurl, in boolean aallowdelayedload ); parameters aurl the url of the script to load into the frame; this must be an absolute url, but data: urls are supported. aallowdelayedload if true, the script will be loaded when the re...
...ipt will only be loaded if the frame is already available. ...
...loaded if the frame is already available. ...

Filelink Providers
ername and password. other services may require the user to fill in a server string or port number. a provider implementation can choose what information it gets from the user from the setup dialog by pointing the settingsurl attribute of their nsimsgcloudfileprovider implementation to a chrome url for an xhtml page that contains a form with the extra information. that url is then loaded into an iframe directly beneath the provider menulist. note: the setup dialog window should resize itself automatically in order to fit the content of the iframe without scrollbars. custom settings fields to handle custom settings, the settings xhtml page should contain a form with the id "provider-form", with its onsubmit attribute set to "return false;". example: <form id="provider-form" onsubmit="return...
...lidity method of the form is automatically called. the button to set up the account will only become enabled once the checkvalidity method for the form returns true. saving custom settings in preferences custom settings for a provider are saved using the preferences api. saving the preferences is handled automatically by the dialog code. providers need only provide an extraargs function in the iframe content which returns an object specifying the name, type, and value to save. the format for the returned object is: { field_name: {type: field_type, value: field_value} } where field_type is "int", "bool", or "char". for example, the hightail implementation provides the following function: function extraargs() { var usernamevalue = document.getelementbyid("username").value; return { ...
...l.cloud_files.accounts.account_key.username where account_key is the value passed into the implementations init function. the hightail settings.xhtml and settings.js file have examples of this. management interface once an account has been created, it is manageable from within the preferences dialog, in the attachment pane, in the outgoing tab. the content to the right of the menulist is an iframe, pointed at a url read from the providers managementurl attribute, which should point to an xhtml page. the xhtml page should have a function in the global scope called onloadprovider. this function is called automatically once the dom content is done loading, and is passed a single parameter - the provider instance whose data is being displayed. ...

Working with windows in chrome code
so some calls, like win.document.getelementbyid() will fail. to overcome this difficulty, you can move the initialization code to a load handler of the window being opened or pass a callback function, as described below. you can get a window object from a document using document.defaultview. content windows when a xul window contains a widget capable of displaying a page, such as <browser> or <iframe>, the document in that widget is, naturally, separate from the document of the chrome window itself. there also is a window object for each sub-document, although there's no window in a common sense for the sub-document. the same holds for chrome windows opened inside a tab of <tabbrowser>. the elements above the chrome document opened in the tab are separate from your chrome document. the foll...
... from your chrome document. the following two subsections describe how to cross chrome-content boundaries in either way, i.e. accessing elements which are ancestors of your chrome document, or accessing elements which are descendants of your chrome document (but nevertheless in a different context). accessing content documents assume you have a document loaded in a <tabbrowser>, <browser>, or <iframe> element inside your document. you can use browser.contentdocument to access that document and browser.contentwindow to access the window object of that document. you should be aware of xpcnativewrappers when working with untrusted content. with xpcnativewrappers turned on (which is the default in firefox 1.5+), your extension can safely access the dom of the content document, but not the conten...
...and variables inside the sidebar, you need to use document.getelementbyid("sidebar").contentdocument or .contentwindow, like when accessing content documents. for more sidebar tips, see code snippets:sidebar. accessing the elements of the top-level document from a child window the opposite case is when you want to access the chrome document from a privileged script loaded in a <browser> or an <iframe>. a typical case when this can be useful is when your code runs in the sidebar in the main firefox window and you want to access the elements in the main browser window. the dom tree, as shown by the dom inspector, can look like this: #document window main-window ... browser #document window myextensionwindow where the child window is whe...

Channel Messaging API - Web APIs
note: this feature is available in web workers. channel messaging concepts and usage a message channel is created using the messagechannel() constructor. ...
... note: this feature is available in web workers. channel messaging concepts and usage a message channel is created using the messagechannel() constructor. ...
...ng sending of messages from one port and listening out for them arriving at the other. portcollection an array of messageports; an experimental solution to allow broadcasting of a message to multiple ports simultaneously. examples we have published a channel messaging basic demo on github (run it live too), which shows a really simple single message transfer between a page and an embedded <iframe>. you can also see a multimessaging demo (run this live), which shows a slightly more complex setup that can send multiple messages between main page and iframe. specifications specification status comment html living standardthe definition of 'channel messaging' in that specification. living standard ...

DOMTokenList.supports() - Web APIs
the supports() method of the domtokenlist interface returns true if a given token is in the associated attribute's supported tokens. this method is intended to support feature detection. syntax let trueorfalse = element.supports(token) parameters token a domstring containing the token to query for. returns a boolean indicating whether the token was found. ...
...tokenlist interface returns true if a given token is in the associated attribute's supported tokens. this method is intended to support feature detection. syntax let trueorfalse = element.supports(token) parameters token a domstring containing the token to query for. returns a boolean indicating whether the token was found. ...
...pport feature detection. syntax let trueorfalse = element.supports(token) parameters token a domstring containing the token to query for. returns a boolean indicating whether the token was found. example let iframe = document.getelementbyid('display'); if (iframe.sandbox.supports('an-upcoming-feature')) { // support code for mystery future feature } else { // fallback code } if (iframe.sandbox.supports('allow-scripts')) { // instruct frame to run javascript // // (note: this feature is well-supported; this is just an example!) // } specifications specification status comment credential management level 1 working draft initial definition. ...

Document.adoptNode() - Web APIs
ode = document.adoptnode(externalnode); parameters externalnode the node from another document to be adopted. return value the copied importednode in the scope of the importing document. after calling this method, importednode and externalnode are the same object. ...
...node); parameters externalnode the node from another document to be adopted. return value the copied importednode in the scope of the importing document. after calling this method, importednode and externalnode are the same object. ...
...ers externalnode the node from another document to be adopted. return value the copied importednode in the scope of the importing document. after calling this method, importednode and externalnode are the same object. note: importednode's node.parentnode is null, since it has not yet been inserted into the document tree! example const iframe = document.queryselector('iframe'); const iframeimages = iframe.contentdocument.queryselectorall('img'); const newparent = document.getelementbyid('images'); iframeimages.foreach(function(imgel) { newparent.appendchild(document.adoptnode(imgel)); }); notes before they can be inserted into the current document, nodes from external documents should either be: cloned using document.importnode(); or adopted using document.adoptnode(). ...

MessageChannel.port1 - Web APIs
— the port attached to the context that originated the channel. note: this feature is available in web workers. syntax channel.port1; value a messageport object, the first port of the channel, that is the port attached to the context that originated the channel. example in the following code block, you can see a new channel being created using the messagechannel() constructor. when the <iframe> has loaded, we pass messagechannel.port2 to the <iframe> using messageport.postmessage along with a message. the handlemessage handler then responds to a message being sent back from the <iframe> (using messageport.onmessage), putting it into a paragraph. the handlemessage method is associated to the port1 to listen when the message arrives. var channel = new messagechannel(); var para = docume...
... using messageport.postmessage along with a message. the handlemessage handler then responds to a message being sent back from the <iframe> (using messageport.onmessage), putting it into a paragraph. the handlemessage method is associated to the port1 to listen when the message arrives. ...
...r then responds to a message being sent back from the <iframe> (using messageport.onmessage), putting it into a paragraph. the handlemessage method is associated to the port1 to listen when the message arrives. var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = document.queryselector('iframe'); var otherwindow = ifr.contentwindow; ifr.addeventlistener("load", iframeloaded, false); function iframeloaded() { otherwindow.postmessage('hello from the main page!', '*', [channel.port2]); } channel.port1.onmessage = handlemessage; function handlemessage(e) { para.innerhtml = e.data; } specifications specification status comment html living standardthe definition of 'port1' in that specification. living standard ...

Window: unload event - Web APIs
the unload event is fired when the document or a child resource is being unloaded. bubbles no cancelable no interface event event handler property onunload it is fired after: beforeunload (cancelable event) pagehide the document is in the following state: all the resources still exist (img, iframe etc.) nothing is visible anymore to the end user ui interactions are ineffective (window.open, alert, confirm, etc.) an error won't stop the unloading workflow please note that the unload event also follows the document tree: parent frame unload will happen before child frame unload (see example below). examples <!doctype html> <html> <head> <title>parent frame</title> <script> window.addeventlistener('beforeunload...
... before child frame unload (see example below). ...
...example below). ...

Text labels and names - Accessibility
news about this product.</label> form elements should have a visible text label in addition to having a <label> for every form element, those labels should be visible, not hidden. visible labels help all users understand the purpose of a form element. do not rely on placeholder text, because it disappears as soon as the user starts typing. frame elements must be labeled frame elements, both <iframe> and the older, obsolete <frame>, must have a title to describe the contents of the frame. use the title attribute to label a frame element. without a title, users of assistive technologies have to navigate into the frame in order to understand what it contains, which can be difficult and confusing. the <frame> element is no longer part of the html specification as of html5. support for it may ...
...e, with content identical to the frame's title attribute. (this assumes that the enclosed document is under your control; if not, try to match the frame's title attribute to the document's title.) some screen readers replace the contents of the title attribute with the contents of the enclosed document's <title>. it's safest and most accessible to provide the same title in both places. example <iframe title="mdn web docs" width="300" height="200" src="https://developer.mozilla.org"> </iframe> use alt attribute to label mglyph elements when writing equations with mathml, give each <mglyph> element an alt attribute containing a name that describes the symbol. since mglyph elements are used for non-standard symbols without unicode definitions, screen readers won't automatical...
...s can cause confusion. headings should have visible text content make sure that your headings have non-empty text content, and are not hidden, such as with css display:none or aria-hidden=true. users of screen readers rely on headings to understand the structure and content of a document. do not use heading elements to mark up images or other graphical content. use title attribute to describe <iframe> content make sure that <iframe> elements have a title attribute to describe the contents of the frame. without a title, users of assistive technologies have to navigate into the frame in order to understand what it contains, which can be difficult and confusing. as a best practice, also provide a <title> for the document that is enclosed in the frame, with content identical to the frame's tit...

Content categories - Developer guides
the flow content category typically contain text or embedded content. they are: <a>, <abbr>, <address>, <article>, <aside>, <audio>, <b>,<bdo>, <bdi>, <blockquote>, <br>, <button>, <canvas>, <cite>, <code>, <command>, <data>, <datalist>, <del>, <details>, <dfn>, <div>, <dl>, <em>, <embed>, <fieldset>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <i>, <iframe>, <img>, <input>, <ins>, <kbd>, <keygen>, <label>, <main>, <map>, <mark>, <math>, <menu>, <meter>, <nav>, <noscript>, <object>, <ol>, <output>, <p>, <picture>, <pre>, <progress>, <q>, <ruby>, <s>, <samp>, <script>, <section>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <table>, <template>, <textarea>, <time>, <ul>, <var>, <video>, <wbr> and text. a few other elements belong to thi...
...but is still part of the whatwg specification and is at least partially supported by most browsers. phrasing content phrasing content defines the text and the mark-up it contains. runs of phrasing content make up paragraphs. elements belonging to this category are <abbr>, <audio>, <b>, <bdo>, <br>, <button>, <canvas>, <cite>, <code>, <command>, <data>, <datalist>, <dfn>, <em>, <embed>, <i>, <iframe>, <img>, <input>, <kbd>, <keygen>, <label>, <mark>, <math>, <meter>, <noscript>, <object>, <output>, <picture>, <progress>, <q>, <ruby>, <samp>, <script>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <textarea>, <time>, <var>, <video>, <wbr> and plain text (not only consisting of white spaces characters). a few other elements belong to this category, but only if a specific conditio...
...<ins>, if it contains only phrasing content <link>, if the itemprop attribute is present <map>, if it contains only phrasing content <meta>, if the itemprop attribute is present embedded content embedded content imports another resource or inserts content from another mark-up language or namespace into the document. elements that belong to this category include: <audio>, <canvas>, <embed>, <iframe>, <img>, <math>, <object>, <picture>, <svg>, <video>. interactive content interactive content includes elements that are specifically designed for user interaction. elements that belong to this category include: <a>, <button>, <details>, <embed>, <iframe>, <keygen>, <label>, <select>, and <textarea>. some elements belong to this category only under specific conditions: <audio>, if the cont...

Printing - Developer guides
event, click the link below to open the window to print. you can also try changing the code to use <code>beforeprint</code> to see the difference.</p> <p><a href="javascript: popuponclick()">open popup window</a></p> </body> </html> view live examples print an external page without opening it if you want to be able to print an external page without opening it, you can utilize a hidden <iframe> (see: htmliframeelement), automatically removing it after the user prints its contents. the following is a possible example which will print a file named externalpage.html: <!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>mdn example</title> <script type="text/javascript"> function closeprint () { document.body.removechild(this.__conta...
...ipt"> function closeprint () { document.body.removechild(this.__container__); } function setprint () { this.contentwindow.__container__ = this; this.contentwindow.onbeforeunload = closeprint; this.contentwindow.onafterprint = closeprint; this.contentwindow.focus(); // required for ie this.contentwindow.print(); } function printpage (surl) { var ohiddframe = document.createelement("iframe"); ohiddframe.onload = setprint; ohiddframe.style.position = "fixed"; ohiddframe.style.right = "0"; ohiddframe.style.bottom = "0"; ohiddframe.style.width = "0"; ohiddframe.style.height = "0"; ohiddframe.style.border = "0"; ohiddframe.src = surl; document.body.appendchild(ohiddframe); } </script> </head> <body> <p><span onclick="printpage('externalpage.html');" style="cursor:p...
... ...

itemprop - HTML: Hypertext Markup Language
itemprop global attribute is used to add properties to an item. every html element can have an itemprop attribute specified, and an itemprop consists of a name-value pair. each name-value pair is called a property, and a group of one or more properties forms an item. property values are either a string or a url and can be associated with a very wide range of elements including <audio>, <embed>, <iframe>, <img>, <link>, <object>, <source> , <track>, and <video>. examples the example below shows the source for a set of elements marked up with itemprop attributes, followed by a table showing the resulting structured data. html <div itemscope itemtype="http://schema.org/movie"> <h1 itemprop="name">avatar</h1> <span>director: <span itemprop="director">james cameron</span> (born augus...
...he values would be parsed as multiple tokens. values the property value of a name-value pair is as given for the first matching case in the following list: if the element has an itemscope attribute the value is the item created by the element. ...
... if the element is a meter element the value is the value of the element's value attribute if the element is a time element the value is the element's datetime value otherwise the value is the element's textcontent. if a property's value is a url, the property must be specified using a url property element. the url property elements are the a, area, audio, embed, iframe, img, link, object, source, track, and video elements. name order names are unordered relative to each other, but if a particular name has multiple values, they do have a relative order. in the following example, the "a" property has the values "1" and "2", in that order, but whether the "a" property comes before the "b" property or not is not important <div itemscope> <p itemprop="a">1</p> ...

Feature Policy - HTTP
es" for the browser to enforce on specific features used throughout a website. these policies restrict what apis the site can access or modify the browser's default behavior for certain features. examples of what you can do with feature policy: change the default behavior of autoplay on mobile and third party videos. restrict a site from using sensitive apis like camera or microphone. allow iframes to use the fullscreen api. block the use of outdated apis like synchronous xhr and document.write(). ensure images are sized properly and are not too big for the viewport. concepts and usage feature policy allows you to control which origins can use which features, both in the top-level page and in embedded frames. essentially, you write a policy, which is an allowed list of origins for eac...
...allowlist is specific to each feature. writing a policy a policy is described using a set of individual policy directives. a policy directive is a combination of a defined feature name, and an allowlist of origins that can use the feature. specifying your policy feature policy provides two ways to specify policies to control features: the feature-policy http header. the allow attribute on iframes. the primary difference between the http header and the allow attribute is that the allow attribute only controls features within an iframe. the header controls features in the response and any embedded content within the page. for more details see using feature policy. inferring the policy scripts can programatically query information about the feature policy via the featurepolicy object l...
... types of policy-controlled features though feature policy provides control of multiple features using a consistent syntax, the behavior of policy controlled features varies and depends on several factors. ...

Error: Permission denied to access property "x" - JavaScript
the javascript exception "permission denied to access property" occurs when there was an attempt to access an object for which you have no permission. message error: permission denied to access property "x" error type error. what went wrong? there was attempt to access an object for which you have no permission. this is likely an <iframe> element loaded from a different domain for which you violated the same-origin policy. ...
... for which you have no permission. message error: permission denied to access property "x" error type error. what went wrong? there was attempt to access an object for which you have no permission. this is likely an <iframe> element loaded from a different domain for which you violated the same-origin policy. ...
...o access property "x" error type error. what went wrong? ...

Lazy loading - Web Performance
it is possible to perform some css optimizations to achieve that. fonts by default, font requests are delayed until the render tree is constructed, which can result in delayed text rendering. it is possible to override the default behaviour and preload web font resources using <link rel="preload">, the css font-display property, and the font loading api. ...
...y, and the font loading api. see also: element link images and iframes very often, webpages contain many images that contribute to data-usage and how fast a page can load. most of those images are off-screen (non-critical), requiring user interaction (an example being scroll) in order to view them. loading attribute the loading attribute on an <img> element (or the loading attribute on an <iframe>) can be used to instruct the browser to defer loading of images/iframes that are off-screen until the user scrolls near them. ...
...those images are off-screen (non-critical), requiring user interaction (an example being scroll) in order to view them. loading attribute the loading attribute on an <img> element (or the loading attribute on an <iframe>) can be used to instruct the browser to defer loading of images/iframes that are off-screen until the user scrolls near them. <img src="image.jpg" loading="lazy" alt="..." /> <iframe src="video-player.html" loading="lazy"></iframe> the load event fires when the eagerly-loaded content has all been loaded; at that time, it's entirely possible (or even likely) that there may be lazily-loaded images that are within the visual viewport that haven't yet loaded. you can determine if a given image has finished loading by examining the value of its boolean complete property. polyfi...

Porting the Library Detector - Archive of obsolete content
implementing the user interface showing the library array the widget module is a natural fit for displaying the library list. we'll specify its content using html, so we can display an array of icons. the widget must be able to display different conte...
...rker.tab.libraries.push(library); } }); if (worker.tab == tabs.activetab) { updatewidgetview(worker.tab); } }); } }); the content script is executed once for every window.onload event, so it will run multiple times when a single page containing multiple iframes is loaded. so main.js needs to filter out any duplicates, in case a page contains more than one iframe, and those iframes use the same library. implementing the user interface showing the library array the widget module is a natural fit for displaying the library list. we'll specify its content using html, so we can display an array of icons. the widget must be able to display different content for different windows, so we'll use the widgetview object. main.js will create an array of icons cor...

ui/frame - Archive of obsolete content
at the moment you can only add frames to a toolbar. usage this module exports the frame constructor, which can be used to create frame components. right now it can be used in conjunction with a toolbar: you create a frame, then supply it to the toolbar's constructor, and the content is then displayed inside the toolbar. constructing frames the frame constructor takes one mandatory option, which is a url pointing to an html document supplied under your add-ons "data" directory. ...
...logged from a frame script using the console will not appear in the terminal when you run the add-on using jpm run. however, they will appear in the browser console. this issue is being tracked as bug 982385. communicating with frames you can exchange messages between the main add-on code and scripts loaded into the frame using an api modeled on window.postmessage(). a frame creates a separate iframe instance for each browser window. so there are three cases to consider: sending messages from a frame script to the main add-on code sending messages from the main add-on code to all instances of a frame, across all browser windows sending messages from the main add-on code to a single instance of a frame, attached to a specific browser window in all cases, postmessage() takes two argument...

Low-Level APIs - Archive of obsolete content
lds that are not part of objects public api. core/promise implementation of promises to make asynchronous programming easier. dev/panel enables you to extend the firefox developer tools. event/core the event/core module allows the creation of apis to broadcast and subscribe to events. event/target create objects that broadcast events. frame/hidden-frame creates firefox frames (i.e. xul <iframe> elements) that are not displayed to the user. frame/utils provides helper functions for working with platform internals like frames and browsers. fs/path provides access to the local filesystem with the nodejs path module api. io/byte-streams provides streams for reading and writing bytes. io/file provides access to the local filesystem. io/text-streams provides streams for reading and...
...1.1. test/harness test harness setup and execution. test/httpd an http server for the mozilla platform, which can be used in unit tests. test/runner sets up unit tests. test/utils helper methods used in the commonjs unit testing suite. ui/button/action add a button to the firefox user interface. ui/button/toggle add a toggle button to the firefox user interface. ui/frame create html iframes, using bundled html, css and javascript, that can be added to a designated area of the firefox user interface. ui/id create ui component ids. ui/sidebar enables you to create sidebars. ui/toolbar add a toolbar to the firefox user interface. util/array helper functions for working with arrays. util/collection a simple list-like class and utilities for using it. util/deprecate function...

Tabbed browser - Archive of obsolete content
-1, true); detecting page load see also code snippets:on page load function examplepageload(event) { if (event.originaltarget instanceof components.interfaces.nsidomhtmldocument) { var win = event.originaltarget.defaultview; if (win.frameelement) { // frame within a tab was loaded. win should be the top window of // the frameset. if you don't want do anything when frames/iframes // are loaded in this web page, uncomment the following line: // return; // find the root document: win = win.top; } } } // do not try to add a callback until the browser window has // been initialised. we add a callback to the tabbed browser // when the browser's window gets loaded. window.addeventlistener("load", function () { // add a callback to be run every ...
...wing line: // return; // find the root document: win = win.top; } } } // do not try to add a callback until the browser window has // been initialised. we add a callback to the tabbed browser // when the browser's window gets loaded. window.addeventlistener("load", function () { // add a callback to be run every time a document loads. // note that this includes frames/iframes within the document gbrowser.addeventlistener("load", examplepageload, true); }, false); ... // when no longer needed gbrowser.removeeventlistener("load", examplepageload, true); ... notification when a tab is added or removed function exampletabadded(event) { var browser = gbrowser.getbrowserfortab(event.target); // browser is the xul element of the browser that's been added } functi...

Documentation for BiDi Mozilla - Archive of obsolete content
it is created when resolving text containing a unicode bidi control character, a bdo tag, or right-to-left alignment caused by a dir tag or cs...
...resutils.cpp utilities for the layout engine including: resolve frames by bidi level split framesreorder frames format bidi text support for deletion and insertion of frames by editor nsbiditextframe layout/generic/nsbidiframes.cpp subclass of nsframe with additional method setoffsets, to adjust mcontentoffset and mcontentlength during bidi processing nsdirectionalframe layout/generic/nsbidiframes.cpp subclass of nsframethis is a special frame which represents a bidi control. it is created when resolving text containing a unicode bidi control character, a bdo tag, or right-to-left alignment caused by a dir tag or css. nsibidikeyboard widget/public/nsibidikeyboard.idl widget/src/%platform%/nsbidikeyboard.cpp sets and queries the directionality of the current keyboard language. ...

jspage - Archive of obsolete content
(a);document.head.removechild(a);}return b;}native.uid=1; var $uid=(browser.engine.trident)?function(a){return(a.uid||(a.uid=[native.uid++]))[0];}:function(a){return a.uid||(a.uid=native.uid++);};var window=new native({name:"window",legacy:(browser.engine.trident)?null:window.window,initialize:function(a){$uid(a); if(!a.element){a.element=$empty;if(browser.engine.webkit){a.document.createelement("iframe");}a.element.prototype=(browser.engine.webkit)?window["[[domelement.prototype]]"]:{}; }a.document.window=a;return $extend(a,window.prototype);},afterimplement:function(b,a){window[b]=window.prototype[b]=a;}});window.prototype={$family:{name:"window"}}; new window(window);var document=new native({name:"document",legacy:(browser.engine.trident)?null:window.document,initialize:function(a){$uid(a);a.
...lement(a,b);}return document.id(a).set(b);},afterimplement:function(a,b){element.prototype[a]=b; if(array[a]){return;}elements.implement(a,function(){var c=[],g=true;for(var e=0,d=this.length;e<d;e++){var f=this[e][a].apply(this[e],arguments);c.push(f); if(g){g=($type(f)=="element");}}return(g)?new elements(c):c;});}});element.prototype={$family:{name:"element"}};element.constructors=new hash;var iframe=new native({name:"iframe",generics:false,initialize:function(){var f=array.link(arguments,{properties:object.type,iframe:$defined}); var d=f.properties||{};var c=document.id(f.iframe);var e=d.onload||$empty;delete d.onload;d.id=d.name=$pick(d.id,d.name,c?(c.id||c.name):"iframe_"+$time()); c=new element(c||"iframe",d);var b=function(){var g=$try(function(){return c.contentwindow.location.host;});i...

browser.type - Archive of obsolete content
type: one of the values below. the type of browser, which can be used to set access of the document loaded inside the browser. if this is not set, the loaded document has the same access as the window containing the browser. more precisely: the document loaded into a chrome window is always of chrome type. subdocuments of chrome documents are of chrome type, unless the container element (one of iframe, browser or editor) has one of the special type attribute values (the common ones are content, content-targetable and content-primary) indicating that the subdocument is of content type. this boundary has a number of special effects, such as making window.top == window (unless the browser is added to a chrome document), and preventing documents from inheriting the principal of the parent document...
...e preferred value for any browser element in an application, which will use multiple browsers of equal privileges, and is unselected at the moment. chrome (default behaviour): a browser, intended to be used for loading privileged content using a chrome:// uri. don't use for content from web, as this may cause serious security problems! see also more information in the xul tutorial and iframe ...

Introduction to XUL - Archive of obsolete content
notice that the example window tag has an id attached to it. strictly speaking, that is unnecessary for this example. however in practice, most nodes in xul have these identifiers, which enable the nodes to be retrieved easily using the aom's ...
...content area. the next element in the example declares the menubar. the menubar contains a single menu called "file". this menu contains a single menu item that has a simple javascript onclick handler attached to it. this handler fires when the menu is selected by the user, and it dumps the text "hello world!" to the debug console. (see menu bars and menus for details.) finally there is an html iframe. note that the frame is qualified with the prefix html:, since it is an html object being used inside a default xul namespace. the frame also has a special attribute called flex, which indicates how much the frame is allowed to stretch to consume available space inside its window. (see the box system for details). idealistic future direction ideally, packages of xul ui descriptions could be shi...

Features of a Window - Archive of obsolete content
've already seen some features of windows. we'll look at some more in this section. creating another window you can create a second window for your application in the same manner as you would create the first one. just create a second xul file with the window code in it. as in html, you can use the window interface's open() method loads the specified resource into the browsing context (window, <iframe> or tab) with the specified name. if the name doesn't exist, then a new window is opened and the specified resource is loaded into its browsing context.">window.open() function to open the second window. this function will return a reference to the newly opened window. you can use this reference to call functions of the other window. the open function takes three arguments. the first is the url ...
...w is moved, the new window is moved relative to it. dialog the window is a dialog box, which may appear differently. modal the dialog is modal. the window that opened the modal window can't be interacted with until the modal window is closed. resizable the user can resize the window. see also window interface's open() method loads the specified resource into the browsing context (window, <iframe> or tab) with the specified name. if the name doesn't exist, then a new window is opened and the specified resource is loaded into its browsing context.">window.open() next, we'll look at how to open secondary dialogs. « previousnext » ...

XUL Questions and Answers - Archive of obsolete content
sses["@mozilla.org/moz/jssubscript-loader;1"].getservice(components.interfaces.mozijssubscriptloader); objscriptloader.loadsubscript(strurl); see http://www.xulplanet.com/references/...iptloader.html for more information. too specific questions or unclear answers how do i remove the file location header included in the default printing setting? see http://www.xulplanet.com/references/...ef_iframe.html, the first user note at the bottom. change this line var settings = printutils.getprintsettings(); to this var settings = printutils.getprintsettings().clone(); settings.docurl = " "; // suppress url on printout other options you can modify are documented here: http://www.xulplanet.com/references/...tsettings.html how can i send xml/xul document fragment to the server instead of usin...
...bel="rdf:http://home.netscape.com/nc-rdf#dirname" value="rdf:http://home.netscape.com/nc-rdf#diruri"/> </rule> </template> </menupopup> </menulist> drawwindow with transparent background possible? with mozilla trunk --------------------------------------------------------- nsidomcanvasrenderingcontext2d* c2d = //coming from <canvas> nsidomwindow* window = //coming from <iframe> c2d->drawwindow( window, ..., "rgba(0,0,0,0)"); --------------------------------------------------------- this makes canvas background transparent if background is transparent but when "window" is coming from top level content window, background is not transparent. so how can i do this same way as <iframe>? you can't right now i want to create dynamically multiple elements with datasource ...

XUL Reference - Archive of obsolete content
« xul reference « alphabetical list of all xul elements action arrowscrollbox assign bbox binding bindings box broadcaster broadcasterset button browser checkbox caption clicktoscroll colorpicker column columns commandset command conditions content datepicker deck description dialog dialogheader dropmarker editor grid grippy groupbox hbox iframe image key keyset label listbox listcell listcol listcols listhead listheader listitem member menu menubar menuitem menulist menupopup menuseparator notification notificationbox observes overlay page panel param popupset preference preferences prefpane prefwindow progressmeter query queryset radio radiogroup resizer richlistbox richlistitem row rows rule scale script...
...rspring tabs and grouping tab tabbox tabpanel tabpanels tabs controls --- text and images label caption image lists --- trees --- layout --- templates --- scripting --- helper elements other xul lists dialog overlay page window wizard wizardpage preference preferences prefpane prefwindow browser tabbrowser editor iframe titlebar resizer statusbar statusbarpanel dialogheader notification notificationbox menubar menu menuitem menuseparator menupopup panel tooltip popupset toolbar toolbarbutton toolbargrippy toolbaritem toolbarpalette toolbarseparator toolbarset toolbarspacer toolbarspring toolbox tabbox tabs tab tabpanels tabpanel groupbox caption separator spacer button checkbo...

Accessibility/XUL Accessibility Reference - Archive of obsolete content
keyboard shortcut tutorial deck only the currently selected deck layer can be focused. grid although text in the grid can be read, jaws does not recognize grids as tables for table reading mode. groupbox <groupbox> <caption label="<!--group label-->" /> <hbox> <button label="<!--button text-->" /> </hbox> </groupbox> iframe jaws 7.10 issues testing with jaws 7.10, use of an iframe element causes many, unpredictable issues with xul inside of the iframe. okay to use html inside of iframe. see browser element for more info. image <image src="images/img.xbm" tooltiptext='<!--image label-->'/> key see keyboard shortcut tutorial keyset see keyboard shortcu...
... text-->" /> </tabs> <tabpanels> <tabpanel orient="vertical"> ... </tabpanel> </tabpanels> focusing the tabbox will visually set focus to the selected tab, then you can select different tabs by using the left and right arrow keys. tabbrowser jaws 7.10 issues testing with jaws 7.10, use of a tabbrowser element causes many, unpredictable issues with xul inside of the iframe. okay to use html inside of tabbrowser. see browser element for more info. tabpanel see tabbox tabpanels see tabbox tabs see tabbox textbox <label control="inputid"> <!--first name:--> </label> <textbox id='inputid'> tree <tree hidecolumnpicker="true" > <treecols> <treecol label="cats" primary=...

browser - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] a xul <browser> element represents a frame which is expected to contain a view of a web document. it is similar to an iframe except that it holds a page history and contains additional methods to manipulate the currently displayed page. are you here looking for information about the firefox web browser, or because you'd like to download the latest version of firefox? get firefox most of the properties and methods of the browser will rarely be used and can only be called from chrome urls. other urls will need to use the document and history objects to change the displayed document. attributes autocompleteenabled, autocompletepopup, autoscroll, disablehistory, disableglobalhistory, disable...
... type: one of the values below. the type of browser, which can be used to set access of the document loaded inside the browser. if this is not set, the loaded document has the same access as the window containing the browser. more precisely: the document loaded into a chrome window is always of chrome type. subdocuments of chrome documents are of chrome type, unless the container element (one of iframe, browser or editor) has one of the special type attribute values (the common ones are content, content-targetable and content-primary) indicating that the subdocument is of content type. this boundary has a number of special effects, such as making window.top == window (unless the browser is added to a chrome document), and preventing documents from inheriting the principal of the parent document...

nsIContentPolicy - Archive of obsolete content
indicates a stylesheet (for example, <style> elements). type_object 5 indicates a generic object (plugin-handled content typically falls under this category). type_document 6 indicates a dom document at the top-level (that is, directly within a browser tab). type_subdocument 7 indicates a document contained within another document (for example, <iframe> and <frame> elements). note: gecko uses type_internal_frame and type_internal_iframe in order to discern the difference internally. these types are mapped to type_subdocument before being passed into the implementation of the content policy and should not be used outside gecko code. type_refresh 8 indicates a timed refresh. shouldload() will never get ...
...nt policy implementations, and should not be used outside gecko core code. type_internal_frame 28 an internal constant used to represent content loaded from <frame> elements. important: this type is mapped to type_subdocument before being passed to content policy implementations, and should not be used outside gecko core code. type_internal_iframe 29 an internal constant used to represent content loaded from <iframe> elements. important: this type is mapped to type_subdocument before being passed to content policy implementations, and should not be used outside gecko core code. type_internal_audio 30 an internal constant used to represent content loaded from <audio> elements. impo...

-ms-flow-into - Archive of obsolete content
no container has been specified. <custom-ident> the name of the region container. ...
...no container has been specified. <custom-ident> the name of the region container. ...

Index - MDN Web Docs Glossary: Definitions of Web-related terms
er is a program that retrieves and displays pages from the web, and lets users access further pages through hyperlinks. a browser is the most familiar type of user agent. 43 browsing context glossary a browsing context is the environment a browser displays a document. in modern browsers, it usually is a tab, but can be a window or even only parts of a page, like a frame or an iframe. 44 bézier curve bézier curve, glossary, graphics, reference a bézier curve (pronounced [bezje]) is a mathematically described curve used in computer graphics and animation. in vector images, they are used to model smooth curves that can be scaled indefinitely. 45 cdn glossary, infrastructure a cdn (content delivery network) is a group of servers sprea...
...7 caret cursor, glossary, input, caret, insertion point, text cursor, text entry, text input, text insertion point a caret (sometimes called a "text cursor") is an indicator displayed on the screen to indicate where text input will be inserted. 518 document environment codingscripting, glossary, javascript when the javascript global environment is a window or an iframe, it is called a document environment. a global environment is an environment that doesn't have an outer environment. 519 firewall ddos, firewall, glossary, security, computer network a firewall is a system that filters network traffic. it can either let it pass or block it, according to some specified rules. for example, it can block incoming connections aimed at a certain p...

Multimedia and Embedding - Learn web development
otating it with captions using <figure>, and how it relates to css background images. video and audio content next, we'll look at how to use the html5 <video> and <audio> elements to embed video and audio on our pages, including basics, providing access to different file formats to different browsers, adding captions and subtitles, and how to add fallbacks for older browsers. ...
...ges, including basics, providing access to different file formats to different browsers, adding captions and subtitles, and how to add fallbacks for older browsers. from <object> to <iframe> — other embedding technologies at this point we'd like to take somewhat of a sideways step, looking at a couple of elements that allow you to embed a wide variety of content types into your webpages: the <iframe>, <embed> and <object> elements. <iframe>s are for embedding other web pages, and the other two allow you to embed pdfs, svg, and even flash — a technology on its way out, but which you may still see semi-regularly. adding vector graphics to the web vector graphics can be very useful in certain situations. unlike regular formats like png/jpg, they don't distort/pixelate when zoomed in — the...

mozbrowseraudioplaybackchange
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowseraudioplaybackchange event is fired when audio starts or stops playing within a browser <iframe>. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbl...
... the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only boolean indicates whether audio is playing in the browser. ...

mozbrowserdocumentfirstpaint
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserdocumentfirstpaint event is fired when a new paint occurs on any document in the browser <iframe>. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the event target (the topmost target in the dom tree). type read only domstring the type of event. bubbles read only boolean...
...escription target read only eventtarget the event target (the topmost target in the dom tree). type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. ...

mozbrowsererror
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowsererror event is fired when an error occurs while trying to load content within a browser <iframe>. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbl...
...terrupt nettimeout cspblocked phishingblocked malwareblocked unwantedblocked offline malformeduri redirectloop unknownsockettype netreset notcached isprinting deniedportaccess proxyresolvefailure proxyconnectfailure contentencodingfailure remotexul unsafecontenttype corruptedcontenterror certerror other example var browser = document.queryselector("iframe"); browser.addeventlistener("mozbrowsererror", function( event ) { console.log("an error occurred:" + event.detail); }); related events mozbrowserasyncscroll mozbrowserclose mozbrowsercontextmenu mozbrowsericonchange mozbrowserloadend mozbrowserloadstart mozbrowserlocationchange mozbrowseropenwindow mozbrowsersecuritychange mozbrowsershowmodalprompt mozbrowsertitlechange mozbrow...

mozbrowserfirstpaint
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserfirstpaint event is fired when the <iframe> paints content for the first time (this doesn't include the initial paint from about:blank). general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the event target (the topmost target in the dom tree). type read only domstring the type of event...
...escription target read only eventtarget the event target (the topmost target in the dom tree). type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. ...

mozbrowsericonchange
feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowsericonchange event is sent when a new icon (e.g. <link rel="icon"> or <link rel="apple-touch-icon">) is available in the browser <iframe>'s content. it will be fired once for each icon available. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles...
... the following properties: href a domstring representing the path to the new icon. sizes a domstring listing the sizes the new icon is available in, e.g. "16x16" or "16x16 32x32". the any keyword can also be used, to represent "any size." rel a domstring representing the rel attribute value from the <link> element used to link to the icon. ...

mozbrowserlocationchange
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserlocationchange event is fired when a browser <iframe>'s location changes — it is fired every time navigation occurs. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether th...
...on. cangoback a boolean that defines whether it's possible to go back in the navigation history (true) or not (false). cangoforward a boolean that defines whether it's possible to go forward in the navigation history (true) or not (false). example this example updates the url bar so that it will always display the correct url for the current location. ...

mozbrowsermetachange
for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowsermetachange event is fired when a <meta> element related to web applications is added, removed or changed. see below for the applicable types. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read ...
...g the <meta> content attribute value, i.e. the content of the meta tag. type a domstring representing the type of meta change that this event object represents. this can be added, changed, removed, or undefined. lang optional a domstring representing the <meta> name attribute value, if included. if not included, the value returned is undefined. example var browser = document.queryselector("iframe"); browser.addeventlistener("mozbrowsermetachange", function(event) { console.log("a meta tag has been " + event.details.type + ". its name is " + event.details.name + ", and its content is " + event.details.content + "."); }); related events mozbrowserasyncscroll mozbrowsercontextmenu mozbrowsererror mozbrowsericonchange mozbrowserloadend mozbrowserloadstart mozbrowserlocationchan...

mozbrowseropensearch
large incompatibilities between implementations and the behavior may change in the future. the mozbrowseropensearch event is fired when a link to a search engine is found — i.e. when an instance of <link rel="search" type="application/opensearchdescription+xml"> is encountered. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read ...
...only boolean whether the event is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: title a domstring representing the title of the search engine. href a domstring representing url of the search engine. ...

mozbrowserscrollviewchange
on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowserscrollviewchange event is fired when asynchronous scrolling (i.e. apcz) starts or stops. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read ...
...y boolean whether the event is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: state a domstring representing the current state of scrolling in the viewport — available values are started and stopped. ...

mozbrowsersecuritychange
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowsersecuritychange event is fired when the browser <iframe> has connected to the server, and when the mixed content state changes. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean wh...
...tendedvalidation a boolean indicating if the current ssl certificate is an extended validation certificate (true) or not (false). trackingcontent a boolean indicating if tracking content is present on the current page (true) or not (false). mixedcontent a boolean indicating if mixed content is present on the current page (true) or not (false). ...

mozbrowsertitlechange
non-standard this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. the mozbrowsertitlechange event is fired when the title of a browser <iframe> (i.e. the contents of the <title> element) changes. general info specification non standard interface customevent bubbles yes cancelable yes target <iframe> default action none properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the ...
...read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. detail read only string the title of the document. ...

Midas
teditable attribute; starting with firefox 3, gecko also supports contenteditable. once midas is invoked, a few more methods of the document object become available. you can try demo of this here. properties document.designmode by setting this property to "on", the document becomes editable. notes since an entire document becomes editable, authors often load the editable document into an iframe and do the bulk of the scripting in the parent document. according to standards, the iframe element has the contentdocument property that refers to the document in the inline frame. it also has a property called contentwindow that refers to the window object inside the inline frame. this also avoids problems with bug 198155. in addition to the built-in commands, advanced editing can be done by m...
...s also avoids problems with bug 198155. in addition to the built-in commands, advanced editing can be done by manipulating the selection and range objects. it is beneficial to be familiar with these objects when working with an editable document. examples this example shows the basic structure described in the notes section : <html> <head> <title>simple edit box</title> </head> <body> <iframe id="midasform" src="about:blank" onload="this.contentdocument.designmode='on';" ></iframe> </body> </html> methods document.execcommand executes the given command. document.querycommandenabled determines whether the given command can be executed on the document in its current state. document.querycommandindeterm determines whether the current selection is in an indetermined ...

GCIntegration - SpiderMonkey Redirect 1
wrapper map. now, on to the details... gc/cc interaction <to be done later.> incremental gc incremental gc divides gc marking into time slices. in between these slices, non-gc code is allowed to run. done naively, this technique can lead to reachable object not being marked. consider the following example. {{ svg{source: "http://people.mozilla.org/~wmccloskey/incremental1.svg", embedding: "iframe", height:"130"} }} assume object b is already marked, as in the leftmost frame, while objects a and c have not been marked yet. in the middle frame some code creates a pointer from b to c and destroys the pointer from a to c. in the last frame, a gets marked by the gc. the problem is that c is never marked even though it's reachable. this will likely lead to a crash if c is accessed via b. writ...
...ed during gc. at the end of the gc, if the pointer refers to an object that is not reachable via some other path, then it will be nulled out or dropped in some way. if the object is still reachable, then the pointer will be left alone. to see how weak pointers can cause trouble, consider the following situation: {{ svg{source: "http://people.mozilla.org/~wmccloskey/incremental2.svg", embedding: "iframe", height:"130"} }} in the left frame, a has a weak pointer to c. assume that an incremental gc has already started, and a and b have been marked. c was not marked by a because weak pointers are not traced. now let's assume, between the left and right frames, that some code has read the weak pointer to c and then created a regular (strong) reference from b to c. now c is reachable, but it won't b...

imgIContainer
d long index); obsolete since gecko 1.9.2 void getframecolormap(in unsigned long framenumber, [array, size_is(palettelength)] out pruint32 palettedata, out unsigned long palettelength); obsolete since gecko 2.0 unsigned long getframeimagedatalength(in unsigned long framenumber); obsolete since gecko 2.0 imagecontainer getimagecontainer(); native code only! ...
...ining the current frame. only valid for raster type images. imagecontainer getimagecontainer(); parameters none. return value missing description exceptions thrown missing exception missing description violates the xpcom interface guidelines getrootlayoutframe() if this image is type_vector, that is really an embedded svg document, and this method returns a pointer to the root nsiframe of that document. if not (or if the root nsiframe is not available for some reason), this method returns nsnull. "notxpcom" for convenience, since we have no need for nsresult return-val. nsiframe getrootlayoutframe(); parameters none. return value missing description exceptions thrown missing exception missing description violates the xpcom interface guidelines gettype() direct...

nsIAccessibilityService
cessible createrootaccessible(in nsipresshell ashell, in nsidocument adocument); nsiaccessible createhtml4buttonaccessible(in nsisupports aframe); nsiaccessible createhypertextaccessible(in nsisupports aframe); nsiaccessible createhtmlbraccessible(in nsisupports aframe); nsiaccessible createhtmlbuttonaccessible(in nsisupports aframe); nsiaccessible createhtmlaccessiblebymarkup(in nsiframe aframe, in nsiweakreference aweakshell, in nsidomnode adomnode); nsiaccessible createhtmlliaccessible(in nsisupports aframe, in nsisupports abulletframe, in astring abullettext); nsiaccessible createhtmlcheckboxaccessible(in nsisupports aframe); nsiaccessible createhtmlcomboboxaccessible(in nsidomnode anode, in nsiweakreference apresshell); nsiaccessible createhtmlgenericaccessible(in...
...; nsiaccessible createhtmltableheadaccessible(in nsidomnode adomnode); nsiaccessible createhtmltextaccessible(in nsisupports aframe); nsiaccessible createhtmltextfieldaccessible(in nsisupports aframe); nsiaccessible createhtmlcaptionaccessible(in nsisupports aframe); nsiaccessible getaccessible(in nsidomnode anode, in nsipresshell apresshell, in nsiweakreference aweakshell, inout nsiframe framehint, out boolean aishidden); nsiaccessible addnativerootaccessible(in voidptr aatkaccessible); void removenativerootaccessible(in nsiaccessible arootaccessible); void invalidatesubtreefor(in nsipresshell apresshell, in nsicontent achangedcontent, in pruint32 aevent); methods removenativerootaccessible() void removenativerootaccessible( in nsiaccessible arootaccessible ...

nsIAccessibleRole
reen contents of containers advertising this role. should be used for warning dialogs, etc. the role is used by xul:browsermessage, role="alert", xforms:message. role_window 9 represents the window frame, which contains child objects such as a title bar, client, and other objects contained in a window. the role is supported automatically by ms windows. role_internal_frame 10 a sub-document or iframe. role_menupopup 11 represents a menu, which presents a list of options from which the user can make a selection to perform an action. it is used for role="menu". role_menuitem 12 represents a menu item, which is an entry in a menu that a user can choose to carry out a command, select an option. it is used for xul:menuitem, role="menuitem". role_tooltip 13 represents a tooltip that provides ...
...lication window. it is used for role="document". role_pane 16 represents a pane within a frame or document window. users can navigate between panes and within the contents of the current pane, but cannot navigate between items in different panes. thus, panes represent a level of grouping lower than frame windows or documents, but above individual controls. it is used for the first child of a or iframe. role_chart 17 represents a graphical image used to represent data. role_dialog 18 represents a dialog box or message box. it is used for xul:dialog, role="dialog". role_border 19 represents a window border. role_grouping 20 logically groups other objects. there is not always a parent-child relationship between the grouping object and the objects it contains. it is used for html:textfield...

nsIContentView
support for using this api for all scrollable elements is coming; see bug 618975 for details. ...
...crollable content view whose contents are actually drawn by a separate process; this is part of the electrolysis multi-process support framework. 1.0 66 introduced gecko 2.0 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) see working with content views for details on how to use this api. note: currently, only <frame> and <iframe> elements are handled as content views. support for using this api for all scrollable elements is coming; see bug 618975 for details. method overview void scrollby(in float dxpx, in float dypx); void scrollto(in float xpx, in float ypx); void setscale(in float xscale, in float yscale); attributes attribute type description contentheight...

nsIContentViewManager
see getting access to content views for details. once you have the view manager, you can call getcontentviewsin() to get a list of the content views for a given portion of the browser display, then use those nsicontentview objects to manipulate the content views. ...
...see getting access to content views for details. once you have the view manager, you can call getcontentviewsin() to get a list of the content views for a given portion of the browser display, then use those nsicontentview objects to manipulate the content views. ...

nsISelectionPrivate
cko 35 (firefox 35 / thunderbird 35 / seamonkey 2.32) warning: the content of this article may be out of date. this page wasn't updated since the initial import in 2011. see the idl file linked above for up-to-date information. ...
...selectionlistener() void addselectionlistener( in nsiselectionlistener newlistener ); parameters newlistener endbatchchanges() will resume user interface updates after a previous call to startbatchchanges(). void endbatchchanges(); parameters none. native code only!getcachedframeoffset returns cached value for nstextframe::getpointfromoffset. void getcachedframeoffset( in nsiframe aframe, in print32 inoffset, in nspointref apoint ); parameters aframe inoffset apoint getenumerator() nsienumerator getenumerator(); parameters none. return value native code only!getframeselection nsframeselection getframeselection(); parameters none. return value a reference to the frame selection associated with this selection. getrangesforinterval() re...

nsIWindowWatcher
he parent window, if any. null if no parent. if it is impossible to get to an nsiwebbrowserchrome from aparent, this method will effectively act as if aparent were null. aurl the url to open in the new window. must already be escaped, if applicable. can be null. aname a window name assigned using window interface's open() method loads the specified resource into the browsing context (window, <iframe> or tab) with the specified name. if the name doesn't exist, then a new window is opened and the specified resource is loaded into its browsing context.">window.open. can be null. if a window with this name already exists, the openwindow call may just load aurl in it (if aurl is not null) and return it. afeatures window features. see window interface's open() method loads the specified resource...
... the name doesn't exist, then a new window is opened and the specified resource is loaded into its browsing context.">window.open. can be null. if a window with this name already exists, the openwindow call may just load aurl in it (if aurl is not null) and return it. afeatures window features. see window interface's open() method loads the specified resource into the browsing context (window, <iframe> or tab) with the specified name. if the name doesn't exist, then a new window is opened and the specified resource is loaded into its browsing context.">window.open for details. can be null. list of feature options aarguments extra argument(s) to be attached to the new window as the window.arguments property. an nsisupportsarray will be unwound into multiple arguments (but not recursively!). c...

XPCOM Interface Reference
inknsifactorynsifavicondatacallbacknsifaviconservicensifeednsifeedcontainernsifeedelementbasensifeedentrynsifeedgeneratornsifeedpersonnsifeedprocessornsifeedprogresslistenernsifeedresultnsifeedresultlistenernsifeedtextconstructnsifilensifileinputstreamnsifileoutputstreamnsifilepickernsifileprotocolhandlernsifilespecnsifilestreamsnsifileurlnsifileutilitiesnsifileviewnsifocusmanagernsiformhistory2nsiframeloadernsiframeloaderownernsiframemessagelistenernsiframemessagemanagernsiframescriptloadernsigsettingscollectionnsigsettingsservicensigeolocationprovidernsigeolocationupdatensiglobalhistorynsiglobalhistory2nsiglobalhistory3nsihtmleditornsihttpheaderlistenernsihapticfeedbacknsihttpactivitydistributornsihttpactivityobservernsihttpchannelnsihttpchannelinternalnsihttpheadervisitornsihttpservernsihttpu...
...amemessagelistenernsiframemessagemanagernsiframescriptloadernsigsettingscollectionnsigsettingsservicensigeolocationprovidernsigeolocationupdatensiglobalhistorynsiglobalhistory2nsiglobalhistory3nsihtmleditornsihttpheaderlistenernsihapticfeedbacknsihttpactivitydistributornsihttpactivityobservernsihttpchannelnsihttpchannelinternalnsihttpheadervisitornsihttpservernsihttpupgradelistenernsiidnservicensiiframeboxobjectnsiiniparsernsiiniparserfactorynsiiniparserwriternsiioservicensiidleservicensiinprocesscontentframemessagemanagernsiinputstreamnsiinputstreamcallbacknsiinstalllocationnsiinterfacerequestornsijscidnsijsidnsijsiidnsijsonnsijetpacknsijetpackservicensijumplistbuildernsijumplistitemnsilivemarkservicensiloadgroupnsilocalfilensilocalfilemacnsilocalensilocaleservicensilogininfonsiloginmanagernsil...

Blocking By Domain - Plugins
as specified by the html standard. plugin detection mechanisms such as navigator.mimetypes and navigator.plugins will also behave as if the plugin were not installed. there are two versions of plugin blocking: first-party plugin blocking list sites on this list may not use plugins. ...
...sites in this category may include advertisers, social media sites, and other utilities. top sites many popular sites work properly without plugins, but still prompt users for activation. ...

Index - Firefox Developer Tools
ript code rather than just web pages like the normal toolbox. the browser toolbox's context is the whole browser rather than just single page on a single tab. 16 dom property viewer dom, tools, web development the dom property viewer lets you inspect the properties of the dom as an expandable tree structure, starting from the window object of the current page or the selected iframe. 17 debugger-api debugger, intermediate, intro, javascript, tools mozilla’s javascript engine, spidermonkey, provides a debugging interface named debugger which lets javascript code observe and manipulate the execution of other javascript code. both firefox’s built-in developer tools and the firebug add-on use debugger to implement their javascript debuggers. however, deb...
...t happen in the tab. for communication between the server and the client we use the remote debugging protocol. this architecture allows you to connect a web console client instance to a server running on b2g, fennec or some other firefox instance. 155 web console keyboard shortcuts these shortcuts apply when you're in the command line interpreter. 156 working with iframes debugging, devtools, developer tools, frames, tools you can point the developer tools at a specific iframe within a document. 157 about:debugging debugger, remote debugging, about:debugging the about:debugging page provides a single place from which you can attach the firefox developer tools to a number of debugging targets. at the moment it supports three main sor...

Storage Inspector - Firefox Developer Tools
the storage inspector enables you to inspect various types of storage that a web page can use. currently it can be used to inspect the following storage types: cache storage — any dom caches created using the cache api. cookies — all the cookies created by the page or any iframes inside of the page. cookies created as a part of response of network calls are also listed, but only for calls that happened while the tool is open. indexeddb — all indexeddb databases created by the page or any iframes inside the page, their object stores and the items stored in these object stores. local storage — all local storage items created by the page or any iframes inside the page. session storage — all session storage items created by the page or any iframes inside the page. for the time be...
...che: indexeddb objects are organized by origin, then by database name, then by object store name: with the cookies, local storage, and session storage types, there's only one level in the hierarchy, so stored items are listed directly under each origin: you can click on each item in the tree to expand or collapse its children. the tree is live, so if a new origin gets added (by adding an iframe, for example), it will be added to each storage type automatically. clicking on a tree item will display detailed information about that item in the table widget on the right. for example, clicking on an origin which is a child of the cookies storage type will show all the cookies belonging to that domain. table widget the table widget displays a list of all the items corresponding to the sele...

Firefox Developer Tools
he firefox developer tools from the menu by selecting tools > web developer > toggle tools or use the keyboard shortcut ctrl + shift + i or f12 on windows and linux, or cmd + opt + i on macos. the ellipsis menu on the right-hand side of developer tools contains several commands that let you perform actions or change tool settings. this button only appears when there are multiple iframes on a page. click it to display a list of the iframes on the current page and select the one with which you want to work. click this button to take a screenshot of the current page. (note: this feature is not turned on by default and must be enabled in settings before the icon will appear.) toggles responsive design mode. opens the menu that includes docking...
...by the currently active tab. but you can attach the tools to a variety of other targets, too, both within the current browser and in different browsers or even different devices. about:debugging debug add-ons, content tabs, and workers running in the browser. connecting to firefox for android connect the developer tools to an instance of firefox running on an android device. connecting to iframes connect the developer tools to a specific iframe in the current page. connecting to other browsers connect the developer tools to chrome on android and safari on ios. debugging the browser by default, the developer tools are attached to a web page or web app. but you can also connect them to the browser as a whole. this is useful for browser and add-on development. browser console se...

CanvasRenderingContext2D.drawWindow() - Web APIs
fore the window is rendered into it. this color may be transparent/translucent. it is given as a css color string (for example, rgb() or rgba()). notes: if "rgba(0,0,0,0)" is used for the background color, the drawing will be transparent wherever the window is transparent. top-level browsed documents are usually not transparent because the user's background-color preference is applied, but iframes are transparent if the page doesn't set a background. if an opaque color is used for the background color, rendering will be faster because we won't have to compute the window's transparency. flags optional used to better control the drawwindow call. flags can be ored together. constant value description drawwindow_draw_caret 0x01 show the caret i...
...255,255,0)" as the color, the contents would be drawn with a transparent background (which would be slower). it is usually a bad idea to use any background other than pure white "rgb(255,255,255)" or transparent, as this is what all browsers do, and many websites expect that transparent parts of their interface will be drawn on white background. with this method, it is possible to fill a hidden iframe with arbitrary content (e.g., css-styled html text, or svg) and draw it into a canvas. it will be scaled, rotated and so on according to the current transformation. ted mielczarek's tab preview extension uses this technique in chrome to provide thumbnails of web pages, and the source is available for reference. specifications not part of any current specification or draft. this is a non-standa...

DOMImplementation.createHTMLDocument() - Web APIs
the domimplementation.createhtmldocument() method creates a new html document. syntax const newdoc = document.implementation.createhtmldocument(title) parameters title optional (except in ie) a domstring containing the title to give the new html document. example this example creates a new html document and inserts it into an <iframe> in the current document. ...
...n.createhtmldocument(title) parameters title optional (except in ie) a domstring containing the title to give the new html document. example this example creates a new html document and inserts it into an <iframe> in the current document. ...

Document.importNode() - Web APIs
.3), the console warns developers not to omit the argument. starting with gecko 29.0 (firefox 29 / thunderbird 29 / seamonkey 2.26)), a shallow clone is defaulted instead of a deep clone. return value the copied importednode in the scope of the importing document. ...
...not to omit the argument. starting with gecko 29.0 (firefox 29 / thunderbird 29 / seamonkey 2.26)), a shallow clone is defaulted instead of a deep clone. return value the copied importednode in the scope of the importing document. note: importednode's node.parentnode is null, since it has not yet been inserted into the document tree! example const iframe = document.queryselector("iframe"); const oldnode = iframe.contentwindow.document.getelementbyid("mynode"); const newnode = document.importnode(oldnode, true); document.getelementbyid("container").appendchild(newnode); notes before they can be inserted into the current document, nodes from external documents should either be: cloned using document.importnode(); or adopted using document.adoptnode(). best practice: alth...

Document.querySelectorAll() - Web APIs
= document.queryselectorall("div.note, div.alert"); here, we get a list of <p> elements whose immediate parent element is a <div> with the class highlighted and which are located inside a container whose id is test. ...
...ment is a <div> with the class highlighted and which are located inside a container whose id is test. ...

Element.querySelectorAll() - Web APIs
yselectorall("div.note, div.alert"); here, we get a list of the document's <p> elements whose immediate parent element is a div with the class "highlighted" and which are located inside a container whose id is "test". ...
...nt is a div with the class "highlighted" and which are located inside a container whose id is "test". ...

Cross-global fetch usage - Web APIs
this article explains an edge case that occurs with fetch (and potentially other apis exhibiting the same kind of resource retrieval behavior). when a cross-origin fetch involving a relative url is initiated from an <iframe>, the relative url used to be resolved against the current global location, rather than the iframe's location. the edge case many sites will never comes up against this edge case. to see it: you need a same-origin iframe that same-origin iframe needs to have a location with a different base url you have to use the fetch function cross-global, e.g. frame.contentwindow.fetch() the url passed to fetch needs to be relative the problem in the past we would resolve the relative url against the current global, for example: let absolute = new url(relative, window.locatio...
...h. it is just that different apis that exhibit this kind of behavior were doing it inconsistently with the behavior defined in the spec, which could lead to problems further down the line. the solution in firefox 60 onwards, mozilla resolves the relative url against the global that owns the fetch() function being used (see bug 1432272). so in the case described above, it is resolved against the iframe's location: let absolute = new url(relative, frame.contentwindow.location.href) there is a lot of discussion in progress about getting new specs to align with this behavior change, to mitigate potential problems going forward. ...

Using files from web applications - Web APIs
style="margin:30px; width:500px; height:300px; border:1px dotted grey;">drag & drop your file here...</div> </div> </body> </html> example: using object urls to display pdf object urls can be used for other things than just images! they can be used to display embedded pdf files or any other resources that can be displayed by the browser. ...
... </div> </body> </html> example: using object urls to display pdf object urls can be used for other things than just images! they can be used to display embedded pdf files or any other resources that can be displayed by the browser. in firefox, to have the pdf appear embedded in the iframe (rather than proposed as a downloaded file), the preference pdfjs.disabled must be set to false . <iframe id="viewer"> and here is the change of the src attribute: const obj_url = url.createobjecturl(blob); const iframe = document.getelementbyid('viewer'); iframe.setattribute('src', obj_url); url.revokeobjecturl(obj_url); example: using object urls with other file types you can manipulate files of other formats the same way. here is how to preview uploaded video: const video = document.geteleme...

Fullscreen API - Web APIs
ed preference (needs to be set to true). to change preferences in firefox, visit about:config. no support 9 — 65notes alternate name notes before firefox 44, firefox incorrectly allowed elements inside a <frame> or <object> element to request, and to be granted, fullscreen. ...
...enabled preference (needs to be set to true). to change preferences in firefox, visit about:config. no support 9 — 65notes alternate name notes before firefox 44, firefox incorrectly allowed elements inside a <frame> or an <object> to request, and to be granted, fullscreen. ...

MessageChannel() - Web APIs
) constructor of the messagechannel interface returns a new messagechannel object with two new messageport objects. note: this feature is available in web workers. syntax var channel = new messagechannel(); returns a newly created messagechannel object. example in the following code block, you can see a new channel being created using the messagechannel.messagechannel constructor. when the iframe has loaded, we pass port2 to the iframe using messageport.postmessage along with a message. the handlemessage handler then responds to a message being sent back from the iframe (using messageport.onmessage), putting it into a paragraph. messagechannel.port1 is listened to, to check when the message arrives. var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = do...
...ort2 to the iframe using messageport.postmessage along with a message. the handlemessage handler then responds to a message being sent back from the iframe (using messageport.onmessage), putting it into a paragraph. messagechannel.port1 is listened to, to check when the message arrives. var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = document.queryselector('iframe'); var otherwindow = ifr.contentwindow; ifr.addeventlistener("load", iframeloaded, false); function iframeloaded() { otherwindow.postmessage('hello from the main page!', '*', [channel.port2]); } channel.port1.onmessage = handlemessage; function handlemessage(e) { para.innerhtml = e.data; } for a full working example, see our channel messaging basic demo on github (run it live too). sp...

MessageChannel.port2 - Web APIs
nnel, which the message is initially sent to. note: this feature is available in web workers. syntax channel.port2; value a messageport object representing the second port of the channel, the port attached to the context at the other end of the channel. example in the following code block, you can see a new channel being created using the messagechannel.messagechannel constructor. when the iframe has loaded, we pass port2 to the iframe using messageport.postmessage along with a message. the handlemessage handler then responds to a message being sent back from the iframe (using messageport.onmessage), putting it into a paragraph. messagechannel.port1 is listened to, to check when the message arrives. var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = do...
...ort2 to the iframe using messageport.postmessage along with a message. the handlemessage handler then responds to a message being sent back from the iframe (using messageport.onmessage), putting it into a paragraph. messagechannel.port1 is listened to, to check when the message arrives. var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = document.queryselector('iframe'); var otherwindow = ifr.contentwindow; ifr.addeventlistener("load", iframeloaded, false); function iframeloaded() { otherwindow.postmessage('hello from the main page!', '*', [channel.port2]); } channel.port1.onmessage = handlemessage; function handlemessage(e) { para.innerhtml = e.data; } for a full working example, see our channel messaging basic demo on github (run it live too). sp...

MessagePort.onmessage - Web APIs
e messageport interface is an eventlistener, called whenever an messageevent of type message is fired on the port — that is, when the port receives a message. note: this feature is available in web workers. syntax channel.onmessage = function() { ... }; example in the following code block, you can see a new channel being created using the messagechannel.messagechannel constructor. when the iframe has loaded, we pass messagechannel.port2 to the iframe using messageport.postmessage along with a message. the handlemessage handler then responds to a message being sent back from the iframe using onmessage, putting it into a paragraph — messagechannel.port1 is listened to, to check when the message arrives. var channel = new messagechannel(); var para = document.queryselector('p'); var ifr ...
...gechannel.port2 to the iframe using messageport.postmessage along with a message. the handlemessage handler then responds to a message being sent back from the iframe using onmessage, putting it into a paragraph — messagechannel.port1 is listened to, to check when the message arrives. var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = document.queryselector('iframe'); var otherwindow = ifr.contentwindow; ifr.addeventlistener("load", iframeloaded, false); function iframeloaded() { otherwindow.postmessage('hello from the main page!', '*', [channel.port2]); } channel.port1.onmessage = handlemessage; function handlemessage(e) { para.innerhtml = e.data; } for a full working example, see our channel messaging basic demo on github (run it live too). sp...

MessagePort.postMessage() - Web APIs
type. multiple data items can be sent as an array. transferlist optional transferable objects to be transferred — these objects have their ownership transferred to the receiving browsing context, so are no longer usable by the sending browsing context. example in the following code block, you can see a new channel being created using the messagechannel.messagechannel constructor. when the iframe has loaded, we pass messagechannel.port2 to the iframe using window.postmessage along with a message. the handlemessage handler then responds to a message being sent back from the iframe using onmessage, putting it into a paragraph — messagechannel.port1 is listened to, to check when the message arrives. var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = doc...
...messagechannel.port2 to the iframe using window.postmessage along with a message. the handlemessage handler then responds to a message being sent back from the iframe using onmessage, putting it into a paragraph — messagechannel.port1 is listened to, to check when the message arrives. var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = document.queryselector('iframe'); var otherwindow = ifr.contentwindow; ifr.addeventlistener("load", iframeloaded, false); function iframeloaded() { otherwindow.postmessage('hello from the main page!', '*', [channel.port2]); } channel.port1.onmessage = handlemessage; function handlemessage(e) { para.innerhtml = e.data; } for a full working example, see our channel messaging basic demo on github (run it live too). sp...

Using Navigation Timing - Web APIs
which the navigation whose timing was recorded began (performance.timing.navigationstart), and outputs that information to the screen by inserting it into an element. html <div class="output"> </div> css .output { border: 1px solid #bbb; font: 16px "open sans", "helvetica", "arial", sans-serif; } in tandem with appropriate html and css, the result is: the values listed are for the <iframe> in which the sample is presented above. for a list of the available timing values you can look for in performancetiming, see the performancetiming interface's properties section. determining navigation type to put the timing information obtained from performancetiming into the correct perspective, you need to know more about what sort of load operation occurred. in particular, you need to kno...
...ance.navigation.redirectcount. this information is output to the screen just like the page load time was previously: by inserting it into the element with class "output". html <div class="output"> </div> css .output { border: 1px solid #bbb; font: 16px "open sans", "helvetica", "arial", sans-serif; } with this code in place, the result looks like this: the values listed are for the <iframe> in which the sample is presented. ...

Page Visibility API - Web APIs
differently. for example, if your web app is playing a video, it can pause the video when the user puts the tab into the background, and resume playback when the user returns to the tab. the user doesn't lose their place in the video, the video's soundtrack doesn't interfere with audio in the new foreground tab, and the user doesn't miss any of the video in the meantime. visibility states of an <iframe> are the same as the parent document. hiding an <iframe> using css properties (such as display: none;) doesn't trigger visibility events or change the state of the document contained within the frame. use cases let's consider a few use cases for the page visibility api. a site has an image carousel that shouldn't advance to the next slide unless the user is viewing the page an application s...
...r switches tabs or minimizes the browser window containing the tab. policies in place to aid background page performance separately from the page visibility api, user agents typically have a number of policies in place to mitigate the performance impact of background or hidden tabs. these may include: most browsers stop sending requestanimationframe() callbacks to background tabs or hidden <iframe>s in order to improve performance and battery life. timers such as settimeout() are throttled in background/inactive tabs to help improve performance. see reasons for delays longer than specified for more details. budget-based background timeout throttling is now available in modern browsers (firefox 58+, chrome 57+), placing an additional limit on background timer cpu usage. this operates in a...

ParentNode.querySelectorAll() - Web APIs
= document.queryselectorall("div.note, div.alert"); here, we get a list of <p> elements whose immediate parent element is a <div> with the class highlighted and which are located inside a container whose id is test. ...
...ment is a <div> with the class highlighted and which are located inside a container whose id is test. ...

Request.context - Web APIs
note: you can find a full list of the different available contexts including associated context frame types, csp directives, and platform feature examples in the fetch spec request context section. ...
... note: you can find a full list of the different available contexts including associated context frame types, csp directives, and platform feature examples in the fetch spec request context section. syntax var mycontext = request.context; value a requestcontext value. ...

Selection - Web APIs
ere you released the mouse button. anchor and focus should not be confused with the start and end positions of a selection. the anchor can be placed before the focus or vice-versa, depending on the direction you made your selection. properties selection.anchornoderead only returns the node in which the selection begins. can return null if selection never existed in the document (e.g., an iframe that was never clicked on). selection.anchoroffsetread only returns a number representing the offset of the selection's anchor within the anchornode. if anchornode is a text node, this is the number of characters within anchornode preceding the anchor. if anchornode is an element, this is the number of child nodes of the anchornode preceding the anchor. selection.focusnoderead only returns ...
...tion's anchor within the anchornode. if anchornode is a text node, this is the number of characters within anchornode preceding the anchor. if anchornode is an element, this is the number of child nodes of the anchornode preceding the anchor. selection.focusnoderead only returns the node in which the selection ends. can return null if selection never existed in the document (for example, in an iframe that was never clicked on). selection.focusoffsetread only returns a number representing the offset of the selection's anchor within the focusnode. if focusnode is a text node, this is the number of characters within focusnode preceding the focus. if focusnode is an element, this is the number of child nodes of the focusnode preceding the focus. selection.iscollapsedread only returns a bool...

TaskAttributionTiming - Web APIs
the taskattributiontiming interface of the long tasks api returns information about the work involved in a long task and its associate frame context. the frame context, also called the container, is the iframe, embed or object that is being implicated, on the whole, for a long task. <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a xlink:href="/docs/web/api/performanceentry" target="_top"><rect x="1" y="1" width="160" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="81" y="30" font-size="12px" font-family="consolas...
... taskattributiontiming.containersrc read only returns the container's src attribute. taskattributiontiming.containerid read only returns the container's id attribute. taskattributiontiming.containername read only returns the container's name attribute. specifications specification status comment long tasks api 1the definition of 'taskattributi...

Functions and classes available to Web Workers - Web APIs
38 (38) no support no support no support cache cache api provides the ability to programmatically control cache storage associated with current origin. (yes) no support 43 ? channel messaging api allows two separate scripts running in different browsing contexts attached to the same document...
...same origin (usually pages from the same site). 38 (38) no support no support no support cache cache api provides the ability to programmatically control cache storage associated with current origin. (yes) no support 43 ? channel messaging api allows two separate scripts running in different browsing contexts attached to the same document (e.g., two iframes, or the main document and an iframe, two documents via a sharedworker, or two workers) to communicate directly via two ports. 41 (41) (yes) (yes) (yes) console api provides access to the browser's debugging console (e.g., the web console in firefox). the specifics of how it works vary from browser to browser, but there is a de facto set of features that are typically prov...

Web Workers API - Web APIs
those workers are hosted within the same origin as the parent page. in addition, workers may use xmlhttprequest for network i/o, with the exception that the responsexml and channel attributes on xmlhttprequest always return null. in addition to dedicated workers, there are other types of worker: shared workers are workers that can be utilized by multiple scripts running in different windows, iframes, etc., as long as they are in the same domain as the worker. they are a little more complex than dedicated workers — scripts must communicate via an active port. see sharedworker for more details. serviceworkers essentially act as proxy servers that sit between web applications, the browser, and the network (when available). they are intended, among other things, to enable the creation of eff...
...properties and methods common to all kind of workers (i.e. worker or sharedworker). worker represents a running worker thread, allowing you to pass messages to the running worker code. workerlocation defines the absolute location of the script executed by the worker. sharedworker represents a specific kind of worker that can be accessed from several browsing contexts, being several windows, iframes or even workers. workerglobalscope represents the generic scope of any worker (doing the same job as window does for normal web content). different types of worker have scope objects that inherit from this interface and add more specific features. dedicatedworkerglobalscope represents the scope of a dedicated worker, inheriting from workerglobalscope and adding some dedicated features. shar...

Window.open() - Web APIs
the window interface's open() method loads the specified resource into the new or existing browsing context (window, <iframe> or tab) with the specified name. if the name doesn't exist, then a new browsing context is opened in a new tab or a new window, and the specified resource is loaded into it. syntax var window = window.open(url, windowname, [windowfeatures]); parameters url a domstring indicating the url of the resource to be loaded. this can be a path or url to an html page, image file, or any other resource that is supported by the browser. if the empty string ("") is specified as url, a blank page is opened into the targeted browsing context. ...
...dowfeatures]); parameters url a domstring indicating the url of the resource to be loaded. this can be a path or url to an html page, image file, or any other resource that is supported by the browser. if the empty string ("") is specified as url, a blank page is opened into the targeted browsing context. windowname optional a domstring specifying the name of the browsing context (window, <iframe> or tab) into which to load the specified resource; if the name doesn't indicate an existing context, a new window is created and is given the name specified by windowname. this name can be used as the target for the target attribute of <a> or <form> elements. the name should not contain whitespace. keep in mind that this will not be used as the window's title. windowfeatures optional a doms...

window.postMessage() - Web APIs
normally, scripts on different pages are allowed to access each other if and only if the pages they originate from share the same protocol, port number, and host (also known as the "same-origin policy"). window.postmessage() provides a controlled mechanism to securely circumvent this restriction (if used properly). ...
...message”) are exposed to the receiving window through the event object. syntax targetwindow.postmessage(message, targetorigin, [transfer]); targetwindow a reference to the window that will receive the message. methods for obtaining such a reference include: window.open (to spawn a new window and then reference it), window.opener (to reference the window that spawned this one), htmliframeelement.contentwindow (to reference an embedded <iframe> from its parent window), window.parent (to reference the parent window from within an embedded <iframe>), or window.frames + an index value (named or numeric). message data to be sent to the other window. the data is serialized using the structured clone algorithm. this means you can pass a broad variety of data objects safely to t...

ARIA Test Cases - Accessibility
if an item is focused within the list, this should be announced...
...if an item is focused within the list, this should be announced next, followed by an indication of this item's position within the list if the screen reader supports this in other lists as well. as focus moves within the list, t...

Replaced elements - CSS: Cascading Style Sheets
ent whose representation is outside the scope of css; they're external objects whose representation is independent of the css formatting model. put in simpler terms, they're elements whose contents are not affected by the current document's styles. the position of the replaced element can be affected using css, but not the contents of the replaced element itself. some replaced elements, such as <iframe> elements, may have stylesheets of their own, but they don't inherit the styles of the parent document. the only other impact css can have on a replaced element is that there are properties which support controlling the positioning of the element's content within its box. see controlling object position within the content box for further information. replaced elements typical replaced elements...
..., may have stylesheets of their own, but they don't inherit the styles of the parent document. the only other impact css can have on a replaced element is that there are properties which support controlling the positioning of the element's content within its box. see controlling object position within the content box for further information. replaced elements typical replaced elements are: <iframe> <video> <embed> <img> some elements are treated as replaced elements only in specific cases: <option> <audio> <canvas> <object> <applet> html spec also says that an <input> element can be replaced, because <input> elements of the "image" type are replaced elements similar to <img>. however, other form controls, including other types of <input> elements, are explicitly listed as non...

<frame> - HTML: Hypertext Markup Language
<frame> is an html element which defines a particular area in which another html document can be displayed. a frame should be used within a <frameset>. using the <frame> element is not encouraged because of certain disadvantages such as performance problems and lack of accessibility for users with screen readers. instead of the <frame> element, <iframe> may be preferred. attributes like all other html elements, this element supports the global attributes. src this attribute specifies the document that will be displayed by the frame. name this attribute is used for labeling frames. without labeling, every link will open in the frame that it’s in – the closest parent frame. see the target attribute for more information. noresize this attribute prevents resizing of frames by users...
...ecessary and "no" for forcing no scrollbar even when it is necessary. ...

HTML documentation index - HTML: Hypertext Markup Language
itemprop global attribute is used to add properties to an item. every html element can have an itemprop attribute specified, and an itemprop consists of a name-value pair. each name-value pair is called a property, and a group of one or more properties forms an item. property values are either a string or a url and can be associated with a very wide range of elements including <audio>, <embed>, <iframe>, <img>, <link>, <object>, <source> , <track>, and <video>. 23 itemref attribute, global attribute, html, html microdata, microdata, reference properties that are not descendants of an element with the itemscope attribute can be associated with an item using the global attribute itemref. 24 itemscope attribute, global attribute, html, html microdata, microdata,...
...che manifest that is downloaded in the early stages of page load. 114 <i>: the idiomatic text element element, html, html text-level semantics, reference, web, em the html idiomatic text element (<i>) represents a range of text that is set off from the normal text for some reason, such as idiomatic text, technical terms, taxonomical designations, among others. 115 <iframe>: the inline frame element content, element, embedded content, embedding, frames, html, html embedded content, inline frames, reference, web, embedded, iframe the html inline frame element (<iframe>) represents a nested browsing context, embedding another html page into the current one. 116 <image>: the obsolete image element element, html, html element reference, html re...

CSP: child-src - HTTP
for workers, non-compliant requests are treated as fatal network errors by the user agent. csp version 2 directive type fetch directive default-src fallback yes. if this directive is absent, the user agent will look for the default-src directive. ...
...clude the <script> or <style> tags and note that capitalization and whitespace matter, including leading or trailing whitespace. see unsafe inline script for an example. in csp 2.0 this applied only to inline scripts. csp 3.0 allows it in the case of script-src for external scripts. examples violation cases given this csp header: content-security-policy: child-src https://example.com/ this <iframe> and worker are blocked and won't load: <iframe src="https://not-example.com"></iframe> <script> var blockedworker = new worker("data:application/javascript,..."); </script> specifications specification status comment content security policy level 3the definition of 'child-src' in that specification. working draft no changes. content security policy le...

CSP: frame-ancestors - HTTP
setting this directive to 'none' is similar to x-frame-options: deny (which is also supported in older browsers). csp version 2 directive type navigation directive default-src fallback no. not setting this allows anything. this directive is not supported in the <meta> element. ...
...unding the host are not allowed. examples: http://*.example.com: matches all attempts to load from any subdomain of example.com using the http: url scheme. mail.example.com:443: matches all attempts to access port 443 on mail.example.com. https://store.example.com: matches all attempts to access store.example.com using https:. if no url scheme is specified for a host-source and the iframe is loaded from an https url, the url for the page loading the iframe must also be https, per the w3c spec on matching source expressions. <scheme-source> a scheme such as http: or https:. the colon is required and scheme should not be quoted. you can also specify data schemes (not recommended). data: allows data: uris to be used as a content source. this is insecure; an attacker can als...

CSP: frame-src - HTTP
csp version 1 directive type fetch directive fallback if this directive is absent, the user agent will look for the child-src directive (which falls back to the default-src directive). ...
... <script> or <style> tags and note that capitalization and whitespace matter, including leading or trailing whitespace. see unsafe inline script for an example. in csp 2.0 this applied only to inline scripts. csp 3.0 allows it in the case of script-src for external scripts. examples violation cases given this csp header: content-security-policy: frame-src https://example.com/ the following <iframe> is blocked and won't load: <iframe src="https://not-example.com/"></iframe> specifications specification status comment content security policy level 3the definition of 'frame-src' in that specification. working draft undeprecates frame-src. content security policy level 2the definition of 'frame-src' in that specification. recommendation depre...

CSP: sandbox - HTTP
it applies restrictions to a page's actions including preventing popups, preventing the execution of plugins and scripts, and enforcing a same-origin policy. csp version 1.1 / 2 directive type document directive this directive is not supported in the <meta> element or by the content-security-policy-report-only header field. ...
... keyword is not used, that functionality will silently fail. allow-popups-to-escape-sandbox allows a sandboxed document to open new windows without forcing the sandboxing flags upon them. this will allow, for example, a third-party advertisement to be safely sandboxed without forcing the same restrictions upon a landing page. allow-presentation allows embedders to have control over whether an iframe can start a presentation session. allow-same-origin allows the content to be treated as being from its normal origin. if this keyword is not used, the embedded content is treated as being from a unique origin. allow-scripts allows the page to run scripts (but not create pop-up windows). if this keyword is not used, this operation is not allowed. allow-storage-access-by-user-activation let...

Feature-Policy: accelerometer - HTTP
ntrols whether the current document is allowed to gather information about the acceleration of the device through the accelerometer interface. syntax feature-policy: accelerometer <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default value is 'self'. specifications specification status c...

Feature-Policy: ambient-light-sensor - HTTP
allowed to gather information about the amount of light in the environment around the device through the ambientlightsensor interface. syntax feature-policy: ambient-light-sensor <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default value is 'self'. specification specification status co...

Feature-Policy: autoplay - HTTP
<video> elements will be ignored. for more details on autoplay and autoplay blocking, see the article autoplay guide for media and web audio apis. syntax feature-policy: autoplay <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default value in google chrome is 'self'. specifications specificati...

Feature-Policy: battery - HTTP
ment is allowed to gather information about the acceleration of the device through the batterymanager interface obtained via navigator.getbattery(). syntax feature-policy: battery <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default value is 'self'. specifications specification status c...

Feature-Policy: camera - HTTP
owed to use video input devices. when this policy is enabled, the promise returned by mediadevices.getusermedia() will reject with a notallowederror. syntax feature-policy: camera <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default value is 'self'. specification specification status co...

Feature-Policy: display-capture - HTTP
n's contents. if display-capture is disabled in a document, the document will not be able to initiate screen capture via getdisplaymedia(). syntax feature-policy: display-capture <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default alowlist is 'self'. specifications specification status ...

Feature-Policy: document-domain - HTTP
ent.domain. when this policy is enabled, attempting to set document.domain will fail and cause a securityerror domexception to be be thrown. syntax feature-policy: document-domain <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default value is *. specifications specification status commen...

Feature-Policy: encrypted-media - HTTP
ns api (eme). when this policy is enabled, the promise returned by navigator.requestmediakeysystemaccess() will reject with a domexception. syntax feature-policy: encrypted-media <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the allow list is 'self'. specifications specification status comm...

Feature-Policy: gyroscope - HTTP
ective controls whether the current document is allowed to gather information about the orientation of the device through the gyroscope interface. syntax feature-policy: gyroscope <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. the default value is 'self'. specifications specification status comment ...

Feature-Policy: layout-animations - HTTP
the http feature-policy header layout-animations directive controls whether the current document is allowed to show layout animations. syntax feature-policy: layout-animations <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and nes...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. the default value is 'self'. specifications specification status comment ...

Feature-Policy: legacy-image-formats - HTTP
ture-policy header legacy-image-formats directive controls whether the current document is allowed to display images in legacy formats. syntax feature-policy: legacy-image-formats <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. the default value is 'self'. specifications specification status comment ...

Feature-Policy: magnetometer - HTTP
controls whether the current document is allowed to gather information about the orientation of the device through the magnetometer interface. syntax feature-policy: magnetometer <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. the default value is 'self'. specifications specification status comment ...

Feature-Policy: microphone - HTTP
to use audio input devices. when this policy is enabled, the promise returned by mediadevices.getusermedia() will reject with a notallowederror. syntax feature-policy: microphone <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. the default value is 'self'. specifications specification status comment ...

Feature-Policy: midi - HTTP
is allowed to use the web midi api. when this policy is enabled, the promise returned by navigator.requestmidiaccess() will reject with a domexception. syntax feature-policy: midi <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the allow list is 'self'. specifications specification status comm...

Feature-Policy: oversized-images - HTTP
ttp feature-policy header oversized-images directive controls whether the current document is allowed to download and display large images. syntax feature-policy: oversized-images <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default value the default value is '*'. specification specification status commen...

Feature-Policy: payment - HTTP
current document is allowed to use the payment request api. when this policy is disabled, the paymentrequest() constructor will throw a syntaxerror. syntax feature-policy: payment <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the payment feature's default allowlist value is 'self'. specifications ...

Feature-Policy: picture-in-picture - HTTP
icture directive controls whether the current document is allowed to play a video in a picture-in-picture mode via the corresponding api. syntax feature-policy: picture-in-picture <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy as of june 2019, the spec draft and google chrome set default allow list to *. spe...

Feature-Policy: publickey-credentials-get - HTTP
als.get({publickey: ..., ...}). when this policy is enabled, any attempt to query public key credentials will result in an error. syntax feature-policy: publickey-credentials-get <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default allowlist is 'self'. specifications specification status ...

Feature-Policy: screen-wake-lock - HTTP
o indicate that device should not dim or turn off the screen. note: in earlier specification drafts this directive was called wake-lock. syntax feature-policy: screen-wake-lock <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy default allow list for screen-wake-lock is 'self'. specifications specif...

Feature-Policy: sync-xhr - HTTP
the http feature-policy header sync-xhr directive controls whether the current document is allowed to make synchronous xmlhttprequest requests. syntax feature-policy: sync-xhr <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and nes...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy by default the policy is set to *, which means synchronous requests are allowed in ...

Feature-Policy: unoptimized-images - HTTP
e-policy header unoptimized-images directive controls whether the current document is allowed to download and display unoptimized images. syntax feature-policy: unoptimized-images <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. the default value is 'self'. specifications specification status comment ...

Feature-Policy: unsized-media - HTTP
blem caused by providing default dimensions for images whose size is not specified in advance so that image doesn't change size after loading. syntax feature-policy: unsized-media <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default value the default value for unsized-media is '*', that is unsized media elements are allow...

Feature-Policy: usb - HTTP
the http feature-policy header usb directive controls whether the current document is allowed to use the webusb api. syntax feature-policy: usb <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and nested browsing contexts. <origin(...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default value is 'self'. specifications specification status c...

Feature-Policy: vibrate - HTTP
der vibrate directive controls whether the current document is allowed to trigger device vibrations via navigator.vibrate() method of vibration api. syntax feature-policy: vibrate <allowlist>; <vibrate> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. the default value is 'self'. specifications specification status comment ...

Feature-Policy: wake-lock - HTTP
api to indicate that device should not enter power-saving mode. note: latest drafts of screen wake lock api defines screen-wake-lock directive. syntax feature-policy: wake-lock <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy default allow list for wake-lock is 'self'. specifications specification...

web-share - HTTP
s allowed to use the navigator.share() of web share api to share text, links, images, and other content to arbitrary destiations of user's choice. syntax feature-policy: web-share <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default value is 'self'. specifications specification status c...

Feature-Policy: xr-spatial-tracking - HTTP
te support for sessions supporting spatial tracking via navigator.xr.issessionsupported() and devicechange event on navigator.xr object. syntax feature-policy: xr-spatial-tracking <allowlist>; <allowlist> an allowlist is a list of origins that takes one or more of the following values, separated by spaces: *: the feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin. 'self': the feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin. 'src': (in an iframe allow attribute only) the feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the url in the iframe's src attribute. 'none': the feature is disabled in top-level and ne...
...ttps://example.com). origins should be separated by a space. the values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins. features are each defined to have a default allowlist, which is one of: *: the feature is allowed by default in top-level browsing contexts and all nested browsing contexts (iframes). 'self': the feature is allowed by default in top-level browsing contexts and in nested browsing contexts (iframes) in the same origin. the feature is not allowed in cross-origin documents in nested browsing contexts. 'none': the feature is disabled in top-level and nested browsing contexts. default policy the default allowlist is 'self'. specifications specification status ...

HTTP headers - HTTP
ng and/or enforcement of certificate transparency requirements, which prevents the use of misissued certificates for that site from going unnoticed. when a site enables the expect-ct header, they are requesting that chrome check that any certificate for that site appears in public ct logs. feature-policy provides a mechanism to allow and deny the use of browser features in its own frame, and in iframes that it embeds. strict-transport-security (hsts) force communication using https instead of http. upgrade-insecure-requests sends a signal to the server expressing the client’s preference for an encrypted and authenticated response, and that it can successfully handle the upgrade-insecure-requests directive. x-content-type-options disables mime sniffing and forces browser to use the type...
...ns http header indicates that the browser (internet explorer) should not display the option to "open" a file that has been downloaded from an application, to prevent phishing attacks as the file otherwise would gain access to execute in the context of the application. (note: related ms edge bug). x-frame-options (xfo) indicates whether a browser should be allowed to render a page in a <frame>, <iframe>, <embed> or <object>. x-permitted-cross-domain-policies specifies if a cross-domain policy file (crossdomain.xml) is allowed. the file may define a policy to grant clients, such as adobe's flash player, adobe acrobat, microsoft silverlight, or apache flex, permission to handle data across domains that would otherwise be restricted due to the same-origin policy. see the cross-domain policy file...

target - SVG: Scalable Vector Graphics
the target attribute should be used when there are multiple possible targets for the ending resource, such as when the parent document is embedded within an html or xhtml document, or is viewed with a tabbed browser. ...
... document is to be opened when the link is activated: only one element is using this attribute: <a> html, body, svg { height: 100%; } text { font: 20px arial, helvetica, sans-serif; fill: blue; text-decoration: underline; } <svg viewbox="0 0 300 120" xmlns="http://www.w3.org/2000/svg"> <a href="https://developer.mozilla.org" target="_self"> <text x="0" y="20">open link within iframe</text> </a> <a href="https://developer.mozilla.org" target="_blank"> <text x="0" y="60">open link in new tab or window</text> </a> <a href="https://developer.mozilla.org" target="_top"> <text x="0" y="100">open link in this tab or window</text> </a> </svg> usage notes value _self | _parent | _top | _blank | <xml-name> default value _self ani...

Scripting - SVG: Scalable Vector Graphics
svgdocument that points to the svg document. this is not the case for mozilla's native svg implementation; therefore, using window.svgdocument does not work in mozilla. instead, you can use var svgdoc=document.embeds["name_of_svg"].getsvgdocument(); to get a reference to an embedded svg document instead. ...
...or mozilla's native svg implementation; therefore, using window.svgdocument does not work in mozilla. instead, you can use var svgdoc=document.embeds["name_of_svg"].getsvgdocument(); to get a reference to an embedded svg document instead. the best way to get access to the document representing an svg document is to look at htmliframeelement.contentdocument (if the document is presented in an <iframe>) or htmlobjectelement.contentdocument (if the document is presented in an <object> element), like this: var svgdoc = document.getelementbyid("iframe_element").contentdocument; in addition, the <iframe>, <embed>, and <object> elements offer a method, getsvgdocument(), which returns the xmldocument representing the element's embedded svg or null if the element doesn't represent an svg document. ...

Same-origin policy - Web security
requires a correct content-type header. restrictions vary by browser: internet explorer, firefox, chrome, safari (scroll down to cve-2010-0051) and opera. images displayed by <img>. media played by <video> and <audio>. external resources embedded with <object> and <embed>. fonts applied with @font-face. some browsers allow cross-origin fonts, others require same-origin. anything embedded by <iframe>. sites can use the x-frame-options header to prevent cross-origin framing. how to allow cross-origin access use cors to allow cross-origin access. cors is a part of http that lets servers specify what hosts are permitted to load content from that server. how to block cross-origin access to prevent cross-origin writes, check an unguessable token in the request — known as a cross-site req...
...ce cannot be interpreted as one of the embeddable formats listed above. browsers may not respect the content-type header. for example, if you point a <script> tag at an html document, the browser will try to parse the html as javascript. when your resource is not an entry point to your site, you can also use a csrf token to prevent embedding. cross-origin script api access javascript apis like iframe.contentwindow, window.parent, window.open, and window.opener allow documents to directly reference each other. when two documents do not have the same origin, these references provide very limited access to window and location objects, as described in the next two sections. to communicate between documents from different origins, use window.postmessage. specification: html living standard § cr...

Web security
is called a mixed content page. pages like this are only partially encrypted, leaving the unencrypted content accessible to sniffers and man-in-the-middle attackers. how to fix a website with blocked mixed content if your website delivers https pages, all active mixed content delivered via http on these pages will be blocked by default. consequently, your website may appear broken to users (if iframes or plugins don't load, etc.). passive mixed content is displayed by default, but users can set a preference to block this type of content, as well. this page explains what you should be aware of as a web developer. secure contexts a secure context is a window or worker for which there is reasonable confidence that the content has been delivered securely (via https/tls), and for which the poten...
...ing, or, in other words, to say that the mime types are deliberately configured. clickjacking protection in clickjacking, a user is fooled into clicking on a ui element that performs some action other than what the user expects. http x-frame-options the x-frame-options http response header can be used to indicate whether or not a browser should be allowed to render a page in a <frame>, <iframe>, <embed> or <object>. sites can use this to avoid clickjacking attacks, by ensuring that their content is not embedded into other sites. csp: frame-ancestors the http content-security-policy (csp) frame-ancestors directive specifies valid parents that may embed a page using <frame>, <iframe>, <object>, <embed>, or <applet>. user information security insecure passwords serving login forms...

Content Scripts - Archive of obsolete content
{' + ' var event = new customevent("myaddonid-contextmenu-clicked",' + ' {detail:node.href});' + ' window.dispatchevent(event);' + '});' }); cross-domain content scripts by default, content scripts don't have any cross-domain privileges. in particular, they can't access content hosted in an iframe, if that content is served from a different domain, or make cross-domain xmlhttprequests. however, you can enable these features for specific domains by adding them to your add-on's package.json under the "cross-domain-content" key, which itself lives under the "permissions" key. see the article on cross-domain content scripts. ...

panel - Archive of obsolete content
de: handlehide }); function handlechange(state) { if (state.checked) { mypanel.show({ position: button }); } } function handlehide() { button.state('window', {checked: false}); } updating panel content you can update the panel's content by: sending a message to a content script that updates the dom in the same document. this is usually the best approach. embedding an iframe in the panel, and changing its document setting the panel's contenturl property. however, doing this will cause any content scripts to be unloaded and then reloaded, so it may be less efficient, and you'll lose any state associated with the scripts. scripting panel content you can't directly access your panel's content from your main add-on code. to access the panel's content, you need to loa...

ui - Archive of obsolete content
the user clicks the button, and the icon gets a "pressed" look when the button is checked. it's otherwise identical to the action button. attaching panels to buttons is only supported from firefox 30 onwards. from firefox 30 onwards, you can attach panels to toggle buttons, by passing the button into the panel's constructor or its show() method: frame a frame enables you to create an html iframe, using bundled html, css and javascript. this can then be added to a designated area of the firefox user interface. at the moment you can only add frames to a toolbar. you initialize a frame with a url pointing to an html document supplied under your add-on's "data" directory. this document can refer to bundled css and javascript files, and your main add-on can communicate with a frame script us...

frame/hidden-frame - Archive of obsolete content
this is useful in the construction of apis that load web content not intended to be directly seen or accessed by users, like page-worker. it is also useful in the construction of apis that load web content for intermittent display, such as panel. usage the module exports a constructor function, hiddenframe, and two other functions, add and remove. hiddenframe constructs a new hidden frame. add registers a hidden frame, preparing it to load content. remove unregisters a frame, unloading any content that was loaded in it. ...

lang/type - Archive of obsolete content
eck. returns boolean : boolean indicating if value is an array/flat object containing only atomic values and other flat objects. instanceof(value, type) returns true if value is an instance of a given type. this is similar to the instanceof operator. the difference is that the type constructor can be from a scope that has a different top level object: for example, it could be from a different iframe, module or sandbox. let { instanceof } = require('sdk/lang/type'); instanceof(new class(), class); // true function class() {} parameters value : object the variable to check. type : object the constructor to compare to value returns boolean : boolean indicating if value is an instance of type. source(value, indent, limit) returns the textual representation of value, containing propert...

package.json - Archive of obsolete content
icating whether or not the add-on supports private browsing. if this value is not true or is omitted, then the add-on will not see any private windows or objects, such as tabs, that are associated with private windows. see the documentation for the private-browsing module. cross-domain-content: a list of domains for which content scripts are given cross-domain privileges to access content in iframes or to make xmlhttprequests. see the documentation for enabling cross-domain content scripts. multiprocess: a boolean value declaring whether this add-on is, or is not, compatible with multiprocess firefox. note the multiprocess permission is not supported by cfx. preferences an array of json objects that use the following keys: name,type, value, title, an...

Modifying Web Pages Based on URL - Archive of obsolete content
= require("sdk/page-mod").pagemod({ include: "*", contentstylefile: "./my-style.css" }); learning more to learn more about page-mod, see its api reference page. in particular, the pagemod constructor takes several additional options to control its behavior: by default, content scripts are not attached to any tabs that are already open when the page-mod is created, and are attached to iframes as well as top-level documents. to control this behavior use the attachto option. define read-only values accessible to content scripts using the contentscriptoptions option. by default, content scripts are attached after all the content (dom, js, css, images) for the page has been loaded, at the time the window.onload event fires. to control this behavior, use contentscriptwhen opti...

HTML in XUL for rich tooltips - Archive of obsolete content
on, which will take the tooltiphtml attribute of the element that is being hovered over and safely convert that into dom and inject it into the tooltip that will soon be shown. the tooltiphtml attribute is an html string which is set sometime beforehand for each element. for security reasons, the conversion will strip out some of the more dangerous elements in the html string, like javascript and iframes. non-dynamic html in xul tooltip it is also possible to avoid using dynamic html to accomplish this. you would have to have a separate xul tooltip element assigned to each element that you wish to have a rich tooltip with. you should write the html straight into the xul. <?xml version="1.0" encoding="utf-8"?> <overlay id="htmltip-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper...

On page load - Archive of obsolete content
unction(aevent) { var doc = aevent.originaltarget; // doc is document that triggered the event var win = doc.defaultview; // win is the window for the doc // test desired conditions and do something // if (doc.nodename != "#document") return; // only documents // if (win != win.top) return; //only top window. // if (win.frameelement) return; // skip iframes/frames alert("page is loaded \n" +doc.location.href); } } window.addeventlistener("load", function load(event){ window.removeeventlistener("load", load, false); //remove listener, no longer needed myextension.init(); },false); references if you need to have a more complicated listener (not just onload), use progress listeners. see also domcontentloaded event in li...

Code snippets - Archive of obsolete content
vg embedding svg in html and xul using svg to enhance html or xul based markup xul widgets html in xul for rich tooltips dynamically embed html into a xul element to attain markup in a tooltip label and description special uses and line breaking examples tree setup and manipulation of trees using xul and js scrollbar changing style of scrollbars. applies to scrollbars in browser and iframe as well. autocomplete code used to enable form autocomplete in a browser boxes tips and tricks when using boxes as containers tabbox removing and manipulating tabs in a tabbox windows-specific finding window handles (hwnd) (firefox) how to use windows api calls to find various kinds of mozilla window handles. window handles can be used for ipc and accessibility purposes. using the wi...

Intercepting Page Loads - Archive of obsolete content
{ // frame within a tab was loaded. // find the root document: while (doc.defaultview.frameelement) { doc = doc.defaultview.frameelement.ownerdocument; } } } } the second if validation is necessary if you need to make a distinction for html documents being loaded in inner page frames. few modern sites use framesets, but it is common for ads to appear inside iframe elements. in most cases you'll need to compare the page url with some string or regular expression: if (some_regular_expression.test(doc.defaultview.location.href)) you can access and modify the dom of the loaded page, just like you normally would for xul and html documents. you can't, however, easily cancel the page load. you can close the tab, redirect the tab to about:blank or another page...

Security best practices in extensions - Archive of obsolete content
old both chrome (privileged) content and web (nonprivileged) content, the latter being in the form of web pages. these web pages can come from a server, or come from local html files bundled with the extension. for pages coming from the server, you need to take steps to ensure that the content can not call back into the web browser and run malicious code. the main way to do this is by creating an iframe or browser element in the sidebar, and loading your content there. give the element a type="content" attribute, which essentially sandboxes the code there and blocks callback rights into chrome. using eval() in an extension using the built-in javascript eval function is frowned upon in the context of extensions. while there are some legitimate use-cases, most of the time there are safer alterna...

An Interview With Douglas Bowman of Wired News - Archive of obsolete content
e and altering an image variable? hmmm. i'm having a tough time thinking of any advantages... what disadvantages did you encounter? honestly, there were several challenges and glitches we ran into along the way. first of all, since wired news is a heavily ad-supported site, our advertising units were the cause of several important decisions. our ad-serving partner basically requires that we use iframes to dynamically pull in ads from available inventory. because of the iframe, we backed off of the idea that we'd be able to adhere to xhtml strict rules, and settled for using the xhtml transitional dtd. we were hoping to go all the way with the xhtml conversion, but our ad units and some other third-party content prevent us from doing so. our engineers also faced a huge archive of content that ...

Document Loading - From Load Start to Finding a Handler - Archive of obsolete content
tream listener to pump the data into when necko calls ondataavailable (e.g., we may find the html parser as the stream listener to give the data to). dramatis personae this document focuses on the interaction of three classes with each other, but other mozilla components are also involved. main roles nsdocshell this class corresponds, basically, to a "window" object in javascript -- each frame, iframe, content area, tab, etc has its own docshell. a docshell can have a name associated with it (e.g. a named frame). all loads that we consider in this document are initiated via the docshell. nsdocshell implements too many interfaces to count; the ones that matter to us most are nsiwebnavigation and nsilinkhandler. nsuriloader this is a service implementing nsiuriloader. it keeps track of currently...

Layout System Overview - Archive of obsolete content
ext to frames created as children of a container. the frame manager uses the frame constructor state class to manage the important information about the container of a frame being created (and lots of other state-stuff too - need to describe more fully). frame the frame is the most fundamental layout object. the class nsframe is the base class for all frames, and it inherits from the base class nsiframe (note: nsiframe is not an interface, it is an abstract base class. it was once an interface but was changed to be a base class when the style system was modified - the name was not changed to reflect that it is not an interface). the frame provides generic functionality that can be used by subclasses but cannot itself be instantiated. nsframe: the frame provides a mechanism to navigate to a paren...

statusBar - Archive of obsolete content
many of the options are optional. ...

Safely loading URIs - Archive of obsolete content
de is in. differences between the methods the three methods differ from each other in how the source of the uri is identified and in what is known about the uri to be loaded. in general, the following guidelines apply for gecko 1.8: if you plan pass a uri string to nsiwebnavigation.loaduri (which can happen indirectly, e.g. by passing the string to something that loads it in a <browser> or <iframe>), you must call checkloaduristr to be secure. there's no way to do this completely securely in gecko versions prior to 1.8.0.4. if you're doing anything else (passing a uri string to some other api like window.open or <img src="">, passing a uri object to an api that loads uri objects, etc.) use whichever method best fits the data you can get your hands on. if you have a choice as to what data ...

Elements - Archive of obsolete content
have the layout and display characteristics of an existing element. for example, use the value 'xul:button' to create an element that is displayed like a button. the part before the colon is a namespace prefix so you must declare the xul namespace as well. not all tags have a unique display type. the following xul display types may be used: browser, button, checkbox, description, editor, grippy, iframe, image, label, menu, menuitem, menubar, progressmeter, radio, resizer, scrollbar, scrollbox, spacer, splitter, titlebar, treechildren and treecol. you may also use a number of html, mathml and svg tags. the 'display' attribute does not work unless the extends attribute is set, see bug bug 119389. in that case, put the value of the display attribute into the extends attribute. inheritstyle - the ...

showcaret - Archive of obsolete content
« xul reference home showcaret type: boolean whether or not to cause a typing caret to be visible in the content area. default is false. ...

src - Archive of obsolete content
« xul reference home src type: uri the uri of the content to appear in the element. ...

Dynamically modifying XUL-based user interface - Archive of obsolete content
t and a tree you can think of a document as an in-memory representation of valid html or well-formed xml such as xhtml or xul. it is important to remember that different web pages (and even different instances of the same web page) correspond to different documents. each xul window has its own distinct document, and there may even be a few different documents in a single window, when there is an <iframe>, <browser>, or a <tabbrowser> element. you must be sure to always manipulate the correct document. (read more about this in working with windows in chrome code.) when your script is included using a <script> tag, the document property references the dom document that includes the script. examples: using dom methods this section demonstrates the use of appendchild(), createelement(), insertbefore...

Adding Methods to XBL-defined Elements - Archive of obsolete content
« previousnext » next, we'll find out how to add custom methods to xbl-defined elements. methods in addition to adding script properties to the xbl-defined element, you can also add methods. these methods can be called from a script. methods are the functions of objects, such as window interface's open() method loads the specified resource into the browsing context (window, <iframe> or tab) with the specified name. if the name doesn't exist, then a new window is opened and the specified resource is loaded into its browsing context.">window.open(). you can define custom methods for your elements using the method element. the general syntax of methods is as follows: <implementation> <method name="method-name"> <parameter name="parameter-name1"/> <parameter name="parameter-name...

Trees - Archive of obsolete content
ing additional rows. to disable multiple selection, place a seltype attribute on the tree, set to the value single. with this, the user may only select a single row at a time. add a tree to our find files example let's add a tree to the find files window where the results of the search would be displayed. the tree will use a content tree view. the following code should be added in place of the iframe. <tree flex="1"> <treecols> <treecol id="name" label="filename" flex="1"/> <treecol id="location" label="location" flex="2"/> <treecol id="size" label="size" flex="1"/> </treecols> <treechildren> <treeitem> <treerow> <treecell label="mozilla"/> <treecell label="/usr/local"/> <treecell label="2520 bytes"/> </treerow> </treeitem> </treechil...

elements - Archive of obsolete content
a action arrowscrollbox b bbox binding bindings box broadcaster broadcasterset button browser c checkbox caption colorpicker column columns commandset command conditions content d deck description dialog dialogheader e editor grid grippy groupbox h hbox i iframe image k key keyset l label listbox listcell listcol listcols listhead listheader listitem m member menu menubar menuitem menulist menupopup menuseparator o observes overlay p page popup popupset preference preferences prefpane prefwindow progressmeter r radio radiogroup resizer richlistbox richlistitem resizer row rows rule s script scrollbar scrollbox scrollcorner ...

page - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] similar to a window, except it should be used for xul files that are to be loaded into an iframe. examples (example needed) attributes inherited from xul element align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width ...

panel - Archive of obsolete content
w. typically, it will be attached to a button using the button's type attribute so that when the button is pressed, the panel will be displayed. a panel may also be opened via a script using the openpopup method. the panel is closed when the user clicks outside the panel, presses escape or when the panel's hidepopup method is called. warning: for firefox versions between 3.6 and 4.0, placing an iframe, browser or editor inside a panel is not supported. some features may work, but only on some platforms. for those versions of firefox, it is best to avoid child frames in a panel, if possible. this limitation was resolved as of firefox 4.0. attributes backdrag, close, consumeoutsideclicks, fade, flip, ignorekeys, label, left, level, noautofocus, noautohide, norestorefocus, onpopuphidden, onp...

toolbar - Archive of obsolete content
x element. you can associate an external toolbar with a toolbox for the purpose of managing your toolbars by setting the toolboxid property on the toolbar. the chromeclass-toolbar class may be used to create a toolbar where its visibility depends on the toolbar flag when opening the window with the window interface's open() method loads the specified resource into the browsing context (window, <iframe> or tab) with the specified name. if the name doesn't exist, then a new window is opened and the specified resource is loaded into its browsing context.">window.open() method. more information is available in the xul tutorial. note: starting in gecko 1.9.1, toolbar items are moved from the toolbarpalette and added to the toolbar when a toolbar is first displayed. in earlier versions, a copy of...

Opening a Link in the Default Browser - Archive of obsolete content
.warn-external.ftp", false); you can also check whether an external handler for a scheme exists. this is how you do it: var extps = components.classes["@mozilla.org/uriloader/external-protocol-service;1"] .getservice(components.interfaces.nsiexternalprotocolservice); if (extps.externalprotocolhandlerexists("http")) { // handler for http:// urls exists } link within an iframe to enable a link inside an html document that is the "src" of an iframe to be opened in the default browser, setting the preference: pref("network.protocol-handler.expose-all", false); seems to work. ...

reftest opportunities files - Archive of obsolete content
ml parser/htmlparser/tests/html/26347.html parser/htmlparser/tests/html/24462.html parser/htmlparser/tests/html/24184.html parser/htmlparser/tests/html/22596.html parser/htmlparser/tests/html/22480.html parser/htmlparser/tests/html/22263.html parser/htmlparser/tests/html/20087.html parser/htmlparser/tests/html/19116.html parser/htmlparser/tests/html/187790.html parser/htmlparser/tests/html/184029_iframe.html parser/htmlparser/tests/html/184029.html parser/htmlparser/tests/html/183711.html parser/htmlparser/tests/html/18308.html parser/htmlparser/tests/html/17003.html parser/htmlparser/tests/html/15204.html parser/htmlparser/tests/html/149877.html parser/htmlparser/tests/html/142965_1.html parser/htmlparser/tests/html/142965.html parser/htmlparser/tests/html/124788.html parser/htmlparser/tests/ht...

Extentsions FAQ - Archive of obsolete content
http://kb.mozillazine.org/dev_:_usin...lt_preferences btw: resetting prefences to default will clear them in case no default prefence is (still) available. those will be completely removed upon next application launch. is it possible to create a sidebar on the top of the page? not unless you make it a separate window. there's a bug in bugzilla about stacking other widgets on top of browser/iframe, which hopefully will be fixed for gecko 1.9. could someone write an extension that zaps the google analytics cookie, the urchin cookie, switches gmail and google calender to https? customizegoogle extension already has support for switching gmail to https (and calendar possibly, too). does anyone know how write a bounce email extension? are you aware of the "mailredirect" extension? it a...

2006-09-29 - Archive of obsolete content
signed (i.e. which developer(s) has/have the correct expertise for a particular bug report). he has a working web-based tool called sibyl for providing both developer and component recommendations for bug reports. he is looking for triagers to try it and give him feedback. help testing helper extension - someone made a new extension. he needs help testing it out and wants to know how to make an iframe loads not go into the history. he also created a bug report to get rid of the help hooks in page info that lead nowhere. meetings none authors mark d'souza (mdsouza) mohamed attar (mojo) ...

CSS - Archive of obsolete content
rosoft extension that sets or retrieves the filter or collection of filters applied to an object.-ms-flow-fromthe -ms-flow-from css property is a microsoft extension that gets or sets a value identifying a region container in the document that accepts the content flow from the data source.-ms-flow-intothe -ms-flow-into css property is a microsoft extension that gets or sets a value identifying an iframe container in the document that serves as the region's data source.-ms-high-contrast-adjustthe -ms-high-contrast-adjust css property is a microsoft extension that gets or sets a value indicating whether to override any css properties that would have been set in high contrast mode.-ms-hyphenate-limit-charsthe -ms-hyphenate-limit-chars css property is a microsoft extension that specifies one to thre...

Browsing context - MDN Web Docs Glossary: Definitions of Web-related terms
each browsing context has a specific origin, the origin of the active document and a history that memorize all the displayed documents, in order. ...

First contentful paint - MDN Web Docs Glossary: Definitions of Web-related terms
this is the first time users could start consuming page content. ...

Navigation directive - MDN Web Docs Glossary: Definitions of Web-related terms
rity-policy header and govern to which location a user can navigate to or submit a form to, for example. navigation directives don't fall back to the default-src directive. list of csp navigation directives form-action restricts the urls which can be used as the target of a form submissions from a given context. frame-ancestors specifies valid parents that may embed a page using <frame>, <iframe>, <object>, <embed>, or <applet>. navigate-to restricts the urls to which a document can initiate navigation by any means, including <form> (if form-action is not specified), <a>, window.location, window.open, etc. learn more https://www.w3.org/tr/csp/#directives-navigation other kinds of directives: fetch directive document directive reporting directive block-all-mixed-c...

document environment - MDN Web Docs Glossary: Definitions of Web-related terms
a global environment is an environment that doesn't have an outer environment. ...

Images, media, and form elements - Learn web development
d doesn't stretch to fill it. the other is larger than 200 pixels and overflows the box. so what can we do about the overflowing issue? as we learned in our previous lesson, a common technique is to make the max-width of an image 100%. this will enable the image to become smaller in size than the box but not larger. this technique will work with other replaced elements such as <video>s, or <iframe>s. try adding max-width: 100% to the <img> element in the example above. you will see that the smaller image remains unchanged, but the larger one becomes smaller to fit into the box. you can make other choices about images inside containers. for example, you may want to size an image so it completely covers a box. the object-fit property can help you here. when using object-fit the replaced e...

Sizing items in CSS - Learn web development
a letter a, which has been given a font-size of 10vh. if you change the vh and vw values this will change the size of the box or font; changing the viewport size will also change their sizes because they are sized relative to the viewport. to see the example change when you change the viewport size you will need to load the example in a new browser window that you can resize (as the embedded <iframe> that contains the example shown above is its viewport). open the example, resize the browser window, and observe what happens to the size of the box and text. sizing things according to the viewport can be useful in your designs. for example, if you want a full-page hero section to show before the rest of your content, making that part of your page 100vh high will push the rest of the content b...

CSS values and units - Learn web development
set in pixels. as an absolute unit this width will remain the same no matter what else changes. the second box has a width set in vw (viewport width) units. this value is relative to the viewport width, and so 10vw is 10 percent of the width of the viewport. if you change the width of your browser window, the size of the box should change, however this example is embedded into the page using an <iframe>, so this won't work. to see this in action you'll have to try the example after opening it in its own browser tab. the third box uses em units. these are relative to the font size. i've set a font size of 1em on the containing <div>, which has a class of .wrapper. change this value to 1.5em and you will see that the font size of all the elements increases, but only the last item will get wider,...

Styling links - Learn web development
but only if they have an href attribute with a value that contains "http" somewhere inside it. so that's it — try revisiting the active learning section above and trying this new technique out! note: the href values look strange — we've used dummy links here that don't really go anywhere. the reason for this is that if we used real links, you would be able to load an external site in the <iframe> the live example is embedded in, thereby losing the example. note: don't worry if you are not familiar with backgrounds and responsive web design yet; these are explained in other places. styling links as buttons the tools you've explored so far in this article can also be used in other ways. for example, states like hover can be used to style many different elements, not just links — yo...

What is a URL? - Learn web development
note: when specifying urls to load resources as part of a page (such as when using the <script>, <audio>, <img>, <video>, and the like), you should generally only use http and https urls, with few exceptions (one notable one being data:; see data urls). using ftp, for example, is not secure and is no longer supported by modern browsers. other technologies, such as css or javascript...

Images in HTML - Learn web development
e retained this information before you move on — see test your skills: html images. summary that's all for now. ...

Mozilla splash page - Learn web development
essed or need help with, in an online editor. ...

Test your skills: Multimedia and embedding - Learn web development
note: you can try out solutions in the interactive editors below, however it may be helpful to download the code and use an online tool such as codepen, jsfiddle, or glitch to work on the tasks. if you get stuck, then ask us for help — see the assessment or further help section at the bottom of this page. multimedia and embedding 1 in this task we want you to embed a simple audio file onto the page. you need to: add the path to the audio file to an appropriate attribute to embed it on the page. ...

Video and audio content - Learn web development
...

Third-party APIs - Learn web development
irst page, we don't need to load the same results again). note: you can find our finished nytimes api example code on github (also see it running live here). youtube example we also built another example for you to study and learn from — see our youtube video search example. this uses two related apis: the youtube data api to search for youtube videos and return results. the youtube iframe player api to display the returned video examples inside iframe video players so you can watch them. this example is interesting because it shows two related third-party apis being used together to build an app. the first one is a restful api, while the second one works more like mapquest (with api-specific methods, etc.). it is worth noting however that both of the apis require a javascript li...

Test your skills: JSON - Learn web development
the example won't work locally, or in an environment like codepen or jsfiddle, because of something called cross-origin security. this basically means that you can't request a file from one origin using code on a different origin. in the live code editor above, both the javascript code and the requested json file are on the same origin (the code sits on a github repo, and is embedded here in an <iframe>). if you put your code on codepen for example, it would fail because the json it is requesting is not on the same origin. you can get around these restrictions using cors, but this is beyond the scope of what we are teaching here. assessment or further help you can practice these examples in the interactive editor above. if you would like your work assessed, or are stuck and want to ask for ...

CSS performance optimization - Learn web development
hat do not trigger a reflow (and therefore also a repaint) very well. to improve performance, the node being animated can be moved off the main thread and onto the gpu. properties that will lead to compositing include 3d transforms (transform: translatez(), rotate3d(), etc.), animating transform and opacity, position: fixed, will-change, and filter. some elements, including <video>, <canvas> and <iframe>, are also on their own layer. when an element is promoted as a layer, also known as composited, animating transform properties is done in the gpu, resulting in improved performance, especially on mobile. will-change property the css will-change property tells browsers which properties of an element are expected to change enabling browsers to set up optimizations before the element is actually ...

HTML performance features - Learn web development
ogies. objective: to learn about the impact of html elements and attributes on web performance optimization. elements & attributes impacting performance the <picture> element the <video> element the <source> element the <img> srcset attribute responsive images preloading content with rel="preload" - (https://w3c.github.io/preload/ ) async / defer attributes <iframe> <object> <script> rel attribute conclusion previous overview: performance next in this module the "why" of web performance what is web performance? how do users perceive performance? measuring performance multimedia: images multimedia: video javascript performance best practices. html performance features css performance features fonts and performance mobile performan...

Learning area release notes - Learn web development
understood what is going on. ...

Client-Server Overview - Learn web development
e=edge"> <script>(function(d) { d.classname = d.classname.replace(/\bno-js/, ''); })(document.documentelement);</script> ... the remainder of the response header includes information about the response (e.g. when it was generated), the server, and how it expects the browser to handle the page (e.g. the x-frame-options: deny line tells the browser not to allow this page to be embedded in an <iframe> in another site). post request/response example an http post is made when you submit a form containing information to be saved on the server. the request the text below shows the http request made when a user submits new profile details on this site. the format of the request is almost the same as the get request example shown previously, though the first line identifies this request as a po...

Website security - Learn web development
r. web frameworks often include such csrf prevention mechanisms. other threats other common attacks/vulnerabilities include: clickjacking. in this attack, a malicious user hijacks clicks meant for a visible top-level site and routes them to a hidden page beneath. this technique might be used, for example, to display a legitimate bank site but capture the login credentials into an invisible <iframe> controlled by the attacker. clickjacking could also be used to get the user to click a button on a visible site, but in doing so actually unwittingly click a completely different button. as a defense, your site can prevent itself from being embedded in an iframe in another site by setting the appropriate http headers. denial of service (dos). dos is usually achieved by flooding a target site wi...

ZoomText
that you're testing and let me know what bugs you're finding. my email address is aaronleventhal@moonset.net. issues for ai squared, from high to low priority docreader and appreader don't respect the structure of the document -- no support for columns. zoomtext text to speech doesn't always echo what it should -- need more details from testers. mozilla issues cannot tab into frames and iframes. cannot customize the sidebar with the keyboard only. comboboxes report incorrect bounds, causing zoomtext tracking to move to the wrong area of the screen. ...

Limitations of chrome scripts
e jsm in the chrome process, and have frame scripts store and access the jsm's state by sending messages to the chrome process using the message manager. nsiprotocolhandler in multiprocess firefox, code which registers a custom protocol using nsiprotocolhandler must register the custom protocol in the child content process. if the custom protocol is registered only in the chrome process, no iframes or tabs will be able to load any resource from the custom procotol. the solution is to register the custom protocol in the content process. you can do this by loading a frame script or, with the add-on sdk, you can use remoterequire() in the "remote/parent" module. ...

Message manager
quires multiprocess firefox: everything described here will work with single-process firefox, so the same code will work on both variants. ...

Chrome-only API reference
this page lists apis that only run in gecko chrome code (and sometimes in other privileged circumstances). note: most of the apis exposed to the web in general are also usable in chrome code: see web apis for a list of these. browser apithe html browser api is an extension of the html <iframe> element that allows web apps to implement browsers or browser-like applications. it currently works in (privileged) chrome code on firefox desktop (version 47 and above).chromeworkerif you're developing privileged code, and would like to create a worker that can use js-ctypes to perform calls to native code, you can do so by using chromeworker instead of the standard worker object. it works exactly like a standard worker, except that it has access to js-ctypes via a global ctypes object available...

HTML parser threading
of the parser, so for refcounting purposes, the parser owns each nsicontent object it creates by one reference no matter how many copies of the content handle for the node exist inside the parser. (this indeed means that removing parser-created nodes from the dom during parsing doesn't release memory until the parser stops parsing, which is, in theory, a problem for long polling using html in an iframe e.g. for a chat app.) some tree ops hold char or prunichar arrays. those arrays are allocated when creating the tree op and delete[]d by the destructor of nshtml5treeoperation. hence, data gets copied to and from these arrays. executing tree ops when the executor flushing runnable fires on the main thread, it calls nshtml5treeopexecutor::runflushloop(). this method returns immediately if another ...

Introduction to Layout in Mozilla
responsiveness trade-off frame construction runs to completion css parsing runs to com...

Services.jsm
event listener service etld nsieffectivetldservice effectivetld service focus nsifocusmanager focus manager io nsiioservice nsiioservice2 i/o service locale nsilocaleservice locale service logins nsiloginmanager password manager service metro nsiwinmetroutils 2 mm nsimessagebroadcaster nsiframescriptloader global frame message manager3 obs nsiobserverservice observer service perms nsipermissionmanager permission manager service ppmm nsimessagebroadcaster nsiprocessscriptloader global parent process message manager3 prefs nsiprefbranch nsiprefbranch2 nsiprefservice preferences service prompt nsiprompts...

source-editor.jsm
enever you save the text; the editor will update it to true when the content is changed. you can then use this value to detect when the contents of the text are different from your most recent save. in addition, when this value changes, the "dirtychanged" event is sent. editorelement element the element containing the editor. when using the default orion editor, this is a xul <xul:iframe> element. read only. lastfind object an object describing the result of the last find operation performed using the find(), findnext(), or findprevious() method. read only. this object has the following properties: property type description str string the last string that was searched for. ...

Mozilla Style System
the first of these rules is no longer important (in fact, the separation of the specified values into nscss* structs is no longer important). however, the second of these rules is the key to many of the performance and memory-use optimizations in the style system. most callers who interact with the style system do so using the style structs. the style context has a getter for each struct, and nsiframe, which represents the concept of a css box (or rendering object), also has getters that forward to the frame's style context. thus, typical calling code looks like this: if (aframe->getstyledisplay()->mopacity < 1.0f) return pr_true; or like this: const nsstyleposition *stylepos = aframe->getstyleposition(); if (stylepos->mwidth.getunit() == estyleunit_coord) { nscoord w = stylepos->...

Hacking Tips
can call the dumpheap before firefox function to dump out all gc things (reachable and unreachable) that are present in the heap. by default the function writes to stdout, but a filename can be specified as an argument. example output might look as follows: 0x1234abcd b global object ========== # zone 0x56789123 # compartment http://gmail.com [in zone 0x56789123] # compartment http://gmail.com/iframe [in zone 0x56789123] # arena allockind=3 size=64 0x1234abcd b object > 0x1234abcd b prop1 > 0xabcd1234 w prop2 0xabcd1234 w object > 0xdeadbeef b prop3 # arena allockind=5 size=72 0xdeadbeef w object > 0xabcd1234 w prop4 the output is textual. the first section of the file contains a list of roots, one per line. each root has the form "0xabcd1234 <color> <description>", where <color> is the col...

inIDOMUtils
rder of weight. getparentfornode() returns the parent of the specified node. nsidomnode getparentfornode( in nsidomnode anode, in boolean ashowinganonymouscontent ); parameters anode the node to return the parent of. ashowinganonymouscontent whether you are interested in the xbl flattened tree. return value returns the parent of a node. the parent of a document node is the frame/iframe containing that document. if you have requested anonymous content and the element's parent has an xbl binding then the element containing the insertion point is returned instead. getruleline() returns the line number of the specified css style rule in its source file. unsigned long getruleline( in nsidomcssstylerule arule ); parameters arule the style rule to retrieve the line number o...

mozIThirdPartyUtil
i of the principal associated with awindow. call this the 'bottom uri'. if auri is provided, determine if it is third party with respect to the bottom uri. if so, return. find the same-type parent window, if there is one, and its uri. determine whether it is third party with respect to the bottom uri. if so, return. therefore, each level in the window hierarchy is tested. (this means that nested iframes with different base domains, even though the bottommost and topmost uris might be equal, will be considered third party.) for example, if auri is "http://mail.google.com/", 'awindow' has a uri of "http://google.com/", and its parent is the topmost content window with a uri of "http://mozilla.com", the result will be true. boolean isthirdpartywindow( in nsidomwindow awindow, in nsiuri auri op...

nsIAccessibleProvider
see constants for details. read only. constants common use constants constant value description noaccessible 0 do not create an accessible for this object this is useful if an ancestor binding already implements nsiaccessibleprovider, but no accessible is desired for the inheriting binding. outerdoc 0x00000001 for elements that spawn a new document. for example now it is used by <xul:iframe>, <xul:browser> and <xul:editor>. xul controls constants constant value description xulalert 0x00001001 xulbutton 0x00001002 xulcheckbox 0x00001003 xulcolorpicker 0x00001004 xulcolorpickertile 0x00001005 xulcombobox 0x00001006 xuldropmarker 0x00001007 xulgroupbox 0x00001008 xulimage 0x00001009 xullink 0x0000100a xullistbox 0x0000100b xullistcell...

nsIContainerBoxObject
layout/xul/base/public/nsicontainerboxobject.idlscriptable please add a summary to this article. 1.0 66 introduced gecko 1.9 inherits from: nsisupports last changed in gecko 1.9 (firefox 3) the boxobject belonging to a xul browser, editor or iframe element implements this interface. attributes attribute type description docshell nsidocshell read only. the nsidocshell object that manages the contained document. the browser.xml, editor.xml and general.xml bindings use this property to gain access to other properties such as webnavigation, contentdocument and contentwindow. ...

nsIContentFrameMessageManager
it enables these scripts to receive messages from the chrome process and send messages back to the chrome process. ...

nsIDOMMozNetworkStatsManager
to filter a network statistics request made when calling getsamples(). it contains the following fields: appmanifesturl a string used to filter network stats by app. servicetype a string used to filter network stats by system service. browsingtrafficonly a boolean set to filter network stats by browsing traffic. if true, return only browsing traffic, which is generated from the mozbrowser iframe element within an app. if false or not set, the total traffic, which is generated from both the mozapp and mozbrowser iframe elements, is returned. for example, this object might be { appmanifesturl : manifesturl }. ...

nsIDOMWindow
dom/interfaces/base/nsidomwindow.idlscriptable this interface is the primary interface for a window object. it represents a single window object that may contain child windows if the document in the window contains an html frameset document, or if the document contains iframe elements. 66 introduced gecko 1.0 deprecated gecko 44 inherits from: nsisupports last changed in gecko 7.0 (firefox 7.0 / thunderbird 7.0 / seamonkey 2.4) starting with firefox 44, this file is empty as its features were either no longer used or are only available from c++ code; see dom/base/nspidomwindow.h for those. while this interface is not officially defined by any standard bodies, it originates from the de-facto dom level 0 standard. starting in firefox 3, dom windows ...

nsIDOMWindow2
inherits from: nsidomwindow last changed in gecko 1.9 (firefox 3) because nsidomwindow is frozen, this interface was introduced in firefox 3 (gecko 1.9) to allow dom windows to take on new features. ...

nsIDOMWindowInternal
if the name doesn't exist, then a new window is opened and the specified resource is loaded into its browsing context.">open(in domstring url, in domstring name, in domstring options) nsidomwindow nsisupports aextraargument) void close() void updatecommands(in domstring action) boolean find([optional] in domstring str,[optional...

nsIDOMWindowUtils
om the compositor process, return the corresponding dom element object. nsidomelement findelementwithviewid( in nsviewid aid ); parameters aid the id of the view for which to retrieve the corresponding nsidomelement object. return value the nsidomelement object for the html element drawn by the specified view id. note: for scrollable frames containing documents (that is, <frame> and <iframe>), the enclosed document's root element is returned. focus() focus the element aelement. the element should be in the same document that the window is displaying. pass null to blur the element, if any, that currently has focus, and focus the document. cannot be accessed from unprivileged context (not content-accessible) will throw a dom security error if called without universalxpconnect privi...

nsIDOMXULElement
tring name, in domstring value); attributes attribute type description align domstring gets/sets the value of the element's align attribute. allowevents boolean true if the element's allowevents attribute is the string "true", otherwise false. removes the attribute if you set it to false. boxobject nsiboxobject read only. gets or creates a box object for the element; browser, editor, iframe, listbox, menu, menupopup, scrollbox, tooltip and tree elements receive specialized box objects allowing access to additional properties not normally available from script. builder nsixultemplatebuilder read only. retrives the element's template builder, if it has a template. classname domstring gets/sets the value of the element's class attribute. collapsed boolean true if the element's co...

nsIDocShell
w javascript execution. allowmedia boolean attribute stating whether or not media (audio/video) should be loaded. allowmetaredirects boolean attribute stating if refresh based redirects can be allowed. allowplugins boolean whether to allow plugin execution. allowsubframes boolean attribute stating if it should allow subframes (framesets/iframes) or not. allowwindowcontrol boolean specifies whether or not content is allowed to control the window (that is, to resize or move the window). default is true, which lets content control the window. apptype unsigned long the type of application that created this window. types are defined in constants. busyflags unsigned long current busy state for do...

nsIDocumentLoader
it is also responsible for sending nsiwebprogresslistener notifications. inherits from: nsisupports last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) implemented by: @mozilla.org/docloaderservice;1. ...

nsIInProcessContentFrameMessageManager
return value the nsicontent object representing the owner's content. ...

nsIMessageWakeupService
t (either "getservice" or "createinstance"). a comma-separated list of messages for which your component should be instantiated. alternatively, it is possible to register a wakeup entry programmatically via the nsicategorymanager interface. currently, services must expose a wrappedjsobject in order to support this; however, once bug 593407 is fixed, the service to be woken up must implement nsiframemessagelistener. ...

nsINavHistoryQueryOptions
note that this has no effect on folder links, which are place: uris returned by nsinavbookmarkservice's getfolderuri method. these are always expanded and will appear as bookmark folders. includehidden boolean most items in history are marked "hidden." only toplevel pages that the user sees in the url bar are not hidden. hidden things include the content of iframes and all images on web pages. normally, you don't want these things. if you do, set this flag and you'll get all items, even hidden ones. does nothing for bookmark queries. defaults to false. maxresults long this is the maximum number of results that you want. the query is exeucted, the results are sorted, and then the top maxresults results are taken and returned. set...

nsINavHistoryService
vel window. transition_typed 2 this transition type is set when the user typed the url to get to the page. transition_bookmark 3 this transition type is set when the user followed a bookmark to get to the page. transition_embed 4 this transition type is set when some inner content is loaded. this is true of all images on a page, and the contents of the iframe. it is also true of any content in a frame, regardless if whether or not the user clicked something to get there. transition_redirect_permanent 5 this transition type is set when the transition was a permanent redirect. transition_redirect_temporary 6 this transition type is set when the transition was a temporary redirect. transition_download 7 this t...

nsIParserUtils
the context node for the fragment parsing algorithm. return value an nsidomdocumentfragment object for the resulting sanitized document fragment. sanitize() parses a string into an html document, sanitizes the document, and returns the result serialized to a string. the sanitizer is designed to protect against xss when sanitized content is inserted into a different-origin context without an iframe-equivalent sandboxing mechanism. by default, the sanitizer doesn't try to avoid leaking information that the content was viewed to third parties. that is, by default, for example <img> with a source pointing to an http server potentially controlled by a third party is not removed. to avoid ambient information leakage upon loading the sanitized content, use the sanitizerinternalembedsonly flag. i...

nsISHEntry
lean hasdetachededitor(); parameters none. return value true if this shistory entry is storing a detached editor. hasdynamicallyaddedchild() boolean hasdynamicallyaddedchild(); parameters none. return value true if any of the child entries returns true when isdynamicallyadded() is called on it. isdynamicallyadded() returns true if the related docshell was added because of dynamic addition of an iframe/frame. boolean isdynamicallyadded(); parameters none. return value violates the xpcom interface guidelines seteditordata() sets the owning pointer to the editor data assosicated with this shistory entry. unless forgeteditordata() is called, this shentry will destroy the editor data when it is destroyed. void seteditordata( in nsdocshelleditordataptr adata ); parameters adata setiss...

nsIWebBrowserFind
embedding/components/find/public/nsiwebbrowserfind.idlscriptable searches for text in a web browser. inherits from: nsisupports last changed in gecko 1.7 get one by doing a getinterface on an nsiwebbrowser. by default, the implementation will search the focused frame, or if there is no focused frame, the web browser content area. it does not by default search subframes or iframes. to change this behavior, and to explicitly set the frame to search, queryinterface to nsiwebbrowserfindinframes. method overview boolean findnext(); attributes attribute type description entireword boolean whether to match entire words only. default is false. findbackwards boolean whether to find backwards (towards the beginning of the document...

nsIWebBrowserFindInFrames
inherits from: nsisupports last changed in gecko 1.7 get an instance by doing a queryinterface from nsiwebbrowserfind. attributes attribute type description currentsearchframe nsidomwindow frame at which to start the search. once the search is done, this will be set to be the last frame searched, whether or not a result was found. has to be equal to or contained within the rootsearchframe. rootsearchframe nsidomwindow frame within which to confine the search (normally the content area frame). ...

nsIWebBrowserPersist
value description persist_flags_none 0 no special persistence behavior. persist_flags_from_cache 1 only use cached data (could result in failure if data is not cached). persist_flags_bypass_cache 2 bypass the cached data. persist_flags_ignore_redirected_data 4 ignore any redirected data (usually adverts). persist_flags_ignore_iframes 8 ignore iframe content (usually adverts). persist_flags_no_conversion 16 do not run the incoming data through a content converter for example to decompress it. persist_flags_replace_existing_files 32 replace existing files on the disk (use with due diligence!) persist_flags_no_base_tag_modifications 64 don't modify or add base tags. pe...

nsIWebProgressListener
nt request. this flag is set in addition to state_is_request. a document request supports the nsichannel interface and its loadflags attribute includes the nsichannel::load_document_uri flag. a document request does not complete until all requests associated with the loading of its corresponding document have completed. this includes other document requests (for example corresponding to html <iframe> elements). the document corresponding to a document request is available via the domwindow attribute of onstatechange()'s awebprogress parameter. state_is_network 0x00040000 this flag indicates that the state transition corresponds to the start or stop of activity in the indicated nsiwebprogress instance. this flag is accompanied by either state_start or state_stop, and it ma...

XPCOM Interface Reference by grouping
tree nsitreeboxobject nsitreecolumn nsitreecolumns nsitreecontentview nsitreeselection nsitreeview xform nsixformsmodelelement nsixformsnsinstanceelement nsixformsnsmodelelement xmlhttprequest nsixmlhttprequesteventtarget favicon nsifavicondatacallback nsifaviconservice frame nsichromeframemessagemanager nsiframeloader nsiframeloaderowner nsiframemessagelistener nsiframemessagemanager interface nsijsxmlhttprequest jetpack nsijetpack nsijetpackservice offlinestorage nsiapplicationcache nsiapplicationcachechannel nsiapplicationcachecontainer nsiapplicationcachenamespace nsiapplicationcacheservice places nsiannotationobserver ...

Browser Toolbox - Firefox Developer Tools
a specific add-on that is restartless or sdk-based then try the add-on debugger.) console style editor performance network monitor page inspector accessibility inspector you can debug chrome: and about: pages using the normal debugger, just as if they were ordinary content pages. targeting a document in the normal toolbox, there's a button in the toolbar enabling you to target specific iframes in the document. the same button appears in the browser toolbox where it lists all the top-level chrome and content windows as well as any iframes they contain. this enables you to inspect documents in individual chrome windows and popups, as well as in content tabs. for example, here's what the frame selection popup lists when there are two browser windows open, one with one content tab, and o...

DOM Property Viewer - Firefox Developer Tools
enabling the dom property viewer the dom property viewer is not enabled by default. to enable it, open the developer tool settings and check the "dom" box under "default firefox developer tools". ...

Debugger.Object - Firefox Developer Tools
rovides "host objects" to expose application-specific functionality to scripts. the hostannotations accessor consults the embedding for additional information about the referent that might be of interest to the debugger. the returned object's properties' meanings are up to the embedding. for example, a web browser might provide host annotations for global objects to distinguish top-level windows, iframes, and internal javascript scopes. by convention, host annotation objects have a string-valued "type" property that, taken together with the object's class, indicate what sort of thing the referent is. the host annotation object's other properties provide further details, as appropriate for the type. for example, in firefox, a metadata object for a javascript module's global object might look li...

Examine and edit HTML - Firefox Developer Tools
as the last child of the currently selected element. you can then edit the new node's content and styling just as you would any other node in the document. you can access the same functionality using the "create new node" popup menu item. note that this button is disabled if the selected element's type is such that adding a last-child would have no effect (for example, if is is an <html> or <iframe> element). however, it is enabled in places where it is not valid to insert a <div>, such as <style> or <link>. in these cases the element is added as text. ...

Settings - Firefox Developer Tools
the settings pane looks something like this: categories default firefox developer tools this group of checkboxes determines which tools are enabled in the toolbox. new tools are often included in firefox but not enabled by default. available toolbox buttons this group of checkboxes determines which tools get an icon in the toolbox's toolbar. as of firefox 62, if the option to "select an iframe as the currently targeted document" is checked, the icon will appear in the toolbar while the settings tab is displayed, even if the current page doesn't include any iframes. note that in firefox 52 we removed the checkbox to toggle the "select element" button. the "select element" button is now always shown. themes this enables you to choose one of two themes. there's a light theme, whi...

Tips - Firefox Developer Tools
ecting nodes in the command line: $0 references the currently selected node. $() is a shortcut to document.queryselector(). $$() returns an array with the results from document.queryselectorall(). copy copies anything as a string. right-click a node in the inspector and click "use in console" to create a tempn variable for it. cd switches the javascript evaluation context to a different iframe in the page. console.table() displays tabular data as table. help opens the mdn page describing the available commands. :screenshot <filename.png> --fullpage saves a screenshot to your downloads directory using the optional file name. if no filename is included, the file name will be in this format: screen shot date at time.png the --fullpage parameter is optional. if you include it,...

Console messages - Firefox Developer Tools
lows user login credentials to be stolen. pages containing login forms must be served over https, not http. password fields present in a form with an insecure (http://) form action. this is a security risk that allows user login credentials to be stolen. forms containing password fields must submit them over https, not http. password fields present on an insecure (http://) iframe. this is a security risk that allows user login credentials to be stolen. iframes containing login forms must be served over https, not http. the site specified an invalid strict-transport-security header. see http strict transport security for more details. this site makes use of a sha-1 certificate; it's recommended you use certificates with signature algorithms tha...

Web Console Helpers - Firefox Developer Tools
ponding string: "number", "string", "bool", "node", or "nodes"; if not provided, any_type is used. :block (starting in firefox 80) followed by an unquoted string, blocks requests where the url contains that string. in the network monitor, the string now appears and is selected in the request blocking sidebar. unblock with :unblock. cd() switches javascript evaluation context to a different iframe in the page. this helper accepts multiple different ways of identifying the frame to switch to. you can supply any of the following: a selector string to be passed to document.queryselector to locate the iframe element the iframe element itself the content window inside the iframe see working with iframes. clear() clears the console output area. clearhistory() just like a norma...

AuthenticatorAssertionResponse.signature - Web APIs
server for control, as part of the response. it provides the proof that an authenticator does possess the private key which was used for the credential's generation. note: an authenticatorassertionresponse instance is available on publickeycredential.response after calling navigator.credentials.get(). note: this property may only be used in top-level contexts and will not be available in an <iframe> for example. syntax signature = authenticatorassertionresponse.signature value an arraybuffer object which the signature of the authenticator (using its private key) for both authenticatorassertionresponse.authenticatordata and a sha-256 hash given by the client for its data (the challenge, the origin, etc. and available from authenticatorassertionresponse.clientdatajson). examples var op...

AuthenticatorAssertionResponse.userHandle - Web APIs
g credentials and other data. the same value may be found on the id property of the options.user object (used for the creation of the publickeycredential instance). note: an authenticatorassertionresponse instance is available on publickeycredential.response after calling navigator.credentials.get(). note: this property may only be used in top-level contexts and will not be available in an <iframe> for example. syntax userhandle = authenticatorassertionresponse.userhandle value an arraybuffer object which is an opaque identifier for the current user. this is not human-readable and does not contain any personally identifying information (e.g. username, e-mail, phone number, etc.) examples var options = { challenge: new uint8array(26), // will be another value, provided by the relyi...

AuthenticatorAssertionResponse - Web APIs
authenticatorassertionresponse interface of the web authentication api is returned by credentialscontainer.get() when a publickeycredential is passed, and provides proof to a service that it has a key pair and that the authentication request is valid and approved. this interface inherites from authenticatorresponse. note: this interface is restricted to top-level contexts. use from within an <iframe> element will not have any effect. properties authenticatorassertionresponse.clientdatajson secure contextread only the client data for the authentication, such as origin and challenge. the clientdatajson property is inherited from the authenticatorresponse. authenticatorassertionresponse.authenticatordata secure contextread only an arraybuffer containing information from the authentica...

AuthenticatorAttestationResponse.getTransports() - Web APIs
ts which may be used by the authenticator. such transports may be usb, nfc, ble or internal (applicable when the authenticator is not removable from the device). note: an authenticatorattestationresponse instance is available on publickeycredential.response after calling navigator.credentials.create(). note: this method may only be used in top-level contexts and will not be available in an <iframe> for example. syntaxe arrtransports = authenticatorattestationresponse.gettransports() parameters none. return value an array containing the different transports supported by the authenticator or nothing if this information is not available.of the processing of the different extensions by the client. the elements of this array are supposed to be in lexicographical order. their values may b...

AuthenticatorAttestationResponse - Web APIs
ed by credentialscontainer.create() when a publickeycredential is passed, and provides a cryptographic root of trust for the new key pair that has been generated. this response should be sent to the relying party's server to complete the creation of the credential. this interface inherites from authenticatorresponse. note: this interface is restricted to top-level contexts. use from within an <iframe> element will not have any effect. properties authenticatorattestationresponse.clientdatajson secure contextread only client data for the authentication, such as origin and challenge. the clientdatajson property is inherited from the authenticatorresponse. authenticatorattestationresponse.attestationobject secure contextread only an arraybuffer containing authenticator data and an attes...

BroadcastChannel: message event - Web APIs
the message event is fired on a broadcastchannel object when a message arrives on that channel. bubbles no cancelable no interface messageevent event handler property onmessage examples live example in this example there's a "sender" <iframe> that broadcasts the contents of a <textarea> when the user clicks a button. there are two "receiver" iframes that listen to the broadcast message and write the result into a <div> element. sender <h1>sender</h1> <label for="message">type a message to broadcast:</label><br/> <textarea id="message" name="message" rows="1" cols="40">hello</textarea> <button id="broadcast-message" type="button">broadcast message</button> body { border: 1px solid black; padding: .5rem; height: 150px; ...

BroadcastChannel - Web APIs
messages are broadcasted via a message event fired at all broadcastchannel objects listening to the channel. note: this feature is available in web workers. ...

Broadcast Channel API - Web APIs
note: this feature is available in web workers. by creating a broadcastchannel object, you can receive any messages that are posted to it. you don't have to maintain a reference to the frames or workers you wish to communicate with: they can “subscribe” to a particular channel by constructing their own broadcastchannel with the same name, and have bi-directional communication between all of them. ...

Managing screen orientation - Web APIs
locking the screen orientation warning: this api is experimental and currently available on firefox os and firefox for android with a moz prefix, and for internet explorer on windows 8.1 and above with a ms prefix. some devices (mainly mobile devices) can dynamically change the orientation of the screen based on their own orientation, ensuring that the u...

Credential Management API - Web APIs
address these problems, the credential management api provides ways for a website to store and retrieve different types of credentials. this give users capabilities such as seeing the federated account they used to sign on to a site, or resuming a session without the explicit sign-in flow of an expired session. this api is restricted to top-level contexts. calls to get() and store() within an <iframe> element will resolve without effect. subdomain-shared credentials later version of the spec allow credentials to be retrieved from a different subdomain. for example, a password stored in login.example.com may be used to log in to www.example.com. to take advantage of this, a password must be explicitly stored by calling credentialscontainer.store(). this is sometimes referred to as public su...

CredentialsContainer.create() - Web APIs
syntax var promise = credentialscontainer.create([options]) parameters options an object of type credentialcreationoptions that contains options for the requested new credentials object. ...

CredentialsContainer.get() - Web APIs
ay display a dialog to the user and ask the user to make the selection. this method collects credentials by calling the "collectfromcredentialstore" method for each credential type allowed by the options argument. for example: if options.password exists, then the passwordcredential.[[collectfromcredentialstore]] is called. this method is restricted to top-level contexts. calls to it within an <iframe> element will resolve without effect. syntax var promise = credentialscontainer.get([options]) parameters options optional an object of type credentialrequestoptions that contains options for the request. the options include criteria that the credentials are required or allowed to have, and options for interacting with the user. it can contain the following properties: password: a boo...

CredentialsContainer.store() - Web APIs
syntax credentialscontainer.store(credential).then(function(credential) { ... } ) parameters credentials a valid credential instance. ...

DOMTokenList - Web APIs
it is indexed beginning with 0 as with javascript array objects. domtokenlist is always case-sensitive. properties domtokenlist.length read only is an integer representing the number of objects stored in the object. domtokenlist.value a stringifier property that returns the value of the list as a domstring. ...

Detecting device orientation - Web APIs
warning: chrome and firefox do not handle the angles the same way, so on some axes the direction are reversed. processing motion events motion events are handled the same way as the orientation events except that they have their own event's name: devicemotion window.addeventlistener("devicemotion", handlemotion, true); what's really changed are the information provide...

Document.cookie - Web APIs
okie "reader" has "1" for value') } //es2016 if (document.cookie.split(';').some((item) => item.includes('reader=1'))) { console.log('the cookie "reader" has "1" for value') } security it is important to note that the path attribute does not protect against unauthorized reading of the cookie from a different path. it can be easily bypassed using the dom, for example by creating a hidden <iframe> element with the path of the cookie, then accessing this iframe's contentdocument.cookie property. the only way to protect the cookie is by using a different domain or subdomain, due to the same origin policy. cookies are often used in web application to identify a user and their authenticated session. so stealing the cookie from a web application, will lead to hijacking the authenticated user'...

Document.designMode - Web APIs
lows this standard. the earlier versions of chrome and ie default to "inherit". starting in chrome 43, the default is "off" and "inherit" is no longer supported. in ie6-10, the value is capitalized. syntax var mode = document.designmode; document.designmode = value; value a string indicating whether designmode is (or should be) set to on or off. valid values are on and off. example make an <iframe>'s document editable: iframenode.contentdocument.designmode = "on"; specifications specification status comment html living standardthe definition of 'designmode' in that specification. living standard initial definition. ...

Document.domain - Web APIs
y the same origin policy. if this property is successfully set, the port part of the origin is also set to null. syntax const domainstring = document.domain document.domain = domainstring value the domain portion of the current document's origin. ...

Document.featurePolicy - Web APIs
the featurepolicy read-only property of the document interface returns the featurepolicy interface which provides a simple api for inspecting the feature policies applied to a specific document. syntax var policy = iframeelement.featurepolicy value a featurepolicy object that can be used to inspect the feature policy settings applied to the document. specification specification status comment feature policy editor's draft initial definition. ...

Document.fullscreenEnabled - Web APIs
although this property is read-only, it will not throw if it is modified (even in strict mode); the setter is a no-operation and it will be ignored. ...

Document: keydown event - Web APIs
by clicking in it), then try pressing some keys.</p> <p id="log"></p> document.addeventlistener('keydown', logkey); function logkey(e) { log.textcontent += ` ${e.code}`; } onkeydown equivalent document.onkeydown = logkey; specifications specification status ui events working draft ...

Document: keypress event - Web APIs
ut or keydown instead. interface keyboardevent bubbles yes cancelable yes default action varies: keypress event; launch text composition system; blur and focus events; domactivate event; other event examples addeventlistener keypress example this example logs the keyboardevent.code value whenever you press a key. ...

Document: keyup event - Web APIs
ion, do something like this (229 is a special value set for a keycode relating to an event that has been processed by an ime): eventtarget.addeventlistener("keyup", event => { if (event.iscomposing || event.keycode === 229) { return; } // do something }); examples this example logs the keyboardevent.code value whenever you release a key. addeventlistener keyup example <p>focus the iframe first (e.g. by clicking in it), then try pressing some keys.</p> <p id="log"></p> const log = document.getelementbyid('log'); document.addeventlistener('keyup', logkey); function logkey(e) { log.textcontent += ` ${e.code}`; } onkeyup equivalent document.onkeyup = logkey; specifications specification status ui events working draft ...

Document.referrer - Web APIs
ocument.referrer property returns the uri of the page that linked to this page. syntax var referrer = document.referrer; value the value is an empty string if the user navigated to the page directly (not through a link, but, for example, by using a bookmark). because this property returns only a string, it doesn't give you document object model (dom) access to the referring page. inside an <iframe>, the document.referrer will initially be set to the same value as the href of the parent window's window.location. specifications specification status comment html living standardthe definition of 'document.referrer' in that specification. living standard ...

Document.write() - Web APIs
y document served with an application/xhtml+xml mime type. more information is available in the w3c xhtml faq. note: using document.write() in deferred or asynchronous scripts will be ignored and you'll get a message like "a call to document.write() from an asynchronously-loaded external script was ignored" in the error console. note: in edge only, calling document.write() more than once in an <iframe> causes the error "script70: permission denied". note: starting with version 55, chrome will not execute <script> elements injected via document.write() when specific conditions are met. for more information, refer to intervening against document.write(). specifications specification status comment html living standardthe definition of 'document.write(...)' in that ...

DocumentOrShadowRoot.elementFromPoint() - Web APIs
the elementfrompoint() method—available on both the document and shadowroot objects—returns the topmost element at the specified coordinates (relative to the viewport). if the element at the specified point belongs to another document (for example, the document of an <iframe>), that document's parent element is returned (the <iframe> itself). if the element at the given point is anonymous or xbl generated content, such as a textbox's scroll bars, then the first non-anonymous ancestor element (for example, the textbox) is returned. elements with pointer-events set to none will be ignored, and the element below it will be returned. if the method is run on another document (like an <iframe>'s subdocument), the coordinates are relative to the document where the method is being called. if th...

Element.msZoomTo() - Web APIs
element is not zoomable. animate[in]: the type of animation to use. default: uses the default animation. none: no animation is used. this method has no scrolling effect on non-scrollable elements and no zooming effect on non-zoomable elements (e.g., elements with "-ms-content-zooming: none"). this method has no effect if called from a parent document to scroll or zoom content hosted in an iframe. return value this method does not return a value. example /* zooming in on an element while still keeping it centered in the viewport */ var args = { contentx: target.offsetleft + target.offsetwidth/2; contenty: target.offsettop + target.offsetheight/2; scalefactor: 2.0; } zoomer.mszoomto(args); see also microsoft api extensions ...

Element.name - Web APIs
note: the name property doesn't exist for other elements; unlike tagname and nodename, it is not a property of the node, element or htmlelement interfaces. name can be used in the document.getelementsbyname() method, a form and with the form elements collection. when used with a form or elements collection, it may return a single element or a collection. ...

Element.requestFullscreen() - Web APIs
on or other access control features. the element and its document are the same node. usage notes compatible elements an element that you wish to place into full-screen mode has to meet a small number of simple requirements: it must be one of the standard html elements or <svg> or <math>. it is not a <dialog> element. it must either be located within the top-level document or in an <iframe> which has the allowfullscreen attribute applied to it. additionally, of course, the feature policy "fullscreen" permission must be granted. detecting full-screen activation you can determine whether or not your attempt to switch to full-screen mode is successful by using the promise returned by requestfullscreen(), as seen in the example below. to learn when other code has toggled full-scre...

Event.timeStamp - Web APIs
ar event. syntax time = event.timestamp; value this value is the number of milliseconds elapsed from the beginning of the current document's lifetime till the event was created. in newer implementations, the value is a domhighrestimestamp accurate to 5 microseconds (0.005 ms). in older implementations, the value is a domtimestamp, accurate to a millisecond. example html <p> focus this iframe and press any key to get the current timestamp for the keypress event. </p> <p>timestamp: <span id="time">-</span></p> javascript function gettime(event) { var time = document.getelementbyid("time"); time.firstchild.nodevalue = event.timestamp; } document.body.addeventlistener("keypress", gettime); result reduced time precision to offer protection against timing attacks and fingerpri...

FetchEvent.respondWith() - Web APIs
fetch() is intercepted, then you can observe the final url on the result's response.url. if a worker script is intercepted, then the final url is used to set self.location and used as the base url for relative urls in the worker script. if a stylesheet is intercepted, then the final url is used as the base url for resolving relative @import loads. note that navigation requests for windows and iframes do not use the final url. the way the html specification handles redirects for navigations ends up using the request url for the resulting window.location. this means sites can still provide an "alternate" view of a web page when offline without changing the user-visible url. syntax fetchevent.respondwith( // promise that resolves to a response. ​); parameters a response or a promise t...

Introduction to the File and Directory Entries API - Web APIs
ave a relationship to the local file system outside the browser. what this means is that a web app and a desktop app cannot share the same file at the same time. the api does not let your web app reach outside the browser to files that desktop apps can also work on. you can, however, export a file from a web app to a desktop app. for example, you can use the file api, create a blob, redirect an iframe to the blob, and invoke the download manager. the file and directory entries api can use different storage types an application can request temporary or persistent storage. temporary storage is easier to get, because the browser just gives it to you, but it is limited and can be deleted by the browser when it runs out of space. persistent storage, on the other hand, might offer you larger space...

Guide to the Fullscreen API - Web APIs
ment again receives a fullscreenchange event. note that the fullscreenchange event doesn't provide any information itself as to whether the document is entering or exiting fullscreen mode, but if the document has a non null fullscreenelement, you know you're in fullscreen mode. when a fullscreen request fails it's not guaranteed that you'll be able to switch into fullscreen mode. for example, <iframe> elements have the allowfullscreen attribute in order to opt-in to allowing their content to be displayed in fullscreen mode. in addition, certain kinds of content, such as windowed plug-ins, cannot be presented in fullscreen mode. attempting to put an element which can't be displayed in fullscreen mode (or the parent or descendant of such an element) won't work. instead, the element which reques...

contentDocument - Web APIs
if the iframe and the iframe's parent document are same origin, returns a document (that is, the active document in the inline frame's nested browsing context), else returns null. example of contentdocument var iframedocument = document.getelementsbytagname("iframe")[0].contentdocument; iframedocument.body.style.backgroundcolor = "blue"; // this would turn the iframe blue. specifications specification status comment html living standardthe definition of 'htmliframeelement: contentdocument' in that specification. living standard ...

srcdoc - Web APIs
the srcdoc property of the htmliframeelement specifies the content of the page. examples var iframe = document.createelement("iframe"); iframe.srcdoc = `<!doctype html><p>hello world!</p>`; document.body.appendchild(iframe); specifications specification status comment html living standardthe definition of 'htmliframeelement: srcdoc' in that specification. living standard ...

HTMLImageElement.x - Web APIs
ement, or by being located within a column described by either <col> or <colgroup>. syntax let imagex = htmlimageelement.x; value an integer value indicating the distance in pixels from the left edge of the element's nearest root element and the left edge of the <img> element's border box. the nearest root element is the outermost <html> element that contains the image. if the image is in an <iframe>, its x is relative to that frame. in the diagram below, the left border edge is the left edge of the blue padding area. so the value returned by x would be the distance from that point to the left edge of the content area. note: the x property is only valid if the computed value of the image's display property is either table-column or table-column-group; in other words, either of those are...

HTMLImageElement.y - Web APIs
element, or by being located within a column described by either <col> or <colgroup>. syntax let imagey = htmlimageelement.y; value an integer value indicating the distance in pixels from the top edge of the element's nearest root element to the top edge of the <img> element's border box. the nearest root element is the outermost <html> element that contains the image. if the image is in an <iframe>, its y is relative to that frame. in the diagram below, the top border edge is the top edge of the blue padding area. so the value returned by y would be the distance from that point to the top edge of the content area. note: the y property is only valid if the computed value of the image's display property is either table-column or table-column-group; in other words, either of those are se...

In depth: Microtasks and the JavaScript runtime environment - Web APIs
he word "window" actually means "browser-level container that web content runs within," including an actual window, a tab, or a frame. there are specific circumstances in which this sharing of an event loop among windows with a common origin is possible, such as: if one window opened the other window, they are likely to be sharing an event loop. if a window is actually a container within an <iframe>, it likely shares an event loop with the window that contains it. the windows happen to share the same process in a multi-process web browser implementation. the specifics may vary from browser to browser, depending on how they're implemented. tasks vs microtasks a task is any javascript scheduled to be run by the standard mechanisms such as initially starting to execute a program, an event...

The HTML DOM API - Web APIs
t htmlareaelement htmlaudioelement htmlbrelement htmlbaseelement htmlbodyelement htmlbuttonelement htmlcanvaselement htmldlistelement htmldataelement htmldatalistelement htmldetailselement htmldialogelement htmldirectoryelement htmldivelement htmlelement htmlembedelement htmlfieldsetelement htmlformelement htmlhrelement htmlheadelement htmlheadingelement htmlhtmlelement htmliframeelement htmlimageelement htmlinputelement htmllielement htmllabelelement htmllegendelement htmllinkelement htmlmapelement htmlmediaelement htmlmenuelement htmlmetaelement htmlmeterelement htmlmodelement htmlolistelement htmlobjectelement htmloptgroupelement htmloptionelement htmloutputelement htmlparagraphelement htmlparamelement htmlpictureelement htmlpreelement htmlprogress...

Basic concepts - Web APIs
ng data with a different origin. for example, while an app or a page in http://www.example.com/app/ can retrieve data from http://www.example.com/dir/, because they have the same origin, it cannot retrieve data from http://www.example.com:8080/dir/ (different port) or https://www.example.com/dir/ (different protocol), because they have different origins. note: third party window content (e.g. <iframe> content) can access the indexeddb store for the origin it is embedded into, unless the browser is set to never accept third party cookies (see bug 1147821.) definitions this section defines and explains terms used in the indexeddb api. database database a repository of information, typically comprising one or more object stores. each database must have the following: name. this ide...

Intersection Observer API - Web APIs
ining block's clipping (if any) is applied to the intersection rectangle. a block's clipping is determined based on the intersection of the two blocks and the clipping mode (if any) specified by the overflow property. setting overflow to anything but visible causes clipping to occur. if one of the containing elements is the root of a nested browsing context (such as the document contained in an <iframe>, the intersection rectangle is clipped to the containing context's viewport, and recursion upward through the containers continues with the container's containing block. so if the top level of an <iframe> is reached, the intersection rectangle is clipped to the frame's viewport, then the frame's parent element is the next block recursed through toward the intersection root. when recursion upwar...

Long Tasks API - Web APIs
any uninterrupted period where the main ui thread is busy for 50 ms or longer. common examples include: long running event handlers. expensive reflows and other re-renders. work the browser does between different turns of the event loop that exceeds 50 ms. culprit browsing context container the "culprit browsing context container", or "the container" for short, is the top level page, iframe, embed or object that the task occurred within. attributions a list of containers that the task occurred within. for tasks that don't occur within the top level page, the containerid, containername and containersrc fields may provide information as to the source of the task. usage var observer = new performanceobserver(function(list) { var perfentries = list.getentries(); for (var i =...

MessagePort: message event - Web APIs
the message event is fired on a messageport object when a message arrives on that channel. ...

MessagePort: messageerror event - Web APIs
the messageerror event is fired on a messageport object when it receives a message that can't be deserialized. ...

MouseEvent.pageX - Web APIs
s. see browser compatibility to learn which browsers have been updated to use the revised data type. example more examples you can also see an example that demonstrates how to access the mouse position information in every available coordinate system. let's take a look at a simple example that shows you the mouse's position relative to the page's origin. since this example is presented in an <iframe>, that top-left corner is the top-left corner of the frame, not the browser window. javascript var box = document.queryselector(".box"); var pagex = document.getelementbyid("x"); var pagey = document.getelementbyid("y"); function updatedisplay(event) { pagex.innertext = event.pagex; pagey.innertext = event.pagey; } box.addeventlistener("mousemove", updatedisplay, false); box.addeventliste...

Navigator.cookieEnabled - Web APIs
navigator.cookieenabled returns a boolean value that indicates whether cookies are enabled or not. the property is read-only. syntax var cookieenabled = navigator.cookieenabled; cookieenabled is a boolean: true or false. note: when the browser is configured to block third-party cookies, and navigator.cookieenabled is invoked inside a third-party iframe, it returns true in safari, edge spartan and ie (while trying to set a cookie in such scenario would fail). it returns false in firefox and chromium-based browsers. note: web browsers may prevent writing certain cookies in certain scenarios. for example, chrome 80+ does not allow creating cookies with samesite=none attribute, unless they are created over https and with secure attribute. example if (!navigator.cookieenabled) { // the ...

Notification.requestPermission() - Web APIs
cation if (permission === "granted") { var notification = new notification("hi there!"); } }); } // at last, if the user has denied notifications, and you // want to be respectful there is no need to bother them any more. } we no longer show a live sample on this page, as chrome and firefox no longer allow notification permissions to be requested from cross-origin <iframe>s, with other browsers to follow. to see a example in action, check out our to-do list example (also see the app running live.) note: in the above example we spawn notifications in response to a user gesture (clicking a button). this is not only best practice — you should not be spamming users with notifications they didn't agree to — but going forward browsers will explicitly disallow noti...

Notification - Web APIs
cation if (permission === "granted") { var notification = new notification("hi there!"); } }); } // at last, if the user has denied notifications, and you // want to be respectful there is no need to bother them any more. } we no longer show a live sample on this page, as chrome and firefox no longer allow notification permissions to be requested from cross-origin <iframe>s, with other browsers to follow. to see a example in action, check out our to-do list example (also see the app running live.) note: in the above example we spawn notifications in response to a user gesture (clicking a button). this is not only best practice — you should not be spamming users with notifications they didn't agree to — but going forward browsers will explicitly disallow noti...

Using the Notifications API - Web APIs
disallow notification permission requests not triggered in response to a user gesture. firefox is already doing this from version 72, for example, and safari has done it for some time. in addition, in chrome and firefox you cannot request notifications at all unless the site is a secure context (i.e. https), and you can no longer allow notification permissions to be requested from cross-origin <iframe>s. checking current permission status you can check to see if you already have permission by checking the value of the notification.permission read only property. it can have one of three possible values: default the user hasn't been asked for permission yet, so notifications won't be displayed. granted the user has granted permission to display notifications, after having been asked prev...

PasswordCredential - Web APIs
constructor passwordcredential()secure context creates a new passwordcredential object. properties inherits properties from its ancestor, credential. ...

Payment Request API - Web APIs
yment, a web page creates a paymentrequest object in response to a user action that initiates a payment, such as clicking a "purchase" button. the paymentrequest allows the web page to exchange information with the user agent while the user provides input to complete the transaction. you can find a complete guide in using the payment request api. note: the api is available inside cross-origin <iframe> elements only if they have had the allowpaymentrequest attribute set on them. interfaces paymentaddress an object that contains address information; used for billing and shipping addresses, for example. paymentrequest an object that provides the api for creating and managing the user agent's payment interface. paymentrequestevent an event delivered to a payment handler when a paymentre...

PublicKeyCredential.getClientExtensionResults() - Web APIs
ationoptions.extensions and publickeycredentialrequestoptions.extensions. note: extensions are optional and different browsers may recognize different extensions. all extensions are optional for the client to process them: if a browser does not know of a given extension, that will not cause any failure. note: this method may only be used in top-level contexts and will not be available in an <iframe> for example. syntax maparraybuffer = publickeycredential.getclientextensionresults() parameters none. return value an arraybuffer containing the result of the processing of the different extensions by the client. this object contains a map between the extensions' identifiers and their results from the processing. warning! as of march 2019, only appid (used during creation with publickey...

PublicKeyCredential.id - Web APIs
the id read-only property of the publickeycredential interface is a domstring, inherited from credential, which represents the identifier of the current publickeycredential instance. this property is a base64url encoded version of publickeycredential.rawid. note: this property may only be used in top-level contexts and will not be available in an <iframe> for example. syntax id = publickeycredential.id value a domstring being the base64url encoded version of publickeycredential.rawid. examples var publickey = { challenge: new uint8array(26) /* this actually is given from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint8array(26), /* to be changed for each user */ name: "jdoe@example.com", displayname: "john doe"...

PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable() - Web APIs
enticator that is part of the client device (it is generally not removable) and that involves an action from the user in order to identify them. at the time of this writing, this method's result only resolves to true on windows when windows hello capabilities are available (on recent versions of this os). note: this method may only be used in top-level contexts and will not be available in an <iframe> for example. syntax publickeycredential.isuserverifyingplatformauthenticatoravailable() parameters none. return value a promise which resolves to a boolean indicating whether or a not a user-verifying platform authenticator is available. as of today (march 2019), this is basically indicating if windows hello may be used with the web authentication api and that the user has accepted its us...

PublicKeyCredential.rawId - Web APIs
syntax rawid = publickeycredential.rawid value a arraybuffer containing the identifier of the credentials. ...

PublicKeyCredential.response - Web APIs
h: this response the extensions of the client (given by publickeycredential.getclientextensionresults()) to validate the demand. note: when validating the fetching of existing credentials, the whole publickeycredential object and the client extensions are necessary for the relying party's server. note: this property may only be used in top-level contexts and will not be available in an <iframe> for example. syntax response = publickeycredential.response value an authenticatorresponse object containing the data a relying party's script will receive and which should be sent to the relying party's server in order to validate the demand for creation or fetching. this object contains data from the client (authenticatorresponse/clientdatajson) and from the authenticator. examples var ...

PublicKeyCredential - Web APIs
gging in to a service using an un-phishable and data-breach resistant asymmetric key pair instead of a password. it inherits from credential, and was created by the web authentication api extension to the credential management api. other interfaces that inherit from credential are passwordcredential and federatedcredential. note: this api is restricted to top-level contexts. use from within an <iframe> element will not have any effect. properties publickeycredential.type read only secure context inherited from credential. always set to public-key for publickeycredential instances. publickeycredential.id read only secure context inherited from credential and overridden to be the base64url encoding of publickeycredential.rawid. publickeycredential.rawid read only secure context an arra...

Request.mode - Web APIs
example in the following snippet, we create a new request using the request.request() constructor (for an image file in the same directory as the script), then save the request mode in a variable: var myrequest = new request('flowers.jpg'); var mymode = myrequest.mode; // returns "cors" by default specifications specification status comment fetchthe definit...

Request - Web APIs
e likely to encounter a request object being returned as the result of another api operation, such as a service worker fetchevent.request. constructor request() creates a new request object. properties request.cache read only contains the cache mode of the request (e.g., default, reload, no-cache). request.context read only contains the context of the request (e.g., audio, image, iframe, etc.) request.credentials read only contains the credentials of the request (e.g., omit, same-origin, include). the default is same-origin. request.destination read only returns a string from the requestdestination enum describing the request's destination. this is a string indicating the type of content being requested. request.headers read only contains the associated headers object o...

Screen Capture API - Web APIs
isplaycapturesurfacetype an enumerated string type which is used to identify the kind of display surface to capture. this type is used for the displaysurface property in the constraints and settings objects, and has the possible values application, browser, monitor, and window. feature policy validation user agents that support feature policy (either using http's feature-policy header or the <iframe> attribute allow) can specify a desire to use the screen capture api using the policy control directive display-capture: <iframe allow="display-capture" src="/some-other-document.html"> the default allow list is self, which lets the any content within the document use screen capture. see using feature policy for a more in-depth explanation of how feature policy is used. specifications ...

Sensor APIs - Web APIs
an alternative approach is to attempt to use the error and listen for the securityerror. const sensor = new absoluteorientationsensor(); sensor.start(); sensor.onerror = event => { if (event.error.name === 'securityerror') console.log("no permissions to use absoluteorientationsensor."); }; the following table describes for each sensor type, the name required for the permissions api, the <iframe> element's allow attribute and the feature-policy directive. sensor permissions sensor permission/feature policy name absoluteorientationsensor 'accelerometer', 'gyroscope', and 'magnetometer' accelerometer 'accelerometer' ambientlightsensor 'ambient-light-sensor' gyroscope 'gyroscope' linearaccelerationsensor 'accelero...

SharedWorker - Web APIs
they implement an interface different than dedicated workers and have a different global scope, sharedworkerglobalscope. note: if sharedworker can be accessed from several browsing contexts, all those browsing contexts must share the exact same origin (same protocol, host and port). constructors sharedworker() creates a shared web worker that executes the script at the specified url. ...

TaskAttributionTiming.containerId - Web APIs
that is being implicated, on the whole, for a long task. syntax var containerid = taskattributiontiming.containerid; value a domstring containing the containers id attribute. specifications specification status comment long tasks api 1the definition of 'containerid' in that specification. working draft initial definition. browser compatibility the compatibility table on this page is generated from structured data. ...

TaskAttributionTiming.containerName - Web APIs
that is being implicated, on the whole, for a long task. syntax var containername = taskattributiontiming.containername; value a domstring containing the container's name attribute. ...

TaskAttributionTiming.containerSrc - Web APIs
that is being implicated, on the whole, for a long task. syntax var containersrc = taskattributiontiming.containersrc; value a domstring containing the container's src attribute. ...

TaskAttributionTiming.containerType - Web APIs
specifications specification status comment long tasks api 1the definition of 'containertype' in that specification. working draft initial definition. browser compatibility the compatibility table on this page is generated from structured data. ...

VisualViewport - Web APIs
the visualviewport interface of the visual viewport api represents the visual viewport for a given window. for a page containing iframes, each iframe, as well as the containing page, will have a unique window object. each window on a page will have a unique visualviewport representing the properties associated with that window. you can get a window's visual viewport using window.visualviewport. note: only the top-level window has a visual viewport that's distinct from the layout viewport. therefore, it's generally only the visualviewport object of the top-level window that's useful. for an <iframe>, visual viewport metrics like visualviewport.width always correspond to layout viewport metrics like document.documentelement.clientwidth. properties visualviewport also inherits properties f...

Web Storage API - Web APIs
ed. a different storage object is used for the sessionstorage and localstorage for each origin — they function and are controlled separately. note: from firefox 45 onwards, when the browser crashes/restarts, the amount of data saved per origin is limited to 10mb. this has been done to avoid memory issues caused by excessive usage of web storage. note: access to web storage from third-party iframes is denied if the user has disabled third-party cookies (firefox implements this behaviour from version 43 onwards.) note: web storage is not the same as mozstorage (mozilla's xpcom interfaces to sqlite) or the session store api (an xpcom storage utility for use by extensions). web storage interfaces storage allows you to set, retrieve and remove data for a specific domain and storage ty...

Using Web Workers - Web APIs
ore the rest of the code. note: scripts may be downloaded in any order, but will be executed in the order in which you pass the filenames into importscripts() . this is done synchronously; importscripts() does not return until all the scripts have been loaded and executed. shared workers a shared worker is accessible by multiple scripts — even if they are being accessed by different windows, iframes or even workers. in this section we'll discuss the javascript found in our basic shared worker example (run shared worker): this is very similar to the basic dedicated worker example, except that it has two functions available handled by different script files: multiplying two numbers, or squaring a number. both scripts use the same worker to do the actual calculation required. here we'll conce...

Window.close() - Web APIs
current window, or the window on which it was called. this method can only be called on windows that were opened by a script using the window.open() method. if the window was not opened by a script, an error similar to this one appears in the console: scripts may not close windows that were not opened by script. note also that close() has no effect when called on window objects returned by htmliframe​element​.content​window. syntax window.close(); examples closing a window opened with window.open() this example shows a method which opens a window and a second one which closes the window; this demonstrates how to use window.close() to close a window opened by calling window.open(). //global var to store a reference to the opened window var openedwindow; function openwindow() { o...

Window.content - Web APIs
ge incompatibilities between implementations and the behavior may change in the future. note: since firefox 57 (initially nightly-only), both the content and _content variants are only available to chrome (privileged) code, and not available to the web anymore. returns a window object for the primary content window. this is useful in xul windows that have a <browser> (or tabbrowser or <iframe>) with type="content-primary" attribute on it — the most famous example is firefox main window, browser.xul. in such cases, content returns a reference to the window object for the document currently displayed in the browser. it is a shortcut for browserref.contentwindow. in unprivileged content (webpages), content is normally equivalent to top (except in the case of a webpage loaded in a side...

Window.frameElement - Web APIs
syntax const frameel = window.frameelement value the element which the window is embedded into. if the window isn't embedded into another document, or if the document into which it's embedded has a different origin, the value is null instead. ...

Window.frames - Web APIs
listing the direct sub-frames of the current window. syntax framelist = window.frames; framelist is a list of frame objects. it is similar to an array in that it has a length property and its items can be accessed using the [i] notation. framelist === window evaluates to true. each item in the window.frames pseudo-array represents the window object corresponding to the given <frame>'s or <iframe>'s content, not the (i)frame dom element (i.e., window.frames[0] is the same thing as document.getelementsbytagname("iframe")[0].contentwindow). for more details about the returned value, refer to this thread on mozilla.dev.platform. example var frames = window.frames; // or // var frames = window.parent.frames; for (var i = 0; i < frames.length; i++) { // do something with each subframe as...

Window.getSelection() - Web APIs
the window.getselection() method returns a selection object representing the range of text selected by the user or the current position of the caret. syntax selection = window.getselection(); return value a selection object. when cast to string, either by appending an empty string ("") or using selection.tostring(), this object returns the text selected. when called on an <iframe> that is not displayed (eg. where display: none is set) firefox will return null, whereas other browsers will return a selection object with selection.type set to none. examples function foo() { var selobj = window.getselection(); alert(selobj); var selrange = selobj.getrangeat(0); // do stuff with the range } notes string representation of the selection object in javascript, when an object i...

Window.length - Web APIs
syntax framescount = window.length; framescount is the number of frames. example if (window.length) { // this is a document with subframes } specifications specification status comment html living standardthe definition of 'window.length' in that specification. ...

Window: message event - Web APIs
the message event is fired on a window object when the window receives a message, for example from a call to window.postmessage() from another browsing context. ...

Window.parent - Web APIs
the window.parent property is a reference to the parent of the current window or subframe. if a window does not have a parent, its parent property is a reference to itself. when a window is loaded in an <iframe>, <object>, or <frame>, its parent is the window with the element embedding the window. syntax var parentwindow = window.parent; example if (window.parent != window.top) { // we're deeper than one down } specifications specification status comment html living standardthe definition of 'window.parent' in that specification. living standard ...

Window.requestAnimationFrame() - Web APIs
ready to update your animation onscreen. this will request that your animation function be called before the browser performs the next repaint. the number of callbacks is usually 60 times per second, but will generally match the display refresh rate in most web browsers as per w3c recommendation. requestanimationframe() calls are paused in most browsers when running in background tabs or hidden <iframe>s in order to improve performance and battery life. the callback method is passed a single argument, a domhighrestimestamp, which indicates the current time (based on the number of milliseconds since time origin). when callbacks queued by requestanimationframe() begin to fire multiple callbacks in a single frame, each receives the same timestamp even though time has passed during the computation...

Window: resize event - Web APIs
ndlers registered on the window object will receive resize events. there is a proposal to allow all elements to be notified of resize changes. see resize observer to read the draft document, and github issues to read the on-going discussions. examples window size logger the following example reports the window size each time it is resized. bear in mind that since the example is running in an <iframe>, you'll need to actually get the <iframe> to resize before you see an effect. <p>resize the browser window to fire the <code>resize</code> event.</p> <p>window height: <span id="height"></span></p> <p>window width: <span id="width"></span></p> const heightoutput = document.queryselector('#height'); const widthoutput = document.queryselector('#width'); function reportwindowsize() { heightout...

WindowEventHandlers.onlanguagechange - Web APIs
such an event is sent by the browser to inform that the preferred languages list has been updated. the list is accessible via navigatorlanguage.languages. ...

Web APIs
lcanvaselement htmlcollection htmlcontentelement htmldlistelement htmldataelement htmldatalistelement htmldetailselement htmldialogelement htmldivelement htmldocument htmlelement htmlembedelement htmlfieldsetelement htmlfontelement htmlformcontrolscollection htmlformelement htmlframesetelement htmlhrelement htmlheadelement htmlheadingelement htmlhtmlelement htmlhyperlinkelementutils htmliframeelement htmlimageelement htmlinputelement htmlisindexelement htmlkeygenelement htmllielement htmllabelelement htmllegendelement htmllinkelement htmlmapelement htmlmarqueeelement htmlmediaelement htmlmenuelement htmlmenuitemelement htmlmetaelement htmlmeterelement htmlmodelement htmlolistelement htmlobjectelement htmloptgroupelement htmloptionelement htmloptionscollection htmlorforeigneleme...

ARIA: contentinfo role - Accessibility
y a page footer. landmarks can be used by assistive technology to quickly identify and navigate to large sections of the document. pages should only include one top-level contentinfo landmark role per page. each page should only include one contentinfo landmark, created by either using the <footer> element or by declaring role="contentinfo". contentinfo landmarks present in content embedded via <iframe> elements do not count towards this limit. using the <footer> element will automatically communicate a section has a role of contentinfo. developers should always prefer using the correct semantic html element over using aria, making sure to test for known issues in voiceover. examples <body> <!-- other page content --> <div role="contentinfo"> <h2>mdn web docs</h2> <ul> ...

HTML To MSAA - Accessibility
e_system_ focusable n/a "open"/"close" depending on state event_object_ valuechange when selected option is changed table role_system_ table from @summary attribute n/a described_by (0x100e) points to caption element n/a n/a td, th role_system_ cell n/a n/a n/a n/a n/a n/a thead role_system_ columnheader n/a n/a n/a n/a n/a n/a abbr, acronym, blockquote, form, frame, h1-h6, iframe bstr role n/a n/a n/a n/a n/a n/a ...

Implementing a Microsoft Active Accessibility (MSAA) Server - Accessibility
ble, in a generic cross-platform manner. this default implementation for nsiaccessible knows how to use nsaccessibletreewalker to walk mozilla's content dom and frame tree, exposing only the objects that are needed for accessibility. the nsaccessibletreewalker class knows what it needs to expose by asking each dom node's primary frame (a gecko formatting object) for an nsiaccessible, using the nsiframe::getaccessible() method. if nsaccessibletreewalker gets an nsiaccessible back, then the dom node considered to be an accessible object. the nsiaccessible that is returned is either a new one, or reused from the accessibility cache, and the correct type of accessibility object to correctly expose that dom node through the cross-platform nsiaccessible and msaa-specific iaccessible interfaces. ever...

aspect-ratio - CSS: Cascading Style Sheets
and height to aspect-ratio firefox has added an internal aspect-ratio property (in version 69 onwards) that applies to replaced elements and other related elements that accept width and height attributes. this appears in the browser's internal ua stylesheet. chrome is also shipping this feature. in firefox, the internal stylesheet rule looks like this: img, input[type="image"], video, embed, iframe, marquee, object, table { aspect-ratio: attr(width) / attr(height); } specifications specification status comment css box sizing module level 4the definition of 'aspect-ratio' in that specification. editor's draft initial definition browser compatibility the compatibility table on this page is generated from structured data. if you'd like to contribut...

resize - CSS: Cascading Style Sheets
t in the inline direction (either horizontally or vertically, depending on the writing-mode and direction value). resize does not apply to the following: inline elements block elements for which the overflow property is set to visible formal definition initial valuenoneapplies toelements with overflow other than visible, and optionally replaced elements representing images or videos, and iframesinheritednocomputed valueas specifiedanimation typediscrete formal syntax none | both | horizontal | vertical | block | inline examples disabling resizability of textareas in many browsers, <textarea> elements are resizable by default. you may override this behavior with the resize property. html <textarea>type some text here.</textarea> css textarea { resize: none; /* disables resizab...

HTML5 - Developer guides
a look at the constraint validation api, several new attributes, new values for the <input> attribute type and the new <output> element. new semantic elements beside sections, media and forms elements, there are numerous new elements, like <mark>, <figure>, <figcaption>, <data>, <time>, <output>, <progress>, or <meter> and <main>, increasing the number of valid html5 elements. improvement in <iframe> using the sandbox and srcdoc attributes, authors can now be precise about the level of security and the wished rendering of an <iframe> element. mathml allows directly embedding mathematical formulas. introduction to html5 this article introduces how to indicate to the browser that you are using html5 in your web design or web application. html5 reference guide quick-reference html5 sheet...

<a>: The Anchor element - HTML: Hypertext Markup Language
ed, the browser will send post requests with the body ping to the urls. typically for tracking. referrerpolicy how much of the referrer to send when following the link. see referrer-policy for possible values and their effects. rel the relationship of the linked url as space-separated link types. target where to display the linked url, as the name for a browsing context (a tab, window, or <iframe>). the following keywords have special meanings for where to load the url: _self: the current browsing context. (default) _blank: usually a new tab, but users can configure browsers to open a new window instead. _parent: the parent browsing context of the current one. if no parent, behaves as _self. _top: the topmost browsing context (the "highest" context that’s an ancestor of the cu...

<button>: The Button element - HTML: Hypertext Markup Language
the button's form owner. this attribute is also available on <input type="image"> and <input type="submit"> elements. formtarget html5 if the button is a submit button, this attribute is a author-defined name or standardized, underscore-prefixed keyword indicating where to display the response from submitting the form. this is the name of, or keyword for, a browsing context (a tab, window, or <iframe>). if this attribute is specified, it overrides the target attribute of the button's form owner. the following keywords have special meanings: _self: load the response into the same browsing context as the current one. this is the default if the attribute is not specified. _blank: load the response into a new unnamed browsing context — usually a new tab or window, depending on the user’...

<form> - HTML: Hypertext Markup Language
not set (and therefore the form is validated), it can be overridden by a formnovalidate attribute on a <button>, <input type="submit">, or <input type="image"> element belonging to the form. target indicates where to display the response after submitting the form. in html 4, this is the name/keyword for a frame. in html5, it is a name/keyword for a browsing context (for example, tab, window, or iframe). the following keywords have special meanings: _self (default): load into the same browsing context as the current one. _blank: load into a new unnamed browsing context. _parent: load into the parent browsing context of the current one. if no parent, behaves the same as _self. _top: load into the top-level browsing context (i.e., the browsing context that is an ancestor of the current ...

<frameset> - HTML: Hypertext Markup Language
attributes like all other html elements, this element supports the global attributes. cols this attribute specifies the number and size of horizontal spaces in a frameset. rows this attribute specifies the number and size of vertical spaces in a frameset. ...

<head>: The Document Metadata (Header) element - HTML: Hypertext Markup Language
contains machine-readable information (metadata) about the document, like its title, scripts, and style sheets. note: <head> primarily holds information for machine processing, not human-readability. for human-visible information, like top-level headings and listed authors, see the <header> element. content categories none. permitted content if the document is an <iframe> srcdoc document, or if title information is available from a higher level protocol (like the subject line in html email), zero or more elements of metadata content. otherwise, one or more elements of metadata content where exactly one is a <title> element. tag omission the start tag may be omitted if the first thing inside the <head> element is an element. the end tag ma...

<input type="image"> - HTML: Hypertext Markup Language
ion to the server. this overrides the value of the novalidate attribute on the element's owning form. this attribute is also available on <input type="submit"> and <button> elements. formtarget a string which specifies a name or keyword that indicates where to display the response received after submitting the form. the string must be the name of a browsing context (that is, a tab, window, or <iframe>. a value specified here overrides any target given by the target attribute on the <form> that owns this input. in addition to the actual names of tabs, windows, or inline frames, there are a few special keywords that can be used: _self loads the response into the same browsing context as the one that contains the form. this will replace the current document with the received data. this is t...

<input type="submit"> - HTML: Hypertext Markup Language
sion to the server. this overrides the value of the novalidate attribute on the element's owning form. this attribute is also available on <input type="image"> and <button> elements. formtarget a string which specifies a name or keyword that indicates where to display the response received after submitting the form. the string must be the name of a browsing context (that is, a tab, window, or <iframe>. a value specified here overrides any target given by the target attribute on the <form> that owns this input. in addition to the actual names of tabs, windows, or inline frames, there are a few special keywords that can be used: _self loads the response into the same browsing context as the one that contains the form. this will replace the current document with the received data. this is t...

<link>: The External Resource Link element - HTML: Hypertext Markup Language
request matching, application of correct content security policy, and setting of correct accept request header. furthermore, rel="preload" uses this as a signal for request prioritization. the table below lists the valid values for this attribute and the elements or resources they apply to. value applies to audio <audio> elements document <iframe> and <frame> elements embed <embed> elements fetch fetch, xhr this value also requires <link> to contain the crossorigin attribute. font css @font-face image <img> and <picture> elements with srcset or imageset attributes, svg <image> elements, css *-image rules object <object> elements ...

<noframes>: The Frame Fallback element - HTML: Hypertext Markup Language
explaining that the user's browser doesn't support frames, but ideally should be used to present an alternate form of the site that doesn't use frames but still offers the same or similar functionality. in html 5 and later, <noframes> is obsolete and shouldn't be used, since the <frame> and <frameset> elements are also obsolete. when frames are needed at all, they should be presented using the <iframe> element. attributes like all other html elements, this element supports the global attributes. it has no other attributes available. example in this example, we see a frameset with two frames. in addition, <noframes> is used to present an explanatory message if the user agent doesn't support frames. <frameset cols="50%,50%"> <frame src="https://developer.mozilla.org/en/html/element/frame...

HTML elements reference - HTML: Hypertext Markup Language
regular multimedia content, html can include a variety of other content, even if it's not always easy to interact with. element description <embed> the html <embed> element embeds external content at the specified point in the document. this content is provided by an external application or other source of interactive content such as a browser plug-in. <iframe> the html inline frame element (<iframe>) represents a nested browsing context, embedding another html page into the current one. <object> the html <object> element represents an external resource, which can be treated as an image, a nested browsing context, or a resource to be handled by a plugin. <param> the html <param> element defines parameters for an <object> ...

dir - HTML: Hypertext Markup Language
...

lang - HTML: Hypertext Markup Language
...

title - HTML: Hypertext Markup Language
the title global attribute contains text representing advisory information related to the element it belongs to. the source for this interactive example is stored in a github repository. if you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request. some typical uses: labeling <iframe> elements for assistive technology providing a programmatically associated label for an <input> element as a fallback for a real <label> labeling controls in data tables additional semantics are attached to the title attributes of the <link>, <abbr>, <input>, and <menuitem> elements. multiline titles the title attribute may contain several lines. each u+000a line feed (lf) character represents a line break. some ca...

Global attributes - HTML: Hypertext Markup Language
are no global attributes defined. several attributes that will become global attributes in subsequent specifications are defined on a subset of elements. class and style are supported on all elements but <base>, <basefont>, <head>, <html>, <meta>, <param>, <script>, <style>, and <title>. dir is supported on all elements but <applet>, <base>, <basefont>, <bdo>, <br>, <frame>, <frameset>, <iframe>, <param>, and <script>. id is supported on all elements but <base>, <head>, <html>, <meta>, <script>, <style>, and <title>. lang is supported on all elements but <applet>, <base>, <basefont>, <br>, <frame>, <frameset>, <iframe>, <param>, and <script>. tabindex is only supported on <a>, <area>, <button>, <object>, <select>, and <textarea>. accesskey is only supported on <a>, <area...

Inline elements - HTML: Hypertext Markup Language
l, this can be changed using css). ...

Preloading content with rel="preload" - HTML: Hypertext Markup Language
ests, reusing the resource if appropriate. apply the correct content security policy to the resource. set the correct accept request headers for it. what types of content can be preloaded? many different content types can be preloaded. the possible as attribute values are: audio: audio file, as typically used in <audio>. document: an html document intended to be embedded by a <frame> or <iframe>. embed: a resource to be embedded inside an <embed> element. fetch: resource to be accessed by a fetch or xhr request, such as an arraybuffer or json file. font: font file. image: image file. object: a resource to be embedded inside an <object> element. script: javascript file. style: css stylesheet. track: webvtt file. worker: a javascript web worker or shared worker. video: video fil...

CSP: block-all-mixed-content - HTTP
the upgrade-insecure-requests directive is evaluated before block-all-mixed-content. ...

CSP: object-src - HTTP
y-policy object-src directive specifies valid sources for the <object>, <embed>, and <applet> elements. to set allowed types for <object>, <embed>, and <applet> elements, use the plugin-types directive. elements controlled by object-src are perhaps coincidentally considered legacy html elements and aren't receiving new standardized features (such as the security attributes sandbox or allow for <iframe>). therefore it is recommended to restrict this fetch-directive (e.g. explicitly set object-src 'none' if possible). csp version 1 directive type fetch directive default-src fallback yes. if this directive is absent, the user agent will look for the default-src directive. syntax one or more sources can be allowed for the object-src policy: content-sec...

Large-Allocation - HTTP
r example. a large-allocation header was ignored due to the presence of windows which have a reference to this browsing context through the frame hierarchy or window.opener. this error means that the document was not loaded at the top level of an user-opened or noopener-opened tab or window. it can occur in these situations: the document with the large-allocation header was loaded in an <iframe>. firefox cannot move an iframe into a new process currently, so the document must load in the current process. the document with the large-allocation header was loaded in a window which was opened by window.open(), <a target="_blank"> or other similar methods without rel="noopener" or the "noopener" feature being set. these windows must remain in the same process as their opener, as they can c...

Referrer-Policy - HTTP
urls to insecure origins. carefully consider the impact of this setting. integration with html you can also set referrer policies inside html. for example, you can set the referrer policy for the entire document with a <meta> element with a name of referrer: <meta name="referrer" content="origin"> or set it for individual requests with the referrerpolicy attribute on <a>, <area>, <img>, <iframe>, <script>, or <link> elements: <a href="http://example.com" referrerpolicy="origin"> alternatively, a noreferrer link relation on an a, area, or link element can be set: <a href="http://example.com" rel="noreferrer"> integration with css css can fetch resources referenced from stylesheets. these resources follow a referrer policy as well: external css stylesheets use the default policy (...

X-Frame-Options - HTTP
sites can use this to avoid click-jacking attacks, by ensuring that their content is not embedded into other sites. the added security is provided only if the user accessing the document is using a browser that supports x-frame-options. note: the content-security-policy http header has a frame-ancestors directive which obsoletes this header for supporting browsers. ...

Concurrency model and the event loop - JavaScript
two distinct runtimes can only communicate through sending messages via the postmessage method. this method adds a message to the other runtime if the latter listens to message events. never blocking a very interesting property of the event loop model is that javascript, unlike a lot of other languages, never blocks. handling i/o is typically performe...

Grammar and types - JavaScript
the global object. in web pages, the global object is window, so you can set and access global variables using the window.variable syntax. consequently, you can access global variables declared in one window or frame from another window or frame by specifying the window or frame name. for example, if a variable called phonenumber is declared in a document, you can refer to this variable from an iframe as parent.phonenumber. constants you can create a read-only, named constant with the const keyword. the syntax of a constant identifier is the same as any variable identifier: it must start with a letter, underscore, or dollar sign ($), and can contain alphabetic, numeric, or underscore characters. const pi = 3.14; a constant cannot change value through assignment or be re-declared while th...

Array.isArray() - JavaScript
ng calls return false array.isarray(); array.isarray({}); array.isarray(null); array.isarray(undefined); array.isarray(17); array.isarray('array'); array.isarray(true); array.isarray(false); array.isarray(new uint8array(32)); array.isarray({ __proto__: array.prototype }); instanceof vs isarray when checking for array instance, array.isarray is preferred over instanceof because it works through iframes. var iframe = document.createelement('iframe'); document.body.appendchild(iframe); xarray = window.frames[window.frames.length-1].array; var arr = new xarray(1,2,3); // [1,2,3] // correctly checking for array array.isarray(arr); // true // considered harmful, because doesn't work through iframes arr instanceof array; // false specifications specification ecmascript (ecma-...

globalThis - JavaScript
rk in window and non-window contexts. in this way, you can access the global object in a consistent manner without having to know which environment the code is being run in.to help you remember the name, just remember that in global scope the this value is globalthis. html and the windowproxy in many engines globalthis will be a reference to the actual global object, but in web browsers, due to iframe and cross-window security considerations, it references a proxy around the actual global object (which you can't directly access). this distinction is rarely relevant in common usage, but important to be aware of. naming several other popular name choices such as self and global were removed from consideration because of their potential to break compatibility with existing code. see the languag...

Mapping the width and height attributes of media container elements to their aspect-ratio - Web media technologies
browsers are working on adding a new mechanism for sizing images before the actual image is loaded. firefox has added an internal aspect-ratio property (in version 69 onwards) that applies to replaced elements, and other related elements that accept width and height attributes. this appears in the browser's internal ua stylesheet, similar to the following: img, input[type="image"], video, embed, iframe, marquee, object, table { aspect-ratio: attr(width) / attr(height); } this actually affects any element that acts as a container for complex or mixed visual media — <embed>, <iframe>, <marquee>, <object>, <table>, and <video>, in addition to actual images (<img> and <input type="image">). when such an element has width and height attributes set on it, its aspect ratio will be calculated bef...

begin - SVG: Scalable Vector Graphics
e x1="85" y1="25" x2="85" y2="55" stroke="grey" stroke-width=".5" /> <text x="110" y="20" text-anchor="middle">8s</text> <line x1="110" y1="25" x2="110" y2="55" stroke="grey" stroke-width=".5" /> <line x1="10" y1="30" x2="110" y2="30" stroke="grey" stroke-width=".5" /> <line x1="10" y1="55" x2="110" y2="55" stroke="grey" stroke-width=".5" /> </svg> this example is embed in an iframe. if you want to activate the key events, you have to click on it first. begin-5-accesskey.svg specifications specification status comment svg animations level 2the definition of 'begin for <discard>' in that specification. editor's draft adds the definition for the <discard> element. svg animations level 2the definition of 'begin' in that specificatio...

end - SVG: Scalable Vector Graphics
e x1="85" y1="25" x2="85" y2="55" stroke="grey" stroke-width=".5" /> <text x="110" y="20" text-anchor="middle">8s</text> <line x1="110" y1="25" x2="110" y2="55" stroke="grey" stroke-width=".5" /> <line x1="10" y1="30" x2="110" y2="30" stroke="grey" stroke-width=".5" /> <line x1="10" y1="55" x2="110" y2="55" stroke="grey" stroke-width=".5" /> </svg> this example is embed in an iframe. if you want to activate the key events, you have to click on it first. specifications specification status comment svg animations level 2the definition of 'end' in that specification. editor's draft no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'end' in that specification. recommendation initial definition ...

opacity - SVG: Scalable Vector Graphics
roup of objects, that is, the degree to which the background behind the element is overlaid. note: as a presentation attribute, opacity can be used as a css property. see the css opacity property for more information. ...

overflow - SVG: Scalable Vector Graphics
ent when it is not the root element of a stand-alone document, the <pattern> element, and the <marker> element to be hidden by default. note: as a presentation attribute, overflow can be used as a css property. see the css opacity property for more information. ...

systemLanguage - SVG: Scalable Vector Graphics
the systemlanguage attribute represents a list of supported language tags. this list is matched against the language defined in the user preferences. 35 elements are using this attribute: <a>, <altglyph>, <animate>, <animatecolor>, <animatemotion>, <animatetransform>, <audio>, <canvas>, <circle>, <clippath>, <cursor>, <defs>, <discard>, <ellipse>, <foreignobject>, <g>, <iframe>, <image>, <line>, <mask>, <path>, <pattern>, <polygon>, <polyline>, <rect>, <set>, <svg>, <switch>, <text>, <textpath>, <tref>, <tspan>, <unknown>, <use>, and <video> usage notes value <language-tags> default value none animatable no <language-tags> the value is a set of comma-separated tokens, each of which must be a language-tag value, as defined in bcp 47. systemlangu...

visibility - SVG: Scalable Vector Graphics
e their visibility attribute set to hidden still might receive events. note: as a presentation attribute, visibility can be used as a css property. see the css visibility property for more information. ...

SVG documentation index - SVG: Scalable Vector Graphics
r a color component transfer function. 215 target svg, svg attribute the target attribute should be used when there are multiple possible targets for the ending resource, such as when the parent document is embedded within an html or xhtml document, or is viewed with a tabbed browser. this attribute specifies the name of the browsing context (e.g., a browser tab or an (x)html iframe or object element) into which a document is to be opened when the link is activated: 216 targetx filters, needsexample, svg, svg attribute the targetx attribute determines the positioning in horizontal direction of the convolution matrix relative to a given target pixel in the input image. the leftmost column of the matrix is column number zero. the value must be such that: 0...

SVG 2 support in Mozilla - SVG: Scalable Vector Graphics
unknown elements in text render as unpositioned spans implementation status unknown offset distances of text positioned along a transformed path measured in text elements coordinate system implementation status unknown embedded content change notes <video> implementation status unknown <audio> implementation status unknown <iframe> implementation status unknown <canvas> implementation status unknown <source> implementation status unknown <track> implementation status unknown painting change notes paint-order implemented (bug 828805) will-change instead of buffered-rendering implementation status unknown context-fill and context-...

SVG as an Image - SVG: Scalable Vector Graphics
disabled. external resources (e.g. images, stylesheets) cannot be loaded, though they can be used if inlined through data: uris. :visited-link styles aren't rendered. platform-native widget styling (based on os theme) is disabled. note that the above restrictions are specific to image contexts; they don't apply when svg content is viewed directly, or when it's embedded as a document via the <iframe>, <object>, or <embed> elements. specifications specification status comment html5the definition of 'svg within <img> element' in that specification. recommendation defines the usage of svg within <img> elements. css backgrounds and borders module level 3the definition of 'svg within 'background-image' css property' in that specification. candidate ...

Getting started - SVG: Scalable Vector Graphics
n/xhtml+xml, the svg can be directly embedded in the xml source. if the html is html5, and the browser is a conforming html5 browser, the svg can also be directly embedded. however, there may be syntax changes necessary to conform to the html5 specification. the svg file can be referenced with an object element: <object data="image.svg" type="image/svg+xml" /> likewise an iframe element can be used: <iframe src="image.svg"></iframe> an img element can theoretically be used too. however, this technique doesn't work in firefox before 4.0. finally, svg can be created dynamically with javascript and injected into the html dom. with this method, replacement technologies can be implemented for browsers which normally can't process svg. see this dedic...

How to fix a website with blocked mixed content - Web security
x blocks active mixed content by default. this follows a practice adopted by internet explorer (since version 9) and chrome. this page explains what you should be aware of as a web developer. your website may break if your website delivers https pages, all active mixed content delivered via http on this pages will be blocked by default. consequently, your website may appear broken to users (if iframes or plugins don't load, etc.). passive mixed content is displayed by default, but users can set a preference to block this type of content, as well. note that since mixed content blocking already happens in chrome and internet explorer, it is very likely that if your website works in both of these browsers, it will work equally well in firefox with mixed content blocking. in any case, the best ...

Mixed content - Web security
ic and has no sensitive data about the user, using mixed active content still provides the attacker with the opportunity to redirect the user to other http pages and steal http cookies from those sites. active content examples this section lists some types of http requests which are considered active content: <script> (src attribute) <link> (href attribute) (this includes css stylesheets) <iframe> (src attribute) xmlhttprequest requests fetch() requests all cases in css where a <url> value is used (@font-face, cursor, background-image, and so forth). <object> (data attribute) navigator.sendbeacon (url attribute) other resource types like web fonts and workers may be considered active mixed content, as they are in chrome. warnings in web console the firefox web console displays a ...

Referer header: privacy and security concerns - Web security
ways use https for your sites. this has many security advantages, including the fact that https sites will never transmit referer information to non-https sites. this is becoming less useful in this context now that most of the web is using https, but it is still a worthy consideration. in addition, you should consider removing any third party content (e.g. social networking widgets embedded in <iframe>) from secure areas of your website, like password reset pages, payment forms, login areas, etc. you can also mitigate such risks using: the referrer-policy header on your server to control what information is sent through the referer header. again, a directive of no-referrer would omit the referer header entirely. the referrerpolicy attribute on html elements that are in danger of leaking s...

Secure contexts - Web security
is considered secure when it meets certain minimum standards of authentication and confidentiality defined in the secure contexts specification. a particular document is considered to be in a secure context when it is the active document of a top-level browsing context (basically, a containing window or tab) that is a secure context. for example, even for a document delivered over tls within an <iframe>, its context is not considered secure if it has an ancestor that was not also delivered over tls. however, it’s important to note that if a non-secure context causes a new window to be created (with or without specifying noopener), then the fact that the opener was insecure has no effect on whether the new window is considered secure. that’s because the determination of whether or not a par...

Types of attacks - Web security
c="https://bank.example.com/withdraw?account=bob&amount=1000000&for=mallory"> now, if you are logged into your bank account and your cookies are still valid (and there is no other validation), you will transfer money as soon as you load the html that contains this image. ...