Search completed in 1.50 seconds.
Document: DOMContentLoaded event - Web APIs
the domcontent
loaded event fires when the initial html document has been completely
loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading.
... bubbles yes cancelable yes (although specified as a simple event that isn't cancelable) interface event event handler property none a different event, load, should be used only to detect a fully-
loaded page.
... it is a common mistake to use load where domcontent
loaded would be more appropriate.
...And 6 more matches
HTMLMediaElement: loadeddata event - Web APIs
the
loadeddata event is fired when the frame at the current playback position of the media has finished loading; often the first frame.
... bubbles no cancelable no interface event target element default action none event handler property globaleventhandlers.on
loadeddata specification html5 media note that this event will not fire in mobile/tablet devices if data-saver is on in browser settings.
... examples these examples add an event listener for the htmlmediaelement's
loadeddata event, then post a message when that event handler has reacted to the event firing.
...And 4 more matches
HTMLMediaElement: loadedmetadata event - Web APIs
the
loadedmetadata event is fired when the metadata has been
loaded.
... bubbles no cancelable no interface event target element default action none event handler property globaleventhandlers.on
loadedmetadata specification html5 media additional properties property type description mozchannels read only int the number of channels.
... examples these examples add an event listener for the htmlmediaelement's
loadedmetadata event, then post a message when that event handler has reacted to the event firing.
...And 3 more matches
Window: DOMContentLoaded event - Web APIs
the domcontent
loaded event fires when the initial html document has been completely
loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading.
... bubbles yes cancelable yes (although specified as a simple event that isn't cancelable) interface event event handler property none the original target for this event is the document that has
loaded.
...for full details on this event please see the page on the document: domcontent
loaded event.
...And 3 more matches
GlobalEventHandlers.onloadeddata - Web APIs
the on
loadeddata property of the globaleventhandlers mixin is the eventhandler for processing
loadeddata events.
... the
loadeddata event is fired when the first frame of the media has finished loading.
... syntax element.on
loadeddata = handlerfunction; var handlerfunction = element.on
loadeddata; handlerfunction is either null or a javascript function specifying the handler for the event.
... specification specification status comment html living standardthe definition of 'on
loadeddata' in that specification.
GlobalEventHandlers.onloadedmetadata - Web APIs
the on
loadedmetadata property of the globaleventhandlers mixin is the eventhandler for processing
loadedmetadata events.
... the
loadedmetadata event is fired when the metadata has been
loaded.
... syntax element.on
loadedmetadata = handlerfunction; var handlerfunction = element.on
loadedmetadata; handlerfunction should be either null or a javascript function specifying the handler for the event.
... specification specification status comment html living standardthe definition of 'on
loadedmetadata' in that specification.
PerformanceNavigationTiming.domContentLoadedEventEnd - Web APIs
the domcontent
loadedeventend read-only property returns a timestamp representing the time value equal to the time immediately after the current document's domcontent
loaded event completes.
... syntax perfentry.domcontent
loadedeventend; return value a timestamp representing the time value equal to the time immediately after the current document's domcontent
loaded event completes.
... function print_nav_timing_data() { // use getentriesbytype() to just get the "navigation" events var perfentries = performance.getentriesbytype("navigation"); for (var i=0; i < perfentries.length; i++) { console.log("= navigation entry[" + i + "]"); var p = perfentries[i]; // dom properties console.log("dom content
loaded = " + (p.domcontent
loadedeventend - p.domcontent
loadedeventstart)); console.log("dom complete = " + p.domcomplete); console.log("dom interactive = " + p.dominteractive); // document load and unload time console.log("document load = " + (p.loadeventend - p.loadeventstart)); console.log("document unload = " + (p.unloadeventend - p.unloadeventstart)); // other properties ...
... console.log("type = " + p.type); console.log("redirectcount = " + p.redirectcount); } } specifications specification status comment navigation timing level 2the definition of 'domcontent
loadedeventend' in that specification.
PerformanceNavigationTiming.domContentLoadedEventStart - Web APIs
the domcontent
loadedeventstart read-only property returns a timestamp representing the time value equal to the time immediately before the user agent fires the domcontent
loaded event at the current document.
... syntax perfentry.domcontent
loadedeventstart; return value a timestamp representing the time value equal to the time immediately before the user agent fires the domcontent
loaded event at the current document.
... function print_nav_timing_data() { // use getentriesbytype() to just get the "navigation" events var perfentries = performance.getentriesbytype("navigation"); for (var i=0; i < perfentries.length; i++) { console.log("= navigation entry[" + i + "]"); var p = perfentries[i]; // dom properties console.log("dom content
loaded = " + (p.domcontent
loadedeventend - p.domcontent
loadedeventstart)); console.log("dom complete = " + p.domcomplete); console.log("dom interactive = " + p.interactive); // document load and unload time console.log("document load = " + (p.loadeventend - p.loadeventstart)); console.log("document unload = " + (p.unloadeventend - p.unloadeventstart)); // other properties c...
...onsole.log("type = " + p.type); console.log("redirectcount = " + p.redirectcount); } } specifications specification status comment navigation timing level 2the definition of 'domcontent
loadedeventstart' in that specification.
FontFace.loaded - Web APIs
the
loaded read-only property of the fontface interface returns a promise that resolves with the current fontface object when the font specified in the object's constructor is done loading or rejects with a syntaxerror.
... syntax var apromise = fontface.
loaded; value a promise that resolves with the current fontface object.
... specifications specification status comment css font loading module level 3the definition of '
loaded' in that specification.
PerformanceTiming.domContentLoadedEventEnd - Web APIs
the legacy performancetiming.domcontent
loadedeventend read-only property returns an unsigned long long representing the moment, in milliseconds since the unix epoch, right after all the scripts that need to be executed as soon as possible, in order or not, has been executed.
... syntax time = performancetiming.domcontent
loadedeventend; specifications specification status comment navigation timingthe definition of 'performancetiming.domcontent
loadedeventend' in that specification.
PerformanceTiming.domContentLoadedEventStart - Web APIs
the legacy performancetiming.domcontent
loadedeventstart read-only property returns an unsigned long long representing the moment, in miliseconds since the unix epoch, right before the parser sent the domcontent
loaded event, that is right after all the scripts that need to be executed right after parsing has been executed.
... syntax time = performancetiming.domcontent
loadedeventstart; specifications specification status comment navigation timingthe definition of 'performancetiming.domcontent
loadedeventstart' in that specification.
ProgressEvent.loaded - Web APIs
the progressevent.
loaded read-only property is an integer representing the amount of work already performed by the underlying process.
... syntax value = progressevent.
loaded specifications specification status comment xmlhttprequestthe definition of 'progressevent.
loaded' in that specification.
Index - Web APIs
requests are guaranteed to be initiated before a page is un
loaded and they are run to completion, without requiring a blocking request (for example xmlhttprequest).
... 277 beforeunloadevent api, reference the beforeunload event is fired when the window, the document and its resources are about to be un
loaded.
... 860 document api, dom, document, interface, reference the document interface represents any web page
loaded in the browser and serves as an entry point into the web page's content, which is the dom tree.
...And 53 more matches
Index - Archive of obsolete content
18 interacting with page scripts add-on sdk, add-ons, extensions by default, content scripts
loaded by add-ons and scripts
loaded by web pages are insulated from each other: 19 loading content scripts no summary!
... 102 remote/child module, reference, sdk enables an sdk module
loaded into a child process to access web content in the child process and communicate with modules in the main process.
... 110 system/unload register callbacks that are called when a module is un
loaded.
...And 24 more matches
tabs - Archive of obsolete content
tabs.on('ready', function(tab) { console.log('tab is
loaded', tab.title, tab.url); }); access tabs the module itself can be used as a list of all opened tabs across all windows.
...0].title); console.log('last: ' + tabs[tabs.length-1].title); }); you can access the currently active tab: var tabs = require('sdk/tabs'); tabs.on('activate', function () { console.log('active: ' + tabs.activetab.url); }); track a single tab given a tab, you can register event listeners to be notified when the tab is closed, activated or deactivated, or when the page hosted by the tab is
loaded or retrieved from the "back-forward cache": var tabs = require("sdk/tabs"); function onopen(tab) { console.log(tab.url + " is open"); tab.on("pageshow", logshow); tab.on("activate", logactivate); tab.on("deactivate", logdeactivate); tab.on("close", logclose); } function logshow(tab) { console.log(tab.url + " is
loaded"); } function logactivate(tab) { console.log(tab.url + " is a...
...this does not mean that the content has
loaded, only that the browser tab itself is fully visible to the user.
...And 22 more matches
Appendix D: Loading Scripts - Archive of obsolete content
as this module only exists on firefox 4 and other gecko 2-based platforms, the services in question will have to be manually
loaded on other platforms.
...these tags are generally inserted into xul overlay files or other xul documents, after which they are automatically
loaded into the context of the xul window in question and executed immediately and synchronously.
... speed: script tags may or may not be
loaded from pre-compiled bytecode in the fastload cache (gecko 1.x) or startup cache (gecko 2), which means they don't necessarily need to read as source and compiled with each restart.
...And 21 more matches
Frame script loading and lifetime
with an extension, use a "chrome.manifest" file to register a chrome url: // chrome.manifest content my-e10s-extension chrome/content/ // chrome script mm.loadframescript("chrome://my-e10s-extension/content/content.js", true); allowdelayedload if the message manager is a global frame message manager or a window message manager then: if allowdelayedload is true, the frame script will be
loaded into any new frame, which has opened after the loadframescript() call.
... for example: var mm = window.messagemanager; mm.loadframescript("chrome://my-e10s-extension/content/frame-script.js", true); the script will be
loaded into all tabs currently open in this window, and all new tabs opened afterwards.
... if allowdelayedload is false, the script will only be
loaded into frames which are open when the call was made.
...And 15 more matches
nsIDocShell
setting this will make it take effect starting with the next document
loaded in the docshell.
... allowimages boolean attribute stating whether or not images should be
loaded.
... allowmedia boolean attribute stating whether or not media (audio/video) should be
loaded.
...And 15 more matches
Event reference
beforeunload the window, the document and its resources are about to be un
loaded.
... unload the document or a dependent resource is being un
loaded.
... canplay the browser can play the media, but estimates that not enough data has been
loaded to play the media up to its end without having to stop for further buffering of content.
...And 15 more matches
RDF in Mozilla FAQ - Archive of obsolete content
the rdf service manages a table of all
loaded datasources.
... datasources may be
loaded via the rdf service using the getdatasource() method.
... how can i tell if an rdf/xml datasource has
loaded?
...And 14 more matches
Content Scripts - Archive of obsolete content
" and other modules in "lib", can use the sdk high-level and low-level apis, but can't access web content directly content scripts can't use the sdk's apis (no access to globals exports, require) but can access web content sdk apis that use content scripts, like page-mod and tabs, provide functions that enable the add-on's main code to load content scripts into web pages content scripts can be
loaded in as strings, but are more often stored as separate files under the add-on's "data" directory.
...cript: ['document.body.style.border = "5px solid red";', 'window.alert("hi");'] }); }); // main.js var data = require("sdk/self").data; var pagemod = require("sdk/page-mod"); pagemod.pagemod({ include: "*.mozilla.org", contentscriptfile: [data.url("jquery.min.js"), data.url("my-content-script.js")] }); if you do this, the scripts can interact directly with each other, just like scripts
loaded by the same web page.
...if you do this, scripts specified using contentscriptfile are
loaded before those specified using contentscript.
...And 13 more matches
/loader - Archive of obsolete content
usage the code is intentionally authored so that it can be
loaded in several ways.
... it can be
loaded as a regular script tag in documents that have system principals (note: this does not appear to work as of 02.2016 due to "use strict" being added to the file): <script type='application/javascript' src='resource://gre/modules/commonjs/toolkit/loader.js'></script> this will expose a single loader object containing all of the api functions described in this document.
... it can be
loaded as a javascript code module: let { loader, require, unload } = components.utils.import('resource://gre/modules/commonjs/toolkit/loader.js'); it can be required as a commonjs module from a module
loaded in the loader itself: let { loader, require, unload } = require('toolkit/loader'); what is it good for ?
...And 13 more matches
nsIContentPolicy - Archive of obsolete content
63 introduced gecko 1.0 inherits from: nsicontentpolicybase last changed in gecko 42 (firefox 42 / thunderbird 42 / seamonkey 2.39) you can observe content that is being
loaded into your browser by implementing nsicontentpolicy.
... shouldload() will never get this, because it does not represent content to be
loaded (the actual load triggered by the refresh will go through shouldload() as expected).
... type_dtd 13 indicates a dtd
loaded by an xml document.
...And 13 more matches
page-mod - Archive of obsolete content
a page-mod only attaches scripts to documents
loaded in tabs.
... if multiple documents that match the page-mod's include pattern are
loaded, then each document is
loaded into its own execution context with its own copy of the content scripts.
... in this case the listener assigned to onattach is called once for each
loaded document, and the add-on code will have a separate worker for each document.
...And 12 more matches
panel - Archive of obsolete content
a panel's content is
loaded as soon as it is created, before the panel is shown, and the content remains
loaded when a panel is hidden, so it is possible to keep a panel around in the background, updating its content as appropriate in preparation for the next time it is shown.
... panel content the panel's content is specified as html, which is
loaded from the url supplied in the contenturl option to the panel's constructor.
...however, doing this will cause any content scripts to be un
loaded and then re
loaded, so it may be less efficient, and you'll lose any state associated with the scripts.
...And 12 more matches
What is JavaScript? - Learn web development
note that the code in your web documents is generally
loaded and executed in the order it appears on the page.
... if the javascript loads and tries to run before the html and css it is affecting has been
loaded, errors can occur.
...client-side code is code that is run on the user's computer — when a web page is viewed, the page's client-side code is down
loaded, then run and displayed by the browser.
...And 12 more matches
Venkman Introduction - Archive of obsolete content
the scripts that have been
loaded by the javascript engine appear in the
loaded scripts window (for more information about how scripts are
loaded and accessed in venkman, see "loading scripts into the debugger").
... the
loaded scripts view the
loaded scripts view is in the top left portion of the window.
... when a file is
loaded by the browser it will appear in this view, and when un
loaded it will be removed.
...And 11 more matches
browser - Archive of obsolete content
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.
...And 11 more matches
Storage access policy: Block cookies from trackers
second, firefox uses an additional "entity list", which prevents domains from being classified as trackers when they are
loaded on a top-level site owned by the same organization.
... the storage access policy blocks resources identified as trackers from accessing their cookies and other site storage when they are
loaded in a third-party context.
... origins classified as trackers will have access to their own storage when they are
loaded in a first-party context.
...And 11 more matches
Modules - Archive of obsolete content
all modules within the sdk are
loaded using cuddlefish by default.
...however, the following example shows how it can be used to load scripts from other locations: const { classes: cc interfaces: ci } = components; var instance = cc["@mozilla.org/moz/jssubscript-loader;1"]; var loader = instance.getservice(ci.mozijssubscriptloader); function loadscript(url) { loader.loadsubscript(url); } when a script is
loaded, it is evaluated in the scope of the global object of the script that
loaded it.
...this becomes a problem when two scripts try to define the same property: // index.js: loadscript("www.foo.com/a.js"); loadscript("www.foo.com/b.js"); foo; // => 5 // a.js: foo = 3; // b.js: foo = 5; in the above example, the value of foo depends on the order in which the subscripts are
loaded: there is no way to access the property foo defined by "a.js", since it is overwritten by "b.js".
...And 10 more matches
ui/sidebar - Archive of obsolete content
to show what a sidebar looks like, here's a sidebar that displays the results of running the w3c validator on the current page: specifying sidebar content the content of a sidebar is specified using html, which is
loaded from the url supplied in the url option to the sidebar's constructor.
... unlike modules such as panel, the content must be local, typically
loaded from the add-on's data directory via a url constructed using self.data.url(): var sidebar = require("sdk/ui/sidebar").sidebar({ id: 'my-sidebar', title: 'my sidebar', url: require("sdk/self").data.url("sidebar.html") }); from firefox 34, you can use "./sidebar.html" as an alias for self.data.url("sidebar.html").
... communicating with sidebar scripts you can't directly access your sidebar's content from your main add-on code, but you can send messages between your main add-on code and scripts
loaded into your sidebar.
...And 9 more matches
Intercepting Page Loads - Archive of obsolete content
some of the techniques presented here apply only to content
loaded in the main browser area, while others detect content being
loaded in other xul windows, or even detect xul content being
loaded.
... gbrowser.removeeventlistener("load", this._loadhandler, true); finally, the actual code for the handler, which is very simple: _onpageload : function(event) { // this is the content document of the
loaded page.
... if (doc.defaultview.frameelement) { // frame within a tab was
loaded.
...And 9 more matches
Index - MDN Web Docs Glossary: Definitions of Web-related terms
81 code splitting glossary, reference, web performance, code splitting, latency code splitting is the splitting of code into various bundles or components which can then be
loaded on demand or in parallel.
... 84 compile time codingscripting, glossary, javascript the compile time is the time from when the program is first
loaded until the program is parsed.
...the dom is a document model
loaded in the browser and representing the document as a node tree, where each node represents part of the document (e.g.
...And 9 more matches
DevTools API - Firefox Developer Tools
return value: a promise that is fulfilled with the toolbox instance once it has been initialized and the selected tool is
loaded.
...if the tool is not already
loaded or currently loading the returned promise won't be fulfilled until something triggers the tool to load.
... gettoolpanels() returns a toolid → toolpanel map for currently
loaded tools.
...And 9 more matches
tabbrowser - Archive of obsolete content
contentwindow type: todo use the contentwindow.wrappedjsobject to obtain a dom(html) window object currenturi type: nsiuri this read-only property contains the currently
loaded url.
... securityui type: nsisecurebrowserui the read-only property holds an object which may be used to determine the security level of the
loaded document.
...normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata addprogresslistener( listener ) return type: no return value add a progress listener to the browser which will monitor
loaded documents.
...And 8 more matches
Tips for authoring fast-loading HTML pages - Learn web development
depending on a browser's cache settings, it may send a request with the if-modified-since header for each referenced file, asking whether the file has been modified since the last time it was down
loaded.
... any dynamic features that require the page to complete loading before being used, should be initially disabled, and then only enabled after the page has
loaded.
... this will cause the javascript to be
loaded after the page contents, which will improve the overall appearance of the page load.
...And 8 more matches
nsIFrameScriptLoader
frame scripts are
loaded as soon as loadframescript() is called.
...s called on a chromemessagebroadcaster (for example, a global frame message manager or a window message manager) then: loadframescript() will load the frame script independently into each applicable frame: every open frame in the given window for the window message manager, or every frame in every window for the global message manager if aallowdelayedload is true, then the script will also be
loaded into any applicable new frames opened after the loadframescript() call.
... otherwise it will only be
loaded into frames that exist at the time of the call.
...And 8 more matches
MediaDevices.getUserMedia() - Web APIs
eam = await navigator.mediadevices.getusermedia(constraints); /* use the stream */ } catch(err) { /* handle the error */ } } similarly, using the raw promises directly, the code looks like this: navigator.mediadevices.getusermedia(constraints) .then(function(stream) { /* use the stream */ }) .catch(function(err) { /* handle the error */ }); note: if the current document isn't
loaded securely, navigator.mediadevices will be undefined, and you cannot use getusermedia().
...this will happen if the browsing context is insecure (that is, the page was
loaded using http rather than https).
...a secure context is, in short, a page
loaded using https or the file:/// url scheme, or a page
loaded from localhost.
...And 8 more matches
nsIMsgCloudFileProvider
fileuploadsizelimit long readonly: the upper size limit in bytes for a file to be up
loaded.
... uploadexceedsfilelimit 0x8055311c returned when uploading has failed because the file being up
loaded is larger than the file size limit.
... void uploadfile(in nsilocalfile afile, in nsirequestobserver acallback); parameters afile the file to be up
loaded.
...And 7 more matches
HTMLMediaElement - Web APIs
the best time to set a new length is after the
loadedmetadata event fires, when the audio info is known, but before the audio has started or mozaudioavailable events have begun firing.
... htmlmediaelement.preload is a domstring that reflects the preload html attribute, indicating what data should be pre
loaded, if any.
...this method must be called after the
loadedmetadata event fires.
...And 7 more matches
HTTP Index - HTTP
78 csp: block-all-mixed-content csp, content-security-policy, directive, http, mixed content, reference, security, block-all-mixed-content the http content-security-policy (csp) block-all-mixed-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>.
... 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.
...And 7 more matches
ui/frame - Archive of obsolete content
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().
... frame methods postmessage(message, targetorigin) send a message to scripts
loaded into the frame.
... properties url url for the content
loaded into the frame.
...And 6 more matches
Listening for Load and Unload - Archive of obsolete content
if your add-on exports a function called main(), then that function will be called whenever the add-on is
loaded, and it will be passed an object containing a string describing the reason it was
loaded as well as any arguments passed to it.
... if your add-on exports a function called onunload(), then that function will be called when the add-on is un
loaded, and it will be passed a string describing the reason it was un
loaded.
...it will be
loaded in the same circumstances, but you won't get access to the load/unload reason or arguments.
...And 6 more matches
Modifying Web Pages Based on URL - Archive of obsolete content
to modify any pages that match a particular pattern (for example, "http://example.org/") as they are
loaded, use page-mod module.
... a simple code snippet where content script is supplied as contentscript option and url pattern is given as include option is as follows: // import the page-mod api var pagemod = require("sdk/page-mod"); // create a page-mod // it will run a script whenever a ".org" url is
loaded // the script replaces the page contents with a message pagemod.pagemod({ include: "*.org", contentscript: 'document.body.innerhtml = ' + ' "<h1>page matches ruleset</h1>";' }); do as follows: create a new directory and navigate to it.
... for example, if we save the script above under the add-on's data directory in a file called my-script.js: // import the page-mod api var pagemod = require("sdk/page-mod"); // import the self api var self = require("sdk/self"); // create a page-mod // it will run a script whenever a ".org" url is
loaded // the script replaces the page contents with a message pagemod.pagemod({ include: "*.org", contentscriptfile: self.data.url("my-script.js") }); or from firefox 34 onwards: // import the page-mod api var pagemod = require("sdk/page-mod"); // create a page-mod // it will run a script whenever a ".org" url is
loaded // the script replaces the page contents with a message pagemod.pagemod({ ...
...And 6 more matches
Index - Archive of obsolete content
30 browser.type xul attributes, xul reference type: one of the values below.the type of browser, which can be used to set access of the document
loaded inside the browser.
... 436 index found 1218 pages: 437 international characters in xul javascript firefox, gecko, guide, internationalization, javascript, mozilla, xpcom, xul gecko 1.8, as used in firefox 1.5 and other applications, added support for non-ascii characters in javascript files
loaded from xul files.
... 438 introduction to xul guide, xul mozilla has configurable, downloadable chrome, meaning that the arrangement and even presence or absence of controls in the main window is not hardwired into the application, but
loaded from a separate ui description.
...And 6 more matches
nsIIOService
for example for an image load, it's the document in which the image will be
loaded.
...please note, aloadingprincipal is *not* the principal of the resource being
loaded.
...the triggeringprincipal is the principal of the resource that caused this particular url to be
loaded.
...And 6 more matches
Plug-in Basics - Plugins
with the plug-in api, you can create dynamically
loaded plug-ins that can: register one or more mime types draw into a part of a browser window receive keyboard and mouse events obtain data from the network using urls post data to urls add hyperlinks or hotspots that link to new urls draw into sections on an html page communicate with javascript/dom from native code you can see which plug-ins are installed on your system and have been prop...
...when the last instance of a plug-in is deleted, the plug-in code is un
loaded from memory.
... a plug-in consumes no resources other than disk space when it is not
loaded.
...And 6 more matches
Using files from web applications - Web APIs
when the entire contents of the image file are
loaded, they are converted into a data: url which is passed to the onload callback.
... our implementation of this routine sets the img element's src attribute to the
loaded image which results in the image appearing in the thumbnail on the user's screen.
...while they are released automatically when the document is un
loaded, if your page uses them dynamically you should release them explicitly by calling url.revokeobjecturl(): url.revokeobjecturl(objecturl); example: using object urls to display images this example uses object urls to display image thumbnails.
...And 6 more matches
Window - Web APIs
the window interface represents a window containing a dom document; the document property points to the dom document
loaded in that window.
... globaleventhandlers.onload called after all resources and the dom are fully
loaded.
... will not get called when the page is
loaded from cache, such as with back button.
...And 6 more matches
Cross-browser audio basics - Developer guides
src contains the path to the audio file to be
loaded (relative or absolute).
... myaudio.addeventlistener("durationchange", function() { //you can display the duration now });
loadedmetadata metadata can consist of more than just duration — if you want to wait for all the metadata to download before doing something, you can detect the
loadedmetadata event.
... myaudio.addeventlistener("
loadedmetadata", function() { //you can display the duration now });
loadeddata the
loadeddata event is fired when the first bit of media arrives.
...And 6 more matches
Large-Allocation - HTTP
the non-standard large-allocation response header tells the browser that the page being
loaded is going to want to perform a large allocation.
...the large-allocation tells the browser that the web content in the to-be-
loaded page is going to want to perform a large contiguous memory allocation and the browser can react to this header by starting a dedicated process for the to-be-
loaded document, for example.
... this page was
loaded in a new process due to a large-allocation header.
...And 6 more matches
page-worker - Archive of obsolete content
in this example we fetch the first paragraph of a page from wikipedia, then the first paragraph of a different page: var getfirstparagraph = "var paras = document.getelementsbytagname('p');" + "console.log(paras[0].textcontent);" + "self.port.emit('
loaded');" pageworker = require("sdk/page-worker").page({ contentscript: getfirstparagraph, contenturl: "http://en.wikipedia.org/wiki/chalk" }); pageworker.port.on("
loaded", function() { pageworker.contenturl = "http://en.wikipedia.org/wiki/cheese" }); scripting page content to access the page's dom you need to attach a script to it.
...we can call this "trusted" content, because unlike content
loaded from a source outside the add-on, the add-on author knows exactly what it's doing.
...content scripts specified by this option are
loaded before those specified by the contentscript option.
...And 5 more matches
widget - Archive of obsolete content
we can call this "trusted" content, because unlike content
loaded from a source outside the add-on, the add-on author knows exactly what it's doing.
...content scripts specified by this property are
loaded before those specified by the contentscript property.
...content scripts specified by this property are
loaded after those specified by the contentscriptfile property.
...And 5 more matches
How to convert an overlay extension to restartless - Archive of obsolete content
some of that will have to be replaced and the rest will need to be
loaded differently.
...the resource:// protocol actually bleeds into content which allows webpages to detect installed add-ons using the protocol, which is not particularly fantastic (just the static file contents, not any
loaded script/data).
...prior to firefox 10, the chrome.manifest file you rely on wasn't
loaded automatically for restartless add-ons.
...And 5 more matches
Using gdb on wimpy computers - Archive of obsolete content
however, you need to make sure that the base libraries like libc and pthreads are
loaded before you tell gdb to stop loading shared libraries.
... if you don't allow those libraries to be
loaded then gdb will not be able to properly debug threads on linux.
...the argument to the command is a regular expression for the libraries to be
loaded.
...And 5 more matches
Index
installing a cryptographic module from a jar file pkcs #11 modules can also be
loaded using a jar file, which contains all of the required libraries and an installation script that describes how to install the module.
...nss internal pkcs #11 module slots: 2 slots attached status:
loaded slot: nss internal cryptographic services token: nss generic crypto services slot: nss user private key and certificate services token: nss certificate db ----------------------------------------------------------- passing a specific module name with the -list returns details information about the module itself, like supported cipher mechanisms, ver...
...sion numbers, serial numbers, and other information about the module and the token it is
loaded on.
...And 5 more matches
Index
load notifications are fired as the image is
loaded from the network or filesystem.
... 335 nsiapplicationupdateservice interfaces, interfaces:scriptable, update service, xpcom, xpcom api reference, xpcom interface reference adds a listener that receives progress and state information about the update that is currently being down
loaded.
... 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.
...And 5 more matches
nsIWebNavigation
load_flags_bypass_proxy 512 this flag specifies that any intermediate proxy caches should be bypassed (that is, that the content should be
loaded from the origin server).
... load_flags_charset_change 1024 this flag specifies that a reload was triggered as a result of detecting an incorrect character encoding while parsing a previously
loaded document.
...set with care, since setting incorrectly can cause us to assume that nothing was actually
loaded in this object if the load ends up being handled by an external application.
...And 5 more matches
Request.cache - Web APIs
otherwise the resource will be down
loaded from the server and the cache will be updated.
... if there is no match, the browser will make a normal request, and will update the cache with the down
loaded resource.
... no-store — the browser fetches the resource from the remote server without first looking in the cache, and will not update the cache with the down
loaded resource.
...And 5 more matches
<link>: The External Resource Link element - HTML: Hypertext Markup Language
you can also provide a media type or query inside a media attribute; this resource will then only be
loaded if the media condition is true.
...it specifies the type of content being
loaded by the <link>, which is necessary for request matching, application of correct content security policy, and setting of correct accept request header.
... disabled for rel="stylesheet" only, the disabled boolean attribute indicates whether or not the described stylesheet should be
loaded and applied to the document.
...And 5 more matches
<video>: The Video Embed element - HTML: Hypertext Markup Language
setting currenttime sets the current playback position to the given time and seeks the media to that position if the media is currently
loaded.
... preload this enumerated attribute is intended to provide a hint to the browser about what the author thinks will lead to the best user experience with regards to what content is
loaded before the video is played.
... it may have one of the following values: none: indicates that the video should not be pre
loaded.
...And 5 more matches
Mapping the width and height attributes of media container elements to their aspect-ratio - Web media technologies
this change means that the aspect ratio of the image is calculated by the browser early on and can then be used to correct the size needed to display the image before it has
loaded, if css has been applied that causes problems with its display size.
... jank problems when loading images in the olden days of web development, it was always seen as a good practice to add width and height attributes to your html <img> elements, so that when browsers first
loaded the page, they could put a correctly-sized placeholder box in the layout for each image to appear in when it finally loads.
... without the width and height attributes, no placeholder space would be created, and when the image finally
loaded you would get a noticeable jank in the page layout.
...And 5 more matches
Navigation and resource timings - Web Performance
as displayed in the image below, the navigation process goes from navigationstart, unloadeventstart, unloadeventend, redirectstart, redirectend, fetchstart, domainlookupstart, domainlookupend, connectstart , connectend, secureconnectionstart, requeststart, responsestart, responseend, domloading, dominteractive, domcontent
loadedeventstart, domcontent
loadedeventend, domcomplete, loadeventstart, and loadeventend.
... domcontent
loadedeventstart right before the parser sent the domcontent
loaded event, that is right after all the scripts that need to be executed right after parsing have been executed.
... domcontent
loadedeventend right after all the scripts that need to be executed as soon as possible, in order or not, have been executed.
...And 5 more matches
content/symbiont - Archive of obsolete content
var { symbiont } = require('sdk/content/content'); var thing = symbiont.resolve({ constructor: '_init' }).compose({ constructor: function thing(options) { // `getmyframe` returns the host application frame in which // the page is
loaded.
... parameters options : object optional options: name type frame object the host application frame in which the page is
loaded.
...this may take one of the following values: "start": load content scripts immediately after the document element for the page is inserted into the dom, but before the dom content itself has been
loaded "ready": load content scripts once dom content has been
loaded, corresponding to the domcontent
loaded event "end": load content scripts once all the content (dom, js, css, images) for the page has been
loaded, at the time the window.onload event fires this property is optional and defaults to "end".
...And 4 more matches
On page load - Archive of obsolete content
this article is for xul/javascript developers who want to have custom code executed each time a new page is
loaded in browser/mail.
...element (browsers) or messagepane (mail): window.addeventlistener("load", function load(event){ window.removeeventlistener("load", load, false); //remove listener, no longer needed myextension.init(); },false); var myextension = { init: function() { var appcontent = document.getelementbyid("appcontent"); // browser if(appcontent){ appcontent.addeventlistener("domcontent
loaded", myextension.onpageload, true); } var messagepane = document.getelementbyid("messagepane"); // mail if(messagepane){ messagepane.addeventlistener("load", function(event) { myextension.onpageload(event); }, true); } }, onpageload: function(aevent) { var doc = aevent.originaltarget; // doc is document that triggered "onload" event // do something with the
loaded ...
... if(doc.location.href.search("forum") > -1) alert("a forum page is
loaded"); // add event listener for page unload aevent.originaltarget.defaultview.addeventlistener("unload", function(event){ myextension.onpageunload(event); }, true); }, onpageunload: function(aevent) { // do something } }; current firefox trunk nightlies will fire the onpageload function for not only documents, but xul:images (favicons in tabbrowser).
...And 4 more matches
Inner-browsing extending the browser navigation paradigm - Archive of obsolete content
data bind: mutation in the current document this step takes care of applying the changes into the current document, based on the data
loaded, and uses dom interfaces.
...data request \________ dynamically create a hidden iframe \_________ content is
loaded -> call data binder data binder \_____ load xml||html data from iframe "container" \_____ send content to proper layout components the method presented here separates data request from data binding.
...a request to a web server no longer requires a new page to be
loaded, in order to update information in a page seamlessly.
...And 4 more matches
New Security Model for Web Services - Archive of obsolete content
the problem external untrusted scripts
loaded behind a firewall are executed in a sandbox.
... client-controlled solutions several client-controlled solutions have been designed to prevent sandboxed applications
loaded behind a firewall from compromising other resources protected behind the firewall.
... same source restriction by restricting sandboxed scripts to access only resources in the domain from which they were
loaded, any script
loaded from one domain into another is prevented from accessing resources in the domain into which it has been
loaded.
...And 4 more matches
Common causes of memory leaks in extensions - Extensions
to avoid these issues, references to dom nodes in foreign document should instead be stored in an object which is specific to that document, and cleaned up when the document is un
loaded, or stored as weak references.
...consider the following example code that could be part of your browser.xul overlay: gbrowser.addeventlistener("domcontent
loaded", function(evt) { var contentdoc = evt.originaltarget; var i = 0; // refresh the title once each second setinterval(function() { contentdoc.title = ++i; }, 1000); }, false); one would normally expect that the interval (or timer) would be destroyed as soon as the document unloads, in the same way that event listeners are automatically destroyed.
...hence the interval will only be destroyed when the outer window is un
loaded (i.e.
...And 4 more matches
2D maze game with device orientation - Game development
this.load.audio('audio-bounce', ['audio/bounce.ogg', 'audio/bounce.mp3', 'audio/bounce.m4a']); }, create: function() { this.game.state.start('mainmenu'); } }; there are single images, spritesheets and audio files
loaded by the framework.
...that progress of the
loaded assets is visualized by the framework with the use of one image.
... with every asset
loaded you can see more of the preloadbar image: from 0% to 100%, updated on every frame.
...And 4 more matches
Message manager overview
if you load a frame script using the global frame message manager, the script gets
loaded separately into every open tab: three times, in the diagram above.
...if you load a frame script using the window message manager it gets
loaded separately into each tab open in that particular window.
...scripts you load using a browser message manager are
loaded only into that content tab, and messages you send are delivered only to that content tab.
...And 4 more matches
nsIModule
idref aiid, [retval, iid_is(aiid)] out nsqiresult aresult); void registerself(in nsicomponentmanager acompmgr, in nsifile alocation, in string aloaderstr, in string atype); void unregisterself(in nsicomponentmanager acompmgr, in nsifile alocation, in string aloaderstr); methods canunload() this method may be queried to determine whether or not the component module can be un
loaded by xpcom.
... return value indicates to the caller whether or not the component module can be un
loaded.
... returning true is not a guarantee that the module will be un
loaded.
...And 4 more matches
nsIProcessScriptLoader
process scripts are
loaded as soon as loadprocessscript() is called.
... if aallowdelayedload is true, then the script will also be
loaded into any new child processes created after the loadprocessscript() call.
... otherwise it will only be
loaded into child processes that exist at the time of the call.
...And 4 more matches
XUL Overlays
loading overlays overlays can be
loaded explicitly or dynamically.
... when you load an overlay explicitly, it means that you intend to make it available every time the base file is
loaded.
...any number of overlays can be
loaded into a master document, and an overlay can also load other overlays.
...And 4 more matches
Using Service Workers - Web APIs
so documents will have to be re
loaded to actually be controlled.
... now for a real example — what if we wanted to load images dynamically, but we wanted to make sure the images were
loaded before we tried to display them?
...we can use .onload to only display the image after it’s
loaded, but what about events that start happening before we start listening to them?
...And 4 more matches
Starting up and shutting down a WebXR session - Web APIs
context requirements a webxr compatible environment starts with a securely-
loaded document.
... your document needs to either have been
loaded from the local drive (such as by using an url such as http://localhost/...), or using https when loading the page.
... the javascript code must, likewise, have been
loaded securely.
...And 4 more matches
Window.open() - Web APIs
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.
...the url parameter specifies the url to be fetched and
loaded in the new window.
...And 4 more matches
Allowing cross-origin use of images and canvas - HTML: Hypertext Markup Language
html provides a crossorigin attribute for images that, in combination with an appropriate cors header, allows images defined by the <img> element that are
loaded from foreign origins to be used in a <canvas> as if they had been
loaded from the current origin.
... as soon as you draw into a canvas any data that was
loaded from another origin without cors approval, the canvas becomes tainted.
... the key is to use the crossorigin attribute by setting crossorigin on the htmlimageelement into which the image will be
loaded.
...And 4 more matches
<audio>: The Embed Audio element - HTML: Hypertext Markup Language
otherwise, setting currenttime sets the current playback position to the given time and seeks the media to that position if the media is currently
loaded.
...it may have one of the following values: none: indicates that the audio should not be pre
loaded.
... auto: indicates that the whole audio file can be down
loaded, even if the user is not expected to use it.
...And 4 more matches
Using the application cache - HTML: Hypertext Markup Language
since the document has already been
loaded into the browser from the cache, the updated document will not be rendered until the document is re
loaded (either manually or programatically).
...files listed under the cache: section header (or immediately after the cache manifest line) are explicitly cached after they're down
loaded for the first time.
...network entries in an application cache are essentially an "online whitelist"—uris specified in the network section are
loaded from the server instead of the cache.
...And 4 more matches
Content Security Policy (CSP) - HTTP
a csp compatible browser will then only execute scripts
loaded in source files received from those allowlisted domains, ignoring all other script (including inline scripts and event-handling html attributes).
... mitigating packet sniffing attacks in addition to restricting the domains from which content can be
loaded, the server can specify which protocols are allowed to be used; for example (and ideally, from a security standpoint), a server can specify that all content must be
loaded using https.
... example 4 a web site administrator for an online banking site wants to ensure that all its content is
loaded using tls, in order to prevent attackers from eavesdropping on requests.
...And 4 more matches
Content-Security-Policy - HTTP
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>.
... connect-src restricts the urls which can be
loaded using script interfaces default-src serves as a fallback for the other fetch directives.
...And 4 more matches
Index - HTTP
30 csp: block-all-mixed-content csp, directive, http, mixed content, reference, security the http content-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>.
... 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.
...And 4 more matches
Progressive loading - Progressive web apps (PWAs)
we should be able to show them at least the basic view of the page they want to see, with placeholders in the places more content will eventually be
loaded.
... to fix that we can, for example, add defer to javascript files: <script src="app.js" defer></script> they will be down
loaded and executed after the document itself has been parsed, so it won't block rendering the html structure.
...when you include <img> elements in your html, then every referenced image will be fetched and down
loaded during initial website access.
...And 4 more matches
Loading Content Scripts - Archive of obsolete content
the contentscriptfile option enables you to pass in the local file url from which the content script will be
loaded.
...contentscriptfile: [data.url("jquery-1.4.2.min.js"), data.url("my-content-script.js")] scripts specified using contentscriptfile are
loaded before those specified using contentscript.
... the contentscriptwhen option specifies when the content script(s) should be
loaded.
...And 3 more matches
window/utils - Archive of obsolete content
parameters uri : string uri of the document to be
loaded into the window.
... parameters options : object options for the function, with the following properties: name type url string uri of the document to be
loaded into the window.
... isdocument
loaded(window) check if the given window's document is completely
loaded.
...And 3 more matches
Listening to events in Firefox extensions - Archive of obsolete content
domcontent
loaded dispatched when the initial dom for the page is completely
loaded.
... once the page is
loaded, the onload handler fires.
... pageshow event this event works the same as the load event, except that it fires every time the page is
loaded (whereas the load event doesn't fire in firefox 1.5 when the page is
loaded from cache).
...And 3 more matches
Introducing the Audio API extension - Archive of obsolete content
reading audio streams the
loadedmetadata event when the metadata of the media element is available, it triggers a
loadedmetadata event.
...the following example extracts the data from an audio element: <!doctype html> <html> <head> <title>javascript metadata example</title> </head> <body> <audio id="audio-element" src="song.ogg" controls="true" style="width: 512px;"> </audio> <script> function
loadedmetadata() { channels = audio.mozchannels; rate = audio.mozsamplerate; framebufferlength = audio.mozframebufferlength; } var audio = document.getelementbyid('audio-element'); audio.addeventlistener('
loadedmetadata',
loadedmetadata, false); </script> </body> </html> the mozaudioavailable event as the audio is played, sample d...
...we can extend the previous example to visualize the timestamp and the first two samples in a <div> element: <!doctype html> <html> <head> <title>javascript visualization example</title> </head> <body> <audio id="audio-element" src="revolve.ogg" controls="true" style="width: 512px;"> </audio> <pre id="raw">hello</pre> <script> function
loadedmetadata() { channels = audio.mozchannels; rate = audio.mozsamplerate; framebufferlength = audio.mozframebufferlength; } function audioavailable(event) { var framebuffer = event.framebuffer; var t = event.time; var text = "samples at: " + t + "\n"; text += framebuffer[0] + " " + framebuffer[1]; ...
...And 3 more matches
Modularization techniques - Archive of obsolete content
a pure virtual interface is simply a class where every method is defined as pure virtual, that is: virtual int foo(int bar) = 0; pure virtual interfaces provide an easy mechanism for passing function tables between modules that may reside in separate, possibly dynamically
loaded, libraries.
... const nsiid &aiid, nsisupports *adelegate, void **aresult); // manually registry a factory for a class static nsresult registerfactory(const nscid &aclass, nsifactory *afactory, prbool areplace); // manually registry a dynamically
loaded factory for a class static nsresult registerfactory(const nscid &aclass, const char *alibrary, prbool areplace, prbool apersist); // manually unregister a factory for a class static nsresult unregisterfactory(const nscid &aclass, nsifactory *afactory); ...
...// manually unregister a dynamically
loaded factory for a class static nsresult unregisterfactory(const nscid &aclass, const char *alibrary); // unload dynamically
loaded factories that are not in use static nsresult freelibraries(); }; there are several ways a factory can make its way into the repository.
...And 3 more matches
A XUL Bestiary - Archive of obsolete content
the chrome url, which appears in place of the http url in pointers like the following global skin processing instruction: <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> specifies a chrome to be
loaded by the gecko rendering engine.
... in the example above, the chrome is simply a skin file to be
loaded into the xul file, but the chrome can also be used to load whole chromes, as when a <menuitem> in one window brings up a new chrome: <menuitem value="mozilla help" oncommand="window.opendialog('chrome://help/content/help.xul', '_blank', 'chrome,all,dialog=no')" /> in this example, the chrome url is being used to point to a chrome within the package hierarchy of the mozilla application.
...when you create different chrome for a package, you can create a subdirectory underneath content whose contents are
loaded instead of default.
...And 3 more matches
browser.type - Archive of obsolete content
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.
...And 3 more matches
Introduction - Archive of obsolete content
the datasource is
loaded via its url.
...otherwise, the datasource is
loaded as any other url is
loaded.
... if the datasource is already
loaded and cached, the template builder can begin work right away.
...And 3 more matches
iframe - Archive of obsolete content
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.
...And 3 more matches
Responsive images - Learn web development
the elva-fairy-480w.jpg will be
loaded, as its inherent width (480w) is closest to the slot size.
...when testing it with a mobile browser, you can use tools like firefox's about:debugging page to inspect the page
loaded on the mobile using the desktop developer tools.
... to see which images were
loaded, you can use firefox devtools's network monitor tab.
...And 3 more matches
Tracking Protection
in private browsing windows (tabs, in firefox for android), firefox will block content
loaded from domains that track users across sites.
... click the ⓘ symbol in the address bar to view information about the currently
loaded page.
... content is blocked based on the domain from which it is to be
loaded.
...And 3 more matches
WebRequest.jsm
browser object the xul browser into which the resource will be
loaded, or null if the resource will not be
loaded into a xul browser.
... browser object the xul browser into which the resource will be
loaded, or null if the resource will not be
loaded into a xul browser.
... browser object the xul browser into which the resource will be
loaded, or null if the resource will not be
loaded into a xul browser.
...And 3 more matches
Application Translation with Mercurial
so let's go to c:\mozilla by typing cd /c/mozilla/ create a new directory for the source code: mkdir mozilla-aurora initialize the new directory as new repository: hg init mozilla-aurora go into the new directory: cd mozilla-aurora unpack the source code: hg unbundle /path/to/the/down
loaded/mozilla-aurora.hg this can take some time, mostly depending on the performance of the hard drive.
... lastname <mynick@example.com> merge = internal:merge [alias] qexport = export -g -r qtip qexportall = diff -r qparent [defaults] commit = -v diff = -p -u 8 qdiff = -p -u 8 qnew = -u [diff] git = 1 showfunc = 1 unified = 8 [extensions] hgext.mq = progress = [hooks] put in your name and email address which later will be public on the internet after your translation patch got accepted and up
loaded.
...the file paths follow the directory structure of the locale repository down
loaded for translation.
...And 3 more matches
NSS Certificate Download Specification
for mozilla browsers, this handling will depend upon the mime content-type that is used on the object being down
loaded.
...these mime types are: application/x-x509-user-cert the certificate being down
loaded is a user certificate belonging to the user operating the browser.
... application/x-x509-ca-cert the certificate being down
loaded represents a certificate authority.
...And 3 more matches
PKCS11 FAQ
other certificates on the token are also
loaded (to allow building certificate chains), but it's not necessary to include the full chain, as long as the full chain is available in the regular certificate database.
...this value is set when the key is generated, so that nss will be able to find the key when the certificate for that key is
loaded.
... pkcs #11 certificates that have private keys associated with them are are
loaded into the temporary database (in memory) and marked as user certificates.
...And 3 more matches
NSS PKCS11 Functions
this is only applicable if the
loaded module is actually a moduledb rather than a pkcs #11 module (see pkcs11_module_specs).
...once the the module has been successfully
loaded, other nss calls will use it in the normal course of searching.
... modulespec specifies how the module should be
loaded.
...And 3 more matches
Scripting Java
if we just view the method object by itself we can see the various over
loaded forms of the method: js> f.listfiles function listfiles() {/* java.io.file[] listfiles() java.io.file[] listfiles(java.io.filenamefilter) java.io.file[] listfiles(java.io.filefilter) */} this output shows that the file class defines three over
loaded methods listfiles: one that takes no arguments, another with a filenamefilter argument, and a third with a filefilter argument.
... js> f.name test.txt js> f.directory false calling over
loaded methods the process of choosing a method to call based upon the types of the arguments is called overload resolution.
... as an example, consider the following java class that defines a number of over
loaded methods and calls them.
...And 3 more matches
mozIJSSubScriptLoader
as of gecko 8.0, scripts are
loaded from the startup cache where possible.
... the
loaded script is executed with the principal associated with the target object.
... any top-level functions or variables created by the
loaded script via var are created as properties of the targetobj target object (but things declared via let and const are not).
...And 3 more matches
nsIDOMWindowUtils
this is used on mobile, for example, to prevent attempts to render content until enough of the page has been
loaded to avoid content bouncing around excessively as more content is
loaded.
... select_character 0 select_cluster 1 select_word 2 select_line 3 select_beginline 4 select_endline 5 select_paragraph 6 select_wordnospace 7 agent_sheet 0 a possible type of a style sheet
loaded/removed with loadsheet()/removesheet().
... user_sheet 1 a possible type of a style sheet
loaded/removed with loadsheet()/removesheet().
...And 3 more matches
nsIDownloadManager
toolkit/components/downloads/public/nsidownloadmanager.idlscriptable this interface lets applications and extensions communicate with the download manager, adding and removing files to be down
loaded, fetching information about downloads, and being notified when downloads are completed.
... nsidownloadprogresslistener alistener); void resumedownload(in unsigned long aid); void retrydownload(in unsigned long aid); void savestate(); obsolete since gecko 1.8 void startbatchupdate(); obsolete since gecko 1.9.1 attributes attribute type description activedownloadcount long the number of files currently being down
loaded.
... the path is dependent on two user configurable prefs set in preferences: browser.download.folderlist defines the default download location for files: 0: files are down
loaded to the desktop by default.
...And 3 more matches
nsISHistoryListener
inherits from: nsisupports last changed in gecko 1.7 a session history listener is notified when pages are added to, removed from, and
loaded from session history.
...boolean onhistorygotoindex( in long aindex, in nsiuri agotouri ); parameters aindex the index in session history of the entry to be
loaded.
... agotouri the uri of the session history entry to be
loaded.
...And 3 more matches
nsIWebProgressListener
void onstatechange(in nsiwebprogress awebprogress, in nsirequest arequest, in unsigned long astateflags, in nsresult astatus); void onstatuschange(in nsiwebprogress awebprogress, in nsirequest arequest, in nsresult astatus, in wstring amessage); constants state transition flags these flags indicate the various states that requests may transition through as they are being
loaded.
...as such, there is no actual network activity associated with this request, and any modifications made to the document or presentation when it was originally
loaded will still be present.
...this may mean that the request is being
loaded as part of a page in which some content was received over an insecure channel.
...And 3 more matches
Initialization and Destruction - Plugins
initialization: the browser calls the plug-in api function np_initialize when the plug-in code is first
loaded.
... shutdown: when the last instance of a plug-in is deleted, the plug-in code is un
loaded from memory and the browser calls the function np_shutdown.
... initialization the browser calls np_initialize when a plug-in is
loaded and before the first instance is created.
...And 3 more matches
about:debugging - Firefox Developer Tools
this firefox provides information about temporary extensions you have
loaded for debugging, extensions that are installed in firefox, the tabs that you currently have open, and service workers running on firefox.
...when you do, it is added to the network locations list along with the devices, as shown below: this firefox the this firefox tab combines the features of extensions, tabs, and workers into a single tab with the following sections: temporary extensions displays a list of the extensions that you have
loaded using the load temporary add-on button.
... once you have
loaded a temporary extension, you can see information about it and perform operations on it.
...And 3 more matches
HTMLImageElement.loading - Web APIs
for instance, if the user is scrolling through the document, a value of lazy will cause the image to only be
loaded shortly before it will appear in the window's visual viewport.
...when images are
loaded eagerly (which is the default), every image in the document must be fetched before the load event can fire.
... images whose loading attribute is set to lazy but are located within the visual viewport immediately upon initial page load are
loaded as soon as the layout is known, but their loads do not delay the firing of the load event.
...And 3 more matches
Service Worker API - Web APIs
if successful, your service worker will be down
loaded to the client and attempt installation/activation (see below) for urls accessed by the user inside the whole origin, or inside a subset specified by you.
... download, install and activate at this point, your service worker will observe the following lifecycle: download install activate the service worker is immediately down
loaded when a user first accesses a service worker–controlled site/page.
... an event is fired on the service worker and it hasn't been down
loaded in the last 24 hours.
...And 3 more matches
Media buffering, seeking, and time ranges - Developer guides
sometimes it's useful to know how much <audio> or <video> has down
loaded or is playable without delay — a good example of this is the buffered progress bar of an audio or video player.
... buffered the buffered attribute will tell us which parts of the media has been down
loaded.
... it returns a timeranges object, which will tell us which chunks of media have been down
loaded.
...And 3 more matches
Media events - Developer guides
durationchange the metadata has
loaded or changed, indicating a change in duration of the media.
... this is sent, for example, when the media has
loaded enough that the duration is known.
... emptied the media has become empty; for example, this event is sent if the media has already been
loaded (or partially
loaded), and the load() method is called to reload it.
...And 3 more matches
Performance fundamentals - Web Performance
common-case animations are "off
loaded" to the system compositor, which can render them in a performant, power-efficient fashion.
... startup performance application startup is punctuated by three user-perceived events, generally speaking: the first is the application first paint — the point at which sufficient application resources have been
loaded to paint an initial frame the second is when the application becomes interactive — for example, users are able to tap a button and the application responds the final event is full load — for example when all the user's albums have been listed in a music player the key to fast startup is to keep two things in mind: upp is all that matters, and there's a "critical path" to each user-perceiv...
... for example, to paint an application's first frame that comprises visually some html and css to style that html: the html must be parsed the dom for that html must be constructed resources like images in that part of the dom have to be
loaded and decoded the css styles must be applied to that dom the styled document has to be reflowed nowhere in that list is "load the js file needed for an uncommon menu"; "fetch and decode the image for the high scores list", etc.
...And 3 more matches
Communicating With Other Scripts - Archive of obsolete content
this section of the guide explains how content scripts can communicate with: your main.js file, or any other modules in your add-on other content scripts
loaded by your add-on page scripts (that is, scripts embedded in the web page or included using <script> tags) main.js your content scripts can communicate with your add-on's "main.js" (or any other modules you're written for your add-on) by sending it messages, using either the port.emit() api or the postmessage() api.
... content scripts content scripts
loaded into the same document at the same time using the same method can interact with each other directly as well as with the web content itself.
... however, content scripts which have been
loaded into different documents cannot interact directly with each other.
...And 2 more matches
Content Processes - Archive of obsolete content
content scripts differ from scripts that are
loaded by the page itself in that they are provided with a messaging api that can be used to send messages back to the add-on script.
...among other things, this allows us to specify one or more content scripts to be
loaded.
... when a content script is first
loaded, the content worker automatically imports a messaging api that allows it to emit messages over a pipe.
...And 2 more matches
content/worker - Archive of obsolete content
content scripts specified by this option are
loaded before those specified by the contentscript option.
...content scripts specified by this option are
loaded after those specified by the contentscriptfile option.
... methods postmessage(data) asynchronously emits "message" events in the enclosed worker, where content script was
loaded.
...And 2 more matches
frame/hidden-frame - Archive of obsolete content
remove unregisters a frame, unloading any content that was
loaded in it.
... the following code creates a hidden frame, loads a web page into it, and then logs its title: var hiddenframes = require("sdk/frame/hidden-frame"); let hiddenframe = hiddenframes.add(hiddenframes.hiddenframe({ onready: function() { this.element.contentwindow.location = "http://www.mozilla.org/"; let self = this; this.element.addeventlistener("domcontent
loaded", function() { console.log(self.element.contentdocument.title); }, true, true); } })); see the panel module for a real-world example of usage of this module.
... parameters hiddenframe : hiddenframe the frame to add remove(hiddenframe) unregister a hidden frame, unloading any content that was
loaded in it.
...And 2 more matches
system/unload - Archive of obsolete content
experimental register callbacks that are called when a module is un
loaded.
... it ensures that this wrapper method is called when the object's module is un
loaded.
... when(callback) registers a function to be called when the module is un
loaded.
...And 2 more matches
Tabbed browser - Archive of obsolete content
you can access gbrowser only after the browser window is fully
loaded.
... gbrowser.tabcontainer.advanceselectedtab(-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.
...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.
...And 2 more matches
Creating a Help Content Pack - Archive of obsolete content
understanding the syntax is important because small syntax errors can mean that a whole file won't be
loaded correctly.
...this attribute also specifies what topic is
loaded when the user hits the home button in the viewer.
...the data source specified by toc will always be displayed, while the other data sources may only be available by searching through the
loaded content pack.
...And 2 more matches
Venkman Internals - Archive of obsolete content
if the file is not currently
loaded, the js engine doesn't know anything about the file.
... you can still set breakpoints, but they will be future breakpoints, which will be "real" breakpoints when/if the file is
loaded (note that this may never happen!).
... scriptmanager in initdebugger() the previous
loaded scripts are passed to an onscriptcreated() method which binds them to a scriptmanager.
...And 2 more matches
Binding Attachment and Detachment - Archive of obsolete content
whenever an element is removed from a document, any bindings attached via css
loaded by the document will be detached.
... <constructor> call as a document is
loaded and style rules are matched for elements, any binding documents that are encountered will load as needed.
...when the load event fires, and if all binding documents
loaded successfully, it can be assumed that all bindings are attached to all elements in the page.
...And 2 more matches
International characters in XUL JavaScript - Archive of obsolete content
gecko 1.8, as used in firefox 1.5 and other applications, added support for non-ascii characters in javascript files
loaded from xul files.
... earlier versions always interpreted js files
loaded from xul as iso-8859-1 (latin-1), in both local and remote cases.
... how the character encoding is determined in gecko 1.8 and later when the javascript file is
loaded from a chrome:// url, a byte order mark (fixme: )(bom) is used to determine the character encoding of the script.
...And 2 more matches
Template Builder Interface - Archive of obsolete content
the processes of creating a builder for an element applies both when an element is created when the window is
loaded and when an element is inserted dynamically.
...the only difference is that the datasource has already
loaded so the data will be the same.
...they will both be
loaded and the template reconstructed.
...And 2 more matches
XUL Structure - Archive of obsolete content
however, a file
loaded via a chrome url will be able to read files with the same access privileges as the installed extension.
...both html and xul placed on a web site have no extra permissions; however both html and xul
loaded through a chrome url have enhanced permissions.
... xul may be
loaded from a remote site, from the local file system, or installed as a package and accessed using a chrome url.
...And 2 more matches
editor - Archive of obsolete content
to enable editing on an editor, do either of the following: set the src attribute on the editor after the outer window has
loaded, for example, in the onload handler.
... call the makeeditable method to make the document
loaded in the editor editable.
... enable the design mode of the document
loaded in the editor.
...And 2 more matches
Client-side storage - Learn web development
separate storage for each domain there is a separate data store for each domain (each separate web address
loaded in the browser).
...we hope you have fun while you are here.'; // hide the 'forget' part of the form and show the 'remember' part forgetdiv.style.display = 'none'; rememberdiv.style.display = 'block'; } } last but not least, we need to run the namedisplaycheck() function every time the page is
loaded.
...this is already a great improvement to the user experience, but there is still one thing missing — the main html, css, and javascript files still need to be down
loaded each time the site is accessed, meaning that it won't work when there is no network connection.
...And 2 more matches
Drawing graphics - Learn web development
we could now try to embed the image using drawimage(), but we need to make sure the image file has been
loaded first, otherwise the code will fail.
... parameters 2 and 3 define the coordinates of the top left corner of the area you want to cut out of the
loaded image, relative to the top-left corner of the image itself.
... parameters 4 and 5 define the width and height of the area we want to cut out from the original image we
loaded.
...And 2 more matches
Multimedia: Images - Learn web development
previous overview: performance next media, namely images and video, account for over 70% of the bytes down
loaded for the average website.
...it's important to remember that when images are down
loaded, they need to be stored in memory.
...progressive jpegs, in contrast to normal jpegs, render progressively (hence the name), meaning the user sees a low-resolution version that gains clarity as the image downloads, rather than the image loading at full resolution top-to-bottom or even only rendering once completely down
loaded.
...And 2 more matches
Process scripts
however, a problem with frame scripts is that they can be
loaded multiple times in the content process, in multiple scopes that are insulated from each other.
... for example, if you call the global frame message manager's loadframescript() function, then the script will be
loaded separately into all open tabs.
...but if you register it in a frame script, and the frame script is
loaded more than once, you'll register the content policy more than once, which probably isn't what you intend.
...And 2 more matches
InstallListener
only called for add-ons that need to be down
loaded.
...check the progress property for the amount of data down
loaded and the maxprogress property for the total data expected.
...only called for add-ons that need to be down
loaded.
...And 2 more matches
Download
haspartialdata read only boolean indicates whether, at this time, there is any partially down
loaded data that can be used when restarting a failed or canceled download.
... note: this property's value may not match the actual final size of the down
loaded file if the download is encoded during the network transfer.
... you can use the downloadtarget.size property to get the actual size of the completely-down
loaded file once the download has succeeded.
...And 2 more matches
Shell global objects
sourceislazy if present and true, indicates that, after compilation, script source should not be cached by the js engine and should be lazily
loaded from the embedding as-needed.
... loadbytecode if true, and if the source is a cacheentryobject, the bytecode would be
loaded and decoded from the cache entry instead of being parsed, then it would be executed as usual.
... asserteqbytecode if true, and if both loadbytecode and savebytecode are true, then the
loaded bytecode and the encoded bytecode are compared.
...And 2 more matches
XPCOM changes in Gecko 2.0
prior to gecko 2, during component registration, all binary and javascript component files were
loaded and called, asking them to register themselves.
...the component is
loaded only when the xpcom component manager needs to create a component.
...in theory, this is invisible to the user, but it's a costly process, since every component needs to be
loaded and executed, then un
loaded, then re
loaded again during the restart.
...And 2 more matches
Observer Notifications
note that while the window are open and the chrome
loaded the tabs in the windows may still be being restored after this notification.
... browser-delayed-startup-finished sent when the browser window and all its components have been
loaded and initialized.
... the window id can be obtained from subject.queryinterface(components.interfaces.nsisupportspruint64).data toplevel-window-ready nsiwindowwatcher called just after a new top level window has been opened and is ready, but has not yet
loaded a document.
...And 2 more matches
imgIRequest
thod overview void cancelandforgetobserver(in nsresult astatus); imgirequest clone(in imgidecoderobserver aobserver); void decrementanimationconsumers(); imgirequest getstaticrequest(); void incrementanimationconsumers(); void lockimage(); void requestdecode(); void unlockimage(); attributes attribute type description corsmode long the cors mode that this image was
loaded with.
... imageprincipal nsiprincipal the principal gotten from the channel the image was
loaded from.
... status_load_complete 0x4 the data has been fully
loaded to memory, but not necessarily fully decoded.
...And 2 more matches
nsIApplicationUpdateService
methods adddownloadlistener() adds a listener that receives progress and state information about the update that is currently being down
loaded.
...void adddownloadlistener( in nsirequestobserver listener ); parameters listener an object implementing nsirequestobserver and optionally nsiprogresseventsink that will be notified of state and progress information as the update is down
loaded.
... return value a string indicating the status of the update upon return: "downloading" the update is being down
loaded.
...And 2 more matches
nsIStyleSheetService
a user sheet
loaded via this api will come before usercontent.css and userchrome.css in the cascade (so the rules in it will have lower precedence than rules in those sheets).
... an agent sheet
loaded via this api will come after ua.css in the cascade (so the rules in it will have higher precedence than rules in ua.css).
... the relative ordering of two user or two agent sheets
loaded via this api is undefined.
...And 2 more matches
Document - Web APIs
the document interface represents any web page
loaded in the browser and serves as an entry point into the web page's content, which is the dom tree.
...possible values are visible, hidden, prerender, and un
loaded.
... globaleventhandlers.on
loadeddata is an eventhandler representing the code to be called when the
loadeddata event is raised.
...And 2 more matches
HTMLImageElement.complete - Web APIs
the read-only htmlimageelement interface's complete attribute is a boolean value which indicates whether or not the image has completely
loaded.
... syntax let doneloading = htmlimageelement.complete; value a boolean value which is true if the image has completely
loaded; otherwise, the value is false.
... the image is considered completely
loaded if any of the following are true: neither the src nor the srcset attribute is specified.
...And 2 more matches
font-display - CSS: Cascading Style Sheets
the font-display descriptor determines how a font face is displayed based on whether and when it is down
loaded and ready to use.
... description the font display timeline the font display timeline is based on a timer that begins the moment the user agent attempts to use a given down
loaded font face.
... font block period if the font face is not
loaded, any element attempting to use it must render an invisible fallback font face.
...And 2 more matches
HTML attribute reference - HTML: Hypertext Markup Language
autofocus <button>, <input>, <keygen>, <select>, <textarea> the element should be automatically focused after the page
loaded.
... code <applet> specifies the url of the applet's class file to be
loaded and executed.
... loading <img>, <iframe> indicates if the element should be
loaded lazily (loading="lazy") or
loaded immediately (loading="eager").
...And 2 more matches
CSP: script-src - HTTP
this includes not only urls
loaded directly into <script> elements, but also things like inline script event handlers (onclick) and xslt stylesheets which can trigger script execution.
... 'strict-dynamic' the strict-dynamic source expression specifies that the trust explicitly given to a script present in the markup, by accompanying it with a nonce or a hash, shall be propagated to all the scripts
loaded by that root script.
... examples violation case given this csp header: content-security-policy: script-src https://example.com/ the following script is blocked and won't be
loaded or executed: <script src="https://not-example.com/js/library.js"></script> note that inline event handlers are blocked as well: <button id="btn" onclick="dosomething()"> you should replace them with addeventlistener calls: document.getelementbyid("btn").addeventlistener('click', dosomething); unsafe inline script note: disallowing inline styles and inline scripts is one of the biggest security w...
...And 2 more matches
Porting the Library Detector - Archive of obsolete content
for example, if window.jquery is defined, then the page has
loaded jquery.
... the script listens to gbrowser's domcontent
loaded event.
...however, instead of maintaining its own state by listening for gbrowser events and updating the user interface, the content script will just run when it's
loaded, collect the array of library names, and post it back to main.js: function testlibraries() { var win = unsafewindow; var librarylist = []; for(var i in ld_tests) { var passed = ld_tests[i].test(win); if (passed) { var libraryinfo = { name: i, version: passed.version }; librarylist.push(libraryinfo); } } self.postmessage(librarylist); } tes...
...h(function(library) { if (worker.tab.libraries.indexof(library) == -1) { worker.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.
content/loader - Archive of obsolete content
content scripts specified by this property are
loaded before those specified by the contentscript property.
...content scripts specified by this property are
loaded after those specified by the contentscriptfile property.
...this may take one of the following values: "start": load content scripts immediately after the document element for the page is inserted into the dom, but before the dom content itself has been
loaded "ready": load content scripts once dom content has been
loaded, corresponding to the domcontent
loaded event "end": load content scripts once all the content (dom, js, css, images) for the page has been
loaded, at the time the window.onload event fires contentscriptoptions read-only value exposed to content scripts under self.options property.
... contenturl the url of the content
loaded.
loader/sandbox - Archive of obsolete content
the argument may be: a url string, in which case the sandbox will get the same privileges as a script
loaded from that url a dom window object, to inherit privileges from the window being passed.
... evaluate code module provides evaluate function that lets you execute code in the given sandbox: evaluate(scope, 'var a = 5;'); evaluate(scope, 'a + 2;'); //=> 7 more details about evaluated script may be passed via optional arguments that may improve exception reporting: // evaluate code as if it was
loaded from 'http://foo.com/bar.js' and // start from 2nd line.
...this argument can be: a uri string, giving the sandbox the same privileges as a script
loaded from that url a dom window object, giving the sandbox the same privileges as the dom window null, to give the sandbox chrome privileges.
... uri : string evaluate the code as if it were being
loaded from the given uri.
platform/xpcom - Archive of obsolete content
registering and unregistering by default, factories and services are registered with xpcom automatically when they are created, and unregistered automatically when the add-on that created them is un
loaded.
... unregister boolean by default, the factory is unregistered as soon as the add-on which created it is un
loaded.
... by default, factories and services are unregistered automatically when the add-on that registered them is un
loaded.
... by default, the factory is registered when it is created and unregistered when the add-on that created it is un
loaded.
remote/child - Archive of obsolete content
enables an sdk module
loaded into a child process to access web content in the child process and communicate with modules in the main process.
...it provides two main things: access to web content
loaded into this child process port mechanisms to communicate with the main process interacting with web content to interact with web content, the sdk/remote/child module provides a frames property that's a list of all content frames
loaded into this child process.
... at this point you can't access frame's content yet, but you can add event listeners: const { frames } = require("sdk/remote/child"); frames.on("attach", function(frame) { console.log("new frame"); frame.addeventlistener("domcontent
loaded", function(e) { console.log(e.target.location.href); }); }); detach triggered when a frame is removed (for example, the user closed a tab).
...this can include load and unload events from any content that is
loaded in the frame.
remote/parent - Archive of obsolete content
multiprocess applications can have other remote processes where untrusted content like webpages are
loaded.
... frame every dom page
loaded as a part of the application is
loaded in a content frame.
... loading modules into the child process to load a module into the child process, use remoterequire(): const { remoterequire } = require("sdk/remote/parent"); remoterequire("./my-module.js", module); inter-process communication a module
loaded into a different process cannot directly communicate or share state with the module that
loaded it.
...on(process, message) { console.log("main says: " + message); }); // main.js const { processes, remoterequire } = require("sdk/remote/parent"); remoterequire("./remote.js", module); processes.port.emit("message-from-main", "hello from main"); processes.port.on("message-from-remote", function(process, message) { console.log("remote says: " + message); }); child process privileges a module
loaded into a child process can't do everything that the same module
loaded into the parent process can.
HTML to DOM - Archive of obsolete content
parsing complete html to dom loading an html document seems much simpler if it's
loaded using the xmlhttprequest object.
... donkeybrowser.style.height = "0px"; donkeybrowser.webnavigation.allowauth = true; donkeybrowser.webnavigation.allowimages = false; donkeybrowser.webnavigation.allowjavascript = false; donkeybrowser.webnavigation.allowmetaredirects = true; donkeybrowser.webnavigation.allowplugins = false; donkeybrowser.webnavigation.allowsubframes = false; donkeybrowser.addeventlistener("domcontent
loaded", function (e) { donkeyfire.donkeybrowser_onpageload(e); }, true); } with that code, we obtain a reference to the iframe element we declared in the .xul file.
... the most interesting piece of code here is the domcontent
loaded event listener we define for the element.
...aevent.originaltarget; var url = doc.location.href; if (aevent.originaltarget.nodename == "#document") { // ok, it's a real page, let's do our magic dump("[df] url = "+url+"\n"); var text = doc.evaluate("/html/body/h1",doc,null,xpathresult.string_type,null).stringvalue; dump("[df] text in /html/body/h1 = "+text+"\n"); } }, as you can see, we obtain full access to the dom of the page we
loaded in background, and we can even evaluate xpath expressions.
Working with BFCache - Archive of obsolete content
q: is the page re
loaded?
...
loaded from cache?
...a: in the non-bfcache case, the page is re
loaded in the sense of reparsing from the original html source.
...the dom is recreated during the parsing process, and scripts are recompiled (and also re
loaded, probably from the http cache).
Running Tamarin acceptance tests - Archive of obsolete content
the latest asc.jar can be down
loaded from from ftp://ftp.mozilla.org/pub/js/tamarin...latest/asc.jar.
... also the source to asc.jar may be down
loaded and rebuilt from http://opensource.adobe.com/wiki/dis...exsdk/flex+sdk.
...the latest asc.jar can be down
loaded from from ftp://ftp.mozilla.org/pub/js/tamarin...latest/asc.jar.
... also the source to asc.jar may be down
loaded and rebuilt from http://opensource.adobe.com/wiki/display/flexsdk/flex+sdk.
Content Panels - Archive of obsolete content
adding child panels there may be times when you want to have part of a document
loaded from a different page.
...it has the advantage that it can be placed anywhere and the contents can be
loaded from a different file.
...in this case, the content
loaded inside the browser is treated as if it was part of the same application and has access to the outer window.
... that means that when a script
loaded inside the browser tries to get the topmost window, it will get the outer xul window.
Using the Editor from XUL - Archive of obsolete content
overview 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.
...editor.xul is
loaded.
...it does some getting of window.arguments (which is a way callers can pass parameters to new windows -- we use this to get the url to be
loaded), then it calls editorstartup(), where the real work happens.
... we detect that the document we want to edit has
loaded successfully in nseditorshell::onenddocumentload().
prefpane - Archive of obsolete content
in this latter case, the separate file should use an overlay tag as its root tag since it will be
loaded as an overlay to the main preferences window.
... onpaneload type: script code code defined here is called when the pane has been
loaded, much like the load event for a window.
...
loaded indicates whether the pane is fully
loaded.
...supported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata events paneload this event is fired on the pane element when the pane is fully
loaded (e.g.
What’s in the head? Metadata in HTML - Learn web development
previous overview: introduction to html next the head of an html document is the part that is not displayed in the web browser when the page is
loaded.
... let's revisit the simple html document we covered in the previous article: <!doctype html> <html> <head> <meta charset="utf-8"> <title>my test page</title> </head> <body> <p>this is my page</p> </body> </html> the html head is the contents of the <head> element — unlike the contents of the <body> element (which are displayed on the page when
loaded in a browser), the head's content is not displayed on the page.
... the <h1> element appears on the page when
loaded in the browser — generally this should be used once per page, to mark up the title of your page content (the story title, or news headline, or whatever is appropriate to your usage.) the <title> element is metadata that represents the title of the overall html document (not the document's content.) active learning: inspecting a simple example to start off this active learning, we'd like y...
...this is useful as it makes sure that the html is all
loaded before the javascript runs, so that you don't get errors resulting from javascript trying to access an html element that doesn't exist on the page yet.
Fetching data from the server - Learn web development
originally page loading on the web was simple — you'd send a request for a website to a server, and as long as nothing went wrong, the assets that made the web page would be down
loaded and displayed on your computer.
... less data is down
loaded on each update, meaning less wasted bandwidth.
... to speed things up even further, some sites also store assets and data on the user's computer when they are first requested, meaning that on subsequent visits they use the local versions instead of downloading fresh copies when the page is first
loaded.
... the content is only re
loaded from the server when it has been updated.
Manipulating documents - Learn web development
there are a few really obvious bits you'll reference regularly in your code — consider the following diagram, which represents the main parts of a browser directly involved in viewing web pages: the window is the browser tab that a web page is
loaded into; this is represented in javascript by the window object.
... using methods available on this object you can do things like return the window's size (see window.innerwidth and window.innerheight), manipulate the document
loaded into that window, store data specific to that document on the client-side (for example using a local database or other storage mechanism), attach an event handler to the current window, and more.
... the document (represented by the dom in browsers) is the actual page
loaded into the window, and is represented in javascript by the document object.
... the document object model the document currently
loaded in each one of your browser tabs is represented by a document object model.
JavaScript performance - Learn web development
previous overview: performance next while images and video account for over 70% of the bytes down
loaded for the average website, byte per byte, javascript has a greater negative impact on performance.
...but not all bytes down
loaded have the same impact.
... javascript bytes have to be down
loaded, parsed, and exectuted.
...all of this javascript must be down
loaded.
Website security - Learn web development
any scripts in the original user content will be run when the new page is
loaded.
... while the data from post or get requests is the most common source of xss vulnerabilities, any data from the browser is potentially vulnerable, such as cookie data rendered by the browser, or user files that are up
loaded and displayed.
...when
loaded, this file might be executed on the web server or the client-side (leading to an xss attack).
...this includes, but is not limited to data in url parameters of get requests, post requests, http headers and cookies, and user-up
loaded files.
Setting up your own test automation environment - Learn web development
to install selenium-webdriver, run the following command, making sure you are inside your project folder: npm install selenium-webdriver note: it is still a good idea to follow these steps even if you previously installed selenium-webdriver and down
loaded the browser drivers.
...google should automatically be
loaded in a tab, "webdriver" should be entered in the search box, and the search button will be clicked.
...install it when it is down
loaded.
...when this has down
loaded, put it in a sensible place, like in your home directory.
Application cache implementation overview
loadedfromapplicationcache flag is now set true on the channel.
...when the url in the manifest attribute of the html tag is identical to the manifest url the channel's nsiapplicationcache object belongs to and, the channel's
loadedfromapplicationcache flag is set, the document is associated with that nsiapplicationcache object and an update attempt for the manifest is scheduled after the document completely loads.
... marking entries as foreign when nscontentsink::processofflinemanifest() discovers that the url in the manifest attribute of the html tag is different from the manifest url the channel's nsiapplicationcache object belongs to, the entry the document has been
loaded from is marked “foreign” and the page load is completely restarted.
...all files down
loaded are deleted and the new cache version is discarded.) an md5 hash is then calculated from the manifest content we download from the server to be compared to existing md5 (in case of an “update”).
Using the Browser API
the html an <iframe> is turned into a browser iframe by setting the mozbrowser attribute on it: <iframe src="http://mozilla.org" mozbrowser> in addition, the <iframe> can be
loaded in its own child process — separate to the page embedding this frame — by including the remote attribute.
...we then set the browser iframe's src attribute to equal the value of the url bar, which causes the new url to be
loaded in the iframe.
... in addition, the background of the controls ui bar is changed to the background color of the site that has just
loaded, to provide a more integrated experience — this can be read out of the event object's e.detail.backgroundcolor value.
... when the front page of https://developer.mozilla.org is
loaded, for example, the e.detail.backgroundcolor value reported is rgb(0, 83, 159).
HTTP Cache
the server responses with a 200 response which means the cached content is no longer valid and a new version must be
loaded from the network.
... keeps its internal state like not
loaded, loading, empty, writing, ready, revalidating.
... nsicachestorage.asyncopenuri forwards to cacheentry::asyncopen and triggers the following pseudo-code: cachestorage::asyncopenuri - the api entry point: globally atomic: look a given cacheentry in cachestorageservice hash tables up if not found: create a new one, add it to the proper hash table and set its state to not
loaded consumer reference ++ call to cacheentry::asyncopen consumer reference -- cacheentry::asyncopen (entry atomic): the opener is added to fifo, consumer reference ++ (dropped back after an opener is removed from the fifo) state == not
loaded: state = loading when open_truncate flag was used: cachefile is created as 'new', state = empty otherwise: ...
... only cacheentry objects that are already
loaded and filled with data and having the 'consumer reference == 0' (bug 942835) can be purged.
AddonManager
state_downloading an install that is in the process of being down
loaded.
... state_down
loaded an install that has finished downloading and is ready to install.
... error_incorrect_hash the down
loaded file did not match the expected hash.
...callback, in string mimetype, in string hash, in string name, in string iconurl, in string version, in nsiloadgroup loadgroup ) parameters url the url the add-on is located at callback a callback to pass the addoninstall to mimetype the mimetype of the add-on hash an optional hash of the add-on name an optional placeholder name while the add-on is being down
loaded iconurl an optional placeholder icon url while the add-on is being down
loaded version an optional placeholder version while the add-on is being down
loaded loadgroup an optional nsiloadgroup to associate any network requests with getinstallforfile() asynchronously gets an addoninstall for an nsifile.
Downloads.jsm
since the download cannot be restarted, any partially down
loaded data will not be kept in case the download fails.
... calling this function may cause the download list to be re
loaded from the previous session, if it wasn't
loaded already.
... calling this function does not cause the list of public downloads to be re
loaded from the previous session.
...dules/downloads.jsm"); components.utils.import("resource://gre/modules/osfile.jsm") components.utils.import("resource://gre/modules/task.jsm"); task.spawn(function () { yield downloads.fetch("http://www.mozilla.org/", os.path.join(os.constants.path.tmpdir, "example-download.html")); console.log("example-download.html has been down
loaded."); }).then(null, components.utils.reporterror); observing downloads this example logs a message every time a change occurs in one of the global download lists.
Using JavaScript code modules
the module is
loaded into a specific javascript scope, such as xul script or javascript xpcom script, using components.utils.import() or components.utils["import"]().
...(the url in the example is "resource://app/my_module.jsm".) code modules can only be
loaded using a chrome: (), resource:, or file: url.
... sharing objects using code modules an extremely important behavior of components.utils.import() is that modules are cached when
loaded and subsequent imports do not reload a new version of the module, but instead use the previously cached version.
...ocal;1"] .createinstance(components.interfaces.nsilocalfile); aliasfile.initwithpath("/some/absolute/path"); var aliasuri = services.io.newfileuri(aliasfile); resprot.setsubstitution("myalias", aliasuri); // assuming the code modules are in the alias folder itself notes custom modules and xpcom components note that prior to gecko 2.0 javascript xpcom components are
loaded before chrome registration.
NSS tools : signtool
netscape internal pkcs #11 module (this module is internally
loaded) slots: 2 slots attached status:
loaded slot: communicator internal cryptographic services version 4.0 token: communicator generic crypto svcs slot: communicator user private key and certificate services token: communicator certificate db 2.
... cryptos (this is an external module) dll name: core32 slots: 1 slots attached status:
loaded slot: litronic 210 token: ----------------------------------------------- using netscape signing tool and a smart card to sign files the signtool command normally takes an argument of the -k option to specify a signing certificate.
...netscape internal pkcs #11 module (this module is internally
loaded) slots: 2 slots attached status:
loaded slot: communicator internal cryptographic services version 4.0 token: communicator generic crypto svcs slot: communicator user private key and certificate services token: communicator certificate db ----------------------------------------------- this unix example shows that netscape signing tool is using a fips-...
...netscape internal fips pkcs #11 module (this module is internally
loaded) slots: 1 slots attached status:
loaded slot: netscape internal fips-140-1 cryptographic services token: communicator certificate db ----------------------------------------------- see also signver (1) the nss wiki has information on the new database design and how to configure applications to use it.
JS::CompileOptions
the web platform allows scripts to be
loaded from arbitrary cross-origin sources.
... to counter this attack, html5 specifies that script errors should be sanitized ("muted") when the script is not same-origin with the global for which it is
loaded.
... sourceislazy bool true indicates that, after compilation, script source should not be cached by the js engine and should be lazily
loaded from the embedding as-needed.
... in addition to above, the following are used in browser: "worker" - code
loaded by calling the web worker constructor—the worker's main script.
Building the WebLock UI
first of all, it's important to be able to represent the basic state of the lock as soon as it's
loaded.
...this is a bit more complicated, because it requires that you work with the currently
loaded page or provide other ui (e.g., a textfield where you can enter an arbitrary url) for specifying urls.
... weblock.css the following style rules are defined in weblock.css, a css file that is
loaded by the overlay and applied to the icon in the browser that reflects the current status of the web lock and provides access to the web lock manager dialog.
...(note: we include three images to represent the state of the weblock, but wlock.gif and wl-lock.gif are identical, since weblock is presumed to be unlocked when it's
loaded.
Creating the Component Code
use the calculator (after learning long division) you have to write a fair amount of code to create a component library that gets
loaded into xpcom.
...the aloaderstr parameter, which is opaque and should not be modified, distinguishes components that are
loaded from the same location specified by the nsifile parameter.
...since xpcom already knows internally what kind of file it has just
loaded and called registerself on, passing this value to the registration methods is a shortcut for determining what kind of component is being registered.
...xpcom then loads the component library associated with the cid if it isn't
loaded already.
nsICachingChannel
load_only_if_modified 1 << 31 this load flag controls what happens when a document would be
loaded from the cache to satisfy a call to asyncopen.
... if this attribute is set to true, then the document will not be
loaded from the cache.
... methods isfromcache() obsolete since gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) this method finds out whether or not this channel's data is being
loaded from the cache.
...return value returns true if this channel's data is being
loaded from the cache, otherwise returns false.
nsIDOMProgressEvent
method overview void initprogressevent(in domstring typearg, in boolean canbubblearg, in boolean cancelablearg, in boolean lengthcomputablearg, in unsigned long long
loadedarg, in unsigned long long totalarg); deprecated since gecko 22.0 attributes attribute type description lengthcomputable boolean specifies whether or not the total size of the transfer is known.
...
loaded unsigned long long the number of bytes transferred since the beginning of the operation.
... void initprogressevent( in domstring typearg, in boolean canbubblearg, in boolean cancelablearg, in boolean lengthcomputablearg, in unsigned long long
loadedarg, in unsigned long long totalarg ); parameters typearg the type of event.
...
loadedarg the number of bytes already transferred.
nsIMsgDBView
return values acount upon return, the count variable may contain the number of messages
loaded.
... void init(in nsimessenger amessengerinstance, in nsimsgwindow amsgwindow, in nsimsgdbviewcommandupdater acommandupdater); parameters amessengerinstance amsgwindow acommandupdater sort() sorts the currently
loaded messages.
... docommand() perform a command on the currently
loaded messages.
...this forces everything to be re-down
loaded.
nsIUpdatePatch
toolkit/mozapps/update/nsiupdateservice.idlscriptable an interface that describes an object representing a patch file that can be down
loaded and applied to a version of this application so that it can be updated.
... 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 nsidomelement serialize(in nsidomdocument updates); attributes attribute type description finalurl astring the final url this patch was being down
loaded from.
... selected boolean true if this patch is currently selected as the patch to be down
loaded and installed for this update transaction.
... url astring the url from which the patch was down
loaded.
nsIUpdatePrompt
1.0 66 introduced gecko 1.8 inherits from: nsisupports last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) method overview void checkforupdates(); void showupdateavailable(in nsiupdate update); void showupdatedown
loaded(in nsiupdate update, [optional] in boolean background); void showupdateerror(in nsiupdate update); void showupdatehistory(in nsidomwindow parent); void showupdateinstalled(); methods checkforupdates() presents a user interface that checks for and displays the available updates.
...showupdateavailable() shows a message advising the user that an update is available to be down
loaded and installed.
... showupdatedown
loaded() shows a message advising the user that an update has been down
loaded, and that the user should restart the application in order to install it.
...void showupdatedown
loaded( in nsiupdate update, in boolean background optional ); parameters update an nsiupdate describing the update that was down
loaded.
nsIUploadChannel
inherits from: nsisupports last changed in gecko 1.7 method overview void setuploadstream(in nsiinputstream astream, in acstring acontenttype, in long acontentlength); attributes attribute type description uploadstream nsiinputstream get the stream (to be) up
loaded by this channel.
... methods setuploadstream() sets a stream to be up
loaded by this channel.
...void setuploadstream( in nsiinputstream astream, in acstring acontenttype, in long acontentlength ); parameters astream the stream to be up
loaded by this channel.
... acontenttype if acontenttype is empty, the protocol will assume that no content headers are to be added to the up
loaded stream and that any required headers are already encoded in the stream.
ctypes.open
int add(int a, int b) { return a + b; } to make this a shared library, a native file which can be
loaded and used from js-ctypes, compile it with these commands: gcc -fpic -c mycfuntionsforunix.c gcc -shared -o mycfuntionsforunix.so mycfuntionsforunix.o a file named mycfuntionsforunix.so is successfully created.
... this native file can be placed in any folder of an addon and then
loaded from js-ctypes.
... they can also be
loaded from the system library path.
...see: http://stackoverflow.com/questions/19382201/how-to-load-dll-from-sdk-addon-data-folder it is important to note that custom native files cannot be
loaded through chrome:// or resource:// uris.
Scripting plugins - Plugins
that means that a script from an origin other than the origin of the page that
loaded the plugin is not able to access methods and properties on the plugin.
... the same thing applies the other way too; the plugin can reach only javascript objects in the same origin as the page that
loaded the plugin.
... in addition to this, a further extension to this api is being discussed that would give a plugin greater flexibility by letting the plugin control the origin of the calling code, so that the plugin can specify the origin of calls that come from internally
loaded code from other origins.
... a plugin that wishes to be scriptable using this new mechanism needs to return the appropriate npobject (which is created by calling npn_createobject) when the browser requests it by calling: npp_getvalue(npp, nppvpluginscriptablenpobject, ...); accessing browser objects from a plugin a plugin that wishes to access objects in the browser window that
loaded the plugin can do this by getting the npobject for the browser's window object, or the dom element that
loaded the plugin.
DOM Inspector internals - Firefox Developer Tools
viewers are dynamically
loaded; when the panel is made to switch from one viewer to another, the old viewer is destroyed, and the new viewer is
loaded in its place.
...this comparison turns out to be quite apt, since each panel actually contains an anonymous browser, and individual viewers exist in separate documents
loaded in the browser.
... this separation allows for viewers to be self-contained, with a viewer's xul defined in its own document and
loaded in its own scope, without fear of collisions in the xul, css, or js.
....xul chrome://inspector/content/viewers/d...andoverlay.xul chrome://inspector/content/keysetoverlay.xul chrome://inspector/content/viewers/d...setoverlay.xul chrome://inspector/content/statusbaroverlay.xul chrome://global/content/globaloverlay.xul (note that the overlays from the viewer subdirectories—viewers/dom and viewers/stylerules—are
loaded as a result of overlay directives in dom inspector's chrome manifest, rather than being explicitly imported using a xul-overlay processing instruction in the overlaid file.) inspectoroverlay.xul this imports the scripts the top-level inspector needs, including dependencies.
Introduction to DOM Inspector - Firefox Developer Tools
inspecting content documents the inspect content document menupopup can be accessed from the file menu, and it will list currently
loaded content documents.
... inspecting chrome documents the inspect chrome document menupopup can be accessed from the file menu , and it will contain the list of currently
loaded chrome windows and subdocuments.
...(note that there are bugs which prevent the flasher from dom inspector apis from working correctly on certain platforms.) if you inspect the main browser window, for example, and select nodes in the dom nodes viewer (other than the elements which have no visible ui as is the case with the endless list of script elements that are
loaded into browser.xul), you will see the various parts of the browser interface being highlighted with a blinking red border.
... basic actions of the dom nodes viewer selecting elements by click another powerful interactive feature of the dom inspector is that when you have the dom inspector open and have enabled this functionality by choosing edit > select element by click or by clicking the little magnifying glass icon in the upper left portion of the dom inspector application, you can click anywhere in a
loaded web page or the the inspect chrome document, and the element you click will be shown in the document pane in the dom nodes viewer and information displayed in the object pane.
Debugger.Source - Firefox Developer Tools
url if the instance refers to javascript source, the filename or url from which this script’s code was
loaded.
...source may be
loaded from a url in the following ways: the url may appear as the src attribute of a <script> element in markup text.
... (note that code passed to eval, the function constructor, or a similar function isnot considered to be
loaded from a url; the url accessor on debugger.source instances for such sources should return undefined.) if the instance refers to webassembly code, the url of the script that called new webassembly.module with the string "> wasm" appended.
... "worker", for code
loaded by calling the web worker constructor—the worker’s main script.
FontFace.display - Web APIs
the display property of the fontface interface determines how a font face is displayed based on whether and when it is down
loaded and ready to use.
... swap period if the font face is still not
loaded, the fallback font will be shown.
... when the font face loads, the fallback will be swaped for the down
loaded font.
... failure period if the font face still is not
loaded, the fallback font will be shown and no swap will occur.
FontFace - Web APIs
it allows control of the source of the font face, being a url to an external resource, or a buffer; it also allows control of when the font face is
loaded and its current status.
... fontface.display a cssomstring that determines how a font face is displayed based on whether and when it is down
loaded and ready to use.
... fontface.
loaded read only returns a promise that resolves with the current fontface object when the font specified in the object's constructor is done loading or rejects with a syntaxerror.
... fontface.status read only returns an enumerated value indicating the status of the font, one of "un
loaded", "loading", "
loaded", or "error".
Advanced techniques: Creating and sequencing audio - Web APIs
loading the sample we want to make sure our file has
loaded and been decoded into a buffer before we use it, so let's create an async function to allow us to do this: async function getfile(audiocontext, filepath) { const response = await fetch(filepath); const arraybuffer = await response.arraybuffer(); const audiobuffer = await audiocontext.decodeaudiodata(arraybuffer); return audiobuffer; } we can then use the await operator when calling this...
... let's create another async function to set up the sample — we can combine the two async functions in a nice promise pattern to perform further actions when this file is
loaded and buffered: async function setupsample() { const filepath = 'dtmf.mp3'; const sample = await getfile(audioctx, filepath); return sample; } note: you can easily modify the above function to take an array of files and loop over them to load more than one sample.
... drawnote) { pads.foreach(function(el, i) { el.children[lastnotedrawn].style.bordercolor = 'hsla(0, 0%, 10%, 1)'; el.children[drawnote].style.bordercolor = 'hsla(49, 99%, 50%, 1)'; }); lastnotedrawn = drawnote; } // set up to draw again requestanimationframe(draw); } putting it all together now all that's left to do is make sure we've
loaded the sample before we are able to play the instrument.
... // when the sample has
loaded allow play let loadingel = document.queryselector('.loading'); const playbutton = document.queryselector('[data-playing]'); let isplaying = false; setupsample() .then((sample) => { loadingel.style.display = 'none'; // remove loading screen dtmf = sample; // to be used in our playsample function playbutton.addeventlistener('click', function() { isplaying = !isplaying; if (isplaying) { // start playing // check if context is in suspended state (autoplay policy) if (audioctx.state === 'suspended') { a...
Using Web Workers - Web APIs
if the script can't be
loaded, network_error is thrown, and subsequent code will not be executed.
... note: scripts may be down
loaded 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.
... note: in firefox, shared workers cannot be shared between documents
loaded in private and non-private windows (bug 1177621).
Window: load event - Web APIs
the load event is fired when the whole page has
loaded, including all dependent resources such as stylesheets and images.
... this is in contrast to domcontent
loaded, which is fired as soon as the page dom has been
loaded, without waiting for resources to finish loading.
... bubbles no cancelable no interface event event handler property onload examples log a message when the page is fully
loaded: window.addeventlistener('load', (event) => { console.log('page is fully
loaded'); }); the same, but using the onload event handler property: window.onload = (event) => { console.log('page is fully
loaded'); }; live example html <div class="controls"> <button id="reload" type="button">reload</button> </div> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents" rows="8" cols="30"></textarea> </div> css body { display: grid; grid-template-areas: "control log"; } .controls { grid-area: control; display: flex; align-items: center; justify-conten...
...click', () => { log.textcontent =''; window.settimeout(() => { window.location.reload(true); }, 200); }); window.addeventlistener('load', (event) => { log.textcontent = log.textcontent + 'load\n'; }); document.addeventlistener('readystatechange', (event) => { log.textcontent = log.textcontent + `readystate: ${document.readystate}\n`; }); document.addeventlistener('domcontent
loaded', (event) => { log.textcontent = log.textcontent + `domcontent
loaded\n`; }); result specifications specification status comment ui eventsthe definition of 'load' in that specification.
Implementing a Microsoft Active Accessibility (MSAA) Server - Accessibility
this can lead to crashes where it releases something and the wrong time, when some of your dll's are un
loaded but not others, and a destructor is called in an un
loaded dll.
... solution: create a "shutdown" method for each internal accessible object, to remove any references to other internal objects before any of your dll's are un
loaded.
...use state_busy to indicate that a new document is being
loaded.
... until the wm_getobject message is processed, the gecko accessibility service is not used, and thus the accessibility.dll is not
loaded, so there is almost zero overhead for accessibility api support in mozilla or gecko, in the general case.
<iframe>: The Inline Frame element - HTML: Hypertext Markup Language
high the resource should be down
loaded before other lower-priority page resources.
... low the resource should be down
loaded after other higher-priority page resources.
...via element.removeattribute()) causes about:blank to be
loaded in the frame in firefox (from version 65), chromium-based browsers, and safari/ios.
...scripts cannot access most properties in other window objects if the script was
loaded from a different origin, including scripts inside a frame accessing the frame's parent.
HTML documentation index - HTML: Hypertext Markup Language
2 allowing cross-origin use of images and canvas advanced, cors, canvas, html, image, reference, security, storage, data html provides a crossorigin attribute for images that, in combination with an appropriate cors header, allows images defined by the <img> element that are
loaded from foreign origins to be used in a <canvas> as if they had been
loaded from the current origin.
... 113 manifest cache, application cache the manifest attribute of <html> element specifies a url of a application cache manifest that is down
loaded in the early stages of page load.
...once chosen, the files can be up
loaded to a server using form submission, or manipulated using javascript code and the file api.
... 205 <template>: the content template element element, html, html web components, html:flow content, html:metadata content, html:phrasing content, html:script-supporting element, reference, template, web, web components the html content template (<template>) element is a mechanism for holding html that is not to be rendered immediately when a page is
loaded but may be instantiated subsequently during runtime using javascript.
Cross-Origin Resource Sharing (CORS) - HTTP
this means that a web application using those apis can only request resources from the same origin the application was
loaded from unless the response from other origins includes the right cors headers.
... web fonts (for cross-domain font usage in @font-face within css), so that servers can deploy truetype fonts that can only be cross-site
loaded and used by web sites that are permitted to do so.
... in this example, content originally
loaded from http://foo.example makes a simple get request to a resource on http://bar.other which sets cookies.
...in the example above, the page is
loaded from foo.example, but the cookie on line 20 is sent by bar.other, and would thus not be saved if the user has configured their browser to reject all third-party cookies.
Progressive web app structure - Progressive web apps (PWAs)
it's different with html, as the browser is actually streaming the data already and you can see when the elements are
loaded and rendered on the website.
... to have the javascript "operational", however, it has to be down
loaded in its entirety.
... the streams api allows developers to have direct access to data streaming from the server — if you want to perform an operation on the data (for example, adding a filter to a video), you no longer need to wait for all of it to be down
loaded and converted to a blob (or whatever) — you can start right away.
...this is our content,
loaded into the content section with javascript.
Structural overview of progressive web apps - Progressive web apps (PWAs)
it's different with html, as the browser is actually streaming the data already and you can see when the elements are
loaded and rendered on the website.
... to have the javascript actually work, however, it has to be down
loaded in its entirety.
...if you want to perform an operation on the data (for example, adding a filter to a video), you no longer need to wait for all of it to be down
loaded and converted to a blob (or whatever).
... app.js: the main app javascript the file app.js is run when the app is first
loaded; its job is primarily to initialize the app, though it c can do other things as well.
windows - Archive of obsolete content
this does not mean that the url content has
loaded, only that the window itself is fully functional and its properties can be accessed.
...this does not mean that the content has
loaded, only that the browser window itself is fully visible to the user.
...in particular, if the user quits the browser then it's possible that your add-on will be un
loaded before all windows are closed.
dev/panel - Archive of obsolete content
optional onload function an event handler that will be called after the document in the panel is fully
loaded.
...uggee; }, dispose: function() { this.debuggee = null; }, onready: function() { // in this function you can communicate // with the panel document } }); // export the constructor exports.mypanel = mypanel; // create a new tool, initialized // with the new constructor const mytool = new tool({ panels: { mypanel: mypanel } }); panel document environment the panel document
loaded from the url property can of course include css and javascript just like a normal web page: <html> <head> <meta charset="utf-8"> <link href="./my-panel.css"rel="stylesheet"></link> <script src="resource://sdk/dev/volcan.js"></script> </head> <body> <div id="content"></div> </body> <script src="./my-panel.js"></script> </html> it doesn't have access to any privileged...
... communicating with the panel document the main add-on code can't directly access the panel document or any scripts
loaded by the panel document.
Tutorials - Archive of obsolete content
listen for page load use the tabs module to get notified when new web pages are
loaded, and access their content.
... modify web pages modify web pages based on url create filters for web pages based on their url: whenever a web page whose url matches the filter is
loaded, execute a specified script in it.
... listen for load and unload get notifications when your add-on is
loaded or un
loaded by firefox, and pass arguments into your add-on from the command line.
Downloading JSON and JavaScript in extensions - Archive of obsolete content
once the content has been down
loaded, the extension authors proceed to use eval() to decode the string content into javascript objects.
... downloading javascript of course there are times when javascript code modules are down
loaded and injected into the extension.
...in this case, javascript sandboxing should be used to isolate the down
loaded javascript from the rest of the extension, and host application.
Extension Versioning, Update and Compatibility - Archive of obsolete content
<!-- one targetapplication for each application the add-on is compatible with --> <em:targetapplication> <rdf:description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minversion>1.5</em:minversion> <em:maxversion>2.0.0.*</em:maxversion> <!-- this is where this version of the add-on will be down
loaded from --> <em:updatelink>https://www.mysite.com/foobar2.2.xpi</em:updatelink> <!-- a page describing what is new in this updated version --> <em:updateinfourl>http://www.mysite.com/updateinfo2.2.xhtml</em:updateinfourl> </rdf:description> </em:targetapplication> </rdf:description> </rdf:li> <rdf:l...
... update hashes in order to verify the integrity of the down
loaded xpi you may provide an updatehash entry alongside the updatelink.
... <em:updatehash>sha256:78fc1d2887eda35b4ad2e3a0b60120ca271ce6e64ad2e3a0b60120ca271ce6e6</em:updatehash> note: the value of updatehash, must start with the string of hashing algorithm, it is a common error to delete this prefix, when setting new value to updatehash:sha256:78fc1d2887eda35b4ad2e3a0b60120ca271ce6e64ad2e3a0b60120ca271ce6e6 when a hash is specified the down
loaded file is compared with the hash and an error shown if it does not match.
JavaScript Object Management - Archive of obsolete content
the load event is fired after the dom on the window has
loaded completely, but before it's displayed to the user.
... } // more stuff }; window.addeventlistener( "load", function() { 〈namespace〉.browseroverlay.init(); }, false); there are some things you can't (or shouldn't) do inside load handlers, such as closing the window being
loaded, or opening new windows, alerts or dialogs.
... module files can be imported to a chrome script or to other code modules with the following line: components.utils.import("resource://xulschoolhello/messagecount.js"); when using components.utils.import, code modules must be
loaded using a file: or resource: url pointing to a file on the disk.
Security best practices in extensions - Archive of obsolete content
files
loaded using the file protocol can access files on the user's disk and other local devices.
...they can be included in content, or down
loaded at intervals.
...the usefulness of it and power of how it works is best illustrated by the popular greasemonkey extension, which works on the premise of scripts being down
loaded and stored locally, to be injected into the web content context via the sandbox.
Visualizing an audio spectrum - Archive of obsolete content
the function handling the
loadedmetadata event stores the metadata of the audio element in global variables; the function for the mozaudioavailable event does an fft of the samples and displays them in a canvas.
... <audio id="audio-element" src="song.ogg" controls="true" style="width: 512px;"> </audio> <div><canvas id="fft" width="512" height="200"></canvas></div> <script> var canvas = document.getelementbyid('fft'), ctx = canvas.getcontext('2d'), channels, rate, framebufferlength, fft; function
loadedmetadata() { channels = audio.mozchannels; rate = audio.mozsamplerate; framebufferlength = audio.mozframebufferlength; fft = new fft(framebufferlength / channels, rate); } function audioavailable(event) { var fb = event.framebuffer, t = event.time, /* unused, but it's there */ signal = new float32a...
...+ ) { // multiply spectrum by a zoom value magnitude = fft.spectrum[i] * 4000; // draw rectangle bars for each frequency bin ctx.fillrect(i * 4, canvas.height, 3, -magnitude); } } var audio = document.getelementbyid('audio-element'); audio.addeventlistener('mozaudioavailable', audioavailable, false); audio.addeventlistener('
loadedmetadata',
loadedmetadata, false); // fft from dsp.js, see below var fft = function(buffersize, samplerate) { this.buffersize = buffersize; this.samplerate = samplerate; this.spectrum = new float32array(buffersize/2); this.real = new float32array(buffersize); this.imag = new float32array(buffersize); this.reverset...
Structure of an installable bundle - Archive of obsolete content
instead, you need to use manifest flags, such as the os and abi flags, in your chrome manifest to specify components that should be
loaded for specific platforms.
...the format of the platform string is: {os_target}_{target_xpcom_abi} all of the files which are
loaded from the main extension directory are
loaded from the subdirectory /platform/{platform string} if it exists.
...when default preferences are defined in several directories, the ones
loaded later overwrite the earlier ones.
Download Manager preferences - Archive of obsolete content
a boolean value that indicates whether the anti virus software should try to clean a down
loaded file when a virus is detected.
...on windows xp sp2 and windows vista, this value also indicates whether down
loaded files trigger a security warning upon launch.
... preference description browser.download.dir a local folder the user may have selected for down
loaded files to be saved.
Downloading Nightly or Trunk Builds - Archive of obsolete content
the same machines produce about every 24 hours a "nightly" build which can be down
loaded by anyone if you know where to get it: these are the nightly builds, and testers all over the world download them and test them, reporting as they go along on any bugs that hit them.
... nightly builds can be down
loaded from https://archive.mozilla.org/pub/firefox/nightly/.
... if you need to download builds often, most builds can be down
loaded semi-automatically and saved with a convenient name using mozdownload.
JavaScript Client API - Archive of obsolete content
further, you agree (a) to maintain and link to (including on websites from which your third party client may be down
loaded) a separate, conspicuous, and reasonably detailed privacy policy detailing how data collected or transmitted by your third party client is managed and protected; (b) that your third party client will only store data in encrypted form on the firefox sync servers operated by mozilla; (c) that you and your third party client will use the firefox sync apis solely for their intended purpose; (d) that ...
...records are transformed to wbo's, up
loaded to a collection in a sync server and eventually down
loaded by other sync clients.
...this is the method that the engine will call the first time it syncs, in order to get a complete inventory of what data there is that will need to be up
loaded to the server.
jspage - Archive of obsolete content
s(d,b); }}else{if(c[a]){c[a].keys.each(function(e){this.addevent(a,e);},this);}}return this;}});element.nativeevents={click:2,dblclick:2,mouseup:2,mousedown:2,contextmenu:2,mousewheel:2,dommousescroll:2,mouseover:2,mouseout:2,mousemove:2,selectstart:2,selectend:2,keydown:2,keypress:2,keyup:2,focus:2,blur:2,change:2,reset:2,select:2,submit:2,load:1,unload:1,beforeunload:2,resize:1,move:1,domcontent
loaded:1,readystatechange:1,error:1,abort:1,scroll:1}; (function(){var a=function(b){var c=b.relatedtarget;if(c==undefined){return true;}if(c===false){return false;}return($type(this)!="document"&&c!=this&&c.prefix!="xul"&&!this.haschild(c)); };element.events=new hash({mouseenter:{base:"mouseover",condition:a},mouseleave:{base:"mouseout",condition:a},mousewheel:{base:(browser.engine.gecko)?"dommousescro...
...b=this,c=0;while((b=b.previoussibling)){if(b.nodetype==1&&++c>a){return false;}}return(c==a);},even:function(b,a){return selectors.pseudo["nth-child"].call(this,"2n+1",a); },odd:function(b,a){return selectors.pseudo["nth-child"].call(this,"2n",a);},selected:function(){return this.selected;},enabled:function(){return(this.disabled===false); }});element.events.domready={onadd:function(a){if(browser.
loaded){a.call(this);}}};(function(){var b=function(){if(browser.
loaded){return;}browser.
loaded=true; window.fireevent("domready");document.fireevent("domready");};window.addevent("load",b);if(browser.engine.trident){var a=document.createelement("div"); (function(){($try(function(){a.doscroll();return document.id(a).inject(document.body).set("html","temp").dispose();}))?b():arguments.callee.delay(50);})...
...(); }else{if(browser.engine.webkit&&browser.engine.version<525){(function(){(["
loaded","complete"].contains(document.readystate))?b():arguments.callee.delay(50); })();}else{document.addevent("domcontent
loaded",b);}}})();var json=new hash(this.json&&{stringify:json.stringify,parse:json.parse}).extend({$specialchars:{"\b":"\\b","\t":"\\t","\n":"\\n","\f":"\\f","\r":"\\r",'"':'\\"',"\\":"\\\\"},$replacechars:function(a){return json.$specialchars[a]||"\\u00"+math.floor(a.charcodeat()/16).tostring(16)+(a.charcodeat()%16).tostring(16); },encode:function(b){switch($type(b)){case"string":return'"'+b.replace(/[\x00-\x1f\\"]/g,json.$replacechars)+'"';case"array":return"["+string(b.map(json.encode).clean())+"]"; case"object":case"hash":var a=[];hash.each(b,function(e,d){var c=json.encode(e);if(c){a.push(js...
Safely loading URIs - Archive of obsolete content
chrome: give the
loaded page expanded privileges.
...all three methods take three arguments: the first argument identifies the source of the uri, the second argument is the uri that one plans to load, and the third argument is a set of flags that can be used to impose additional restrictions on the uris that may be
loaded.
... 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.
Running Tamarin performance tests - Archive of obsolete content
also the source to asc.jar may be down
loaded and rebuilt from http://opensource.adobe.com/wiki/dis...exsdk/flex+sdk.
...the latest asc.jar can be down
loaded from from ftp://ftp.mozilla.org/pub/js/tamarin...latest/asc.jar.
... also the source to asc.jar may be down
loaded and rebuilt from http://opensource.adobe.com/wiki/dis...exsdk/flex+sdk.
Using Breakpoints in Venkman - Archive of obsolete content
when a script is
loaded that matches the url of a future breakpoint, and has executable code at the specified line, venkman will automatically set a future breakpoint.
...to debug an extension, uncheck "exclude browser files" on the debug menu and your installed extension files should appear in the
loaded scripts list.) venkman also indicates that one or more breakpoints have been set in the
loaded scripts view, where red dots appear next to the files in which breakpoints have been set, along with the line number where the function begins whose code is being stopped.
... to enable meta comments in a script, select "scan for meta comments" from the context menu of the file in the
loaded scripts view.
XPJS Components Proposal - Archive of obsolete content
it will load that .js file (if not already
loaded) and call the nsgetfactory function.
...javascript is garbage collected and one can not force an object to be deleted or the compiled code to be un
loaded [except by deleting the jsruntime; i.e.
...in c if a module gets un
loaded when there are still references to objects created by the module then a crash is likely to happen soon after.
Sorting and filtering a custom tree view - Archive of obsolete content
this is example code for sorting and filtering a custom tree view, that is, a tree whose values are
loaded via javascript.
...for the sake of simplicity, strings are not localized and the data
loaded is hard coded.
...l="weapon" flex="1" persist="width ordinal hidden" onclick="sort(this)" class="sortdirectionindicator"/> </treecols> <treechildren id="tree-children"/> </tree> </window> sort.js var table = null; var data = null; var tree; var filtertext = ""; function init() { tree = document.getelementbyid("tree"); loadtable(); } //this function is called every time the tree is sorted, filtered, or re
loaded function loadtable() { //remember scroll position.
Filtering - Archive of obsolete content
even though the same datasource is used, it will only be
loaded once and both templates will be notified when the data has
loaded.
...note that due to a bug with template generation in menulists when the datasource hasn't
loaded yet, you may have to load the example twice to get it work.
...another workaround is to just rebuild the template once the data has been
loaded.
Template Logging - Archive of obsolete content
however, for xml datasources, you can at least check the builder's datasource to see whether the xml data was
loaded and parsed correctly.
... if null, then the datasource could not be
loaded, or hasn't yet been
loaded.
...for example: if (root.builder.datasource instanceof xmldocument) alert("xml datasource
loaded ok"); be careful, as the datasource will only be set once the document has finished loading and has been parsed, so don't check this property too early.
Complete - Archive of obsolete content
to see the code, use a jar tool or zip tool to unpack the xpi file that you down
loaded.
... when the xul file, allcustom.xul is
loaded, the doctype declaration near the top loads a dtd from chrome://allcustom/locale/.
... when the xul file, allcustom.xul is
loaded, the stylesheet declaration near the top loads a stylesheet from chrome://allcustom/skin/.
Document Object Model - Archive of obsolete content
when an xul file is
loaded, the tags are parsed and converted into a hierarchical document structure of nodes, one for each tag and block of text.
... each xul file that is
loaded will have its own document displayed in a window or frame.
...it is important to note, however, that the open() method returns before the window has fully
loaded, so functions will not typically be available yet.
Using Remote XUL - Archive of obsolete content
xul is often used by desktop applications like mozilla but can also be
loaded from a web server and rendered inside the content pane of a compatible browser.
... xul
loaded and rendered in this way is called remote xul and can be used for basic functions like web site navigation as well as to build sophisticated web-based applications.
... [***aw: we should have a screenshot here of a xul document
loaded in a content window***] this tutorial walks you through the process of building xul-based navigation for the mozilla.org web site.
tab - Archive of obsolete content
if the user has turned on the "don't load tabs until selected" preference, the pending attribute is set on tabs until they get
loaded.
...the following values are accepted, or leave out the attribute entirely for default handling: always the image is always checked to see whether it should be re
loaded.
... never the image will be
loaded from the cache if possible.
NPN_GetURL - Archive of obsolete content
not recommended; if target refers to the window or frame containing the instance, the instance is destroyed and the plug-in may be un
loaded.
... if unsuccessful, the plug-in is not
loaded and the function returns an error code.
...if the target parameter refers to the window or frame containing the current plug-in instance, the instance is destroyed and the plug-in may be un
loaded.
NPN_SetValue - Archive of obsolete content
nppvpluginkeeplibraryinmemory specifies that the plugin does not want to be un
loaded from memory after the page which initiated it has gone.
... normally, when the browser navigates away from the page containing the plugin, all plugin instances get an npp_destroy call, and if there are no more instances of the plugin active, the plugin calls its np_shutdown method and the plugin dll gets un
loaded from memory.
...by default, the dll will be un
loaded from memory preceded by an np_shutdown call.
NP_Initialize - Archive of obsolete content
if unsuccessful, the plug-in is not
loaded and the function returns an error code.
... description the browser calls this function only once: when a plug-in is
loaded, before the first instance is created.
...np_initialize tells the plug-in that the browser has
loaded it and provides global initialization.
Audio for Web games - Game development
ading...</p> <button data-playing="false" aria-describedby="clavi-play-label"> <span id="clavi-play-label">play</span> </button> </li> </ul> <p class="sourced">all tracks sourced from <a href="http://jplayer.org/">jplayer.org</a></p> </section> all of these tracks are the same tempo and are designed to be synchronized with each other, so we need to make sure they are
loaded and available to the api before we are able to play them.
... const trackels = document.queryselectorall('li'); we want to make sure each file has
loaded and been decoded into a buffer before we use it, so let's create an async function to allow us to do this: async function getfile(filepath) { const response = await fetch(filepath); const arraybuffer = await response.arraybuffer(); const audiobuffer = await audioctx.decodeaudiodata(arraybuffer); return audiobuffer; } we can then use the await operator when calling this function, which ...
... let's create another async function to set up the sample — we can combine the two async functions in a nice promise pattern to perform further actions when each file is
loaded and buffered: async function loadfile(filepath) { const track = await getfile(filepath); return track; } let's also create a playtrack() function, which we can call once a file has been fetched.
Plug-in Development Overview - Gecko Plugin API Reference
but when the plug-in is
loaded from a well-known directory, a different method must be used.
... in this case to ensure the plug-in file will be
loaded, it should have a name in the form of "np*.dll".
...string/value pairs: mimetype: for mime types fileextents: for file extensions fileopenname: for file open template productname: for plug-in name filedescription: for description language: for language in use in the mime types and file extensions strings, multiple values are separated by the "|" character, for example: video/quicktime|audio/aiff|image/jpeg the version stamp will be
loaded only if it has been created with the language set to "us english" and the character set to "windows multilingual" in your development environment.
Code splitting - MDN Web Docs Glossary: Definitions of Web-related terms
code splitting is the splitting of code into various bundles or components which can then be
loaded on demand or in parallel.
...then features required at page load can be down
loaded immediately with additional scripts being lazy
loaded after the page or application is interactive, thus improving performance.
... code splitting is a feature supported by bundlers like webpack and browserify which can create multiple bundles that can be dynamically
loaded at runtime.
Prefetch - MDN Web Docs Glossary: Definitions of Web-related terms
prefetching is when content is down
loaded in the background, this is based on the assumption that the content will likely be requested, enabling the content to load instantly if and when the user requests it.
... the content is down
loaded and cached for anticipated future use without the user making an explicit request for it.
...if the user decides to click on one of the links, then the page will be rendered instantly as the content has already been down
loaded.
How to build custom form controls - Learn web development
the user is interacting with the content before the javascript has been fully down
loaded, parsed, and executed.
... next, we bind these functions to the appropriate events: // we handle the event binding when the document is
loaded.
...rol function getindex(select) { // we need to access the native control for the given custom control // in our example, that native control is a sibling of the custom control var nativewidget = select.previouselementsibling; return nativewidget.selectedindex; }; with these two functions, we can bind the native controls to the custom ones: // we handle event binding when the document is
loaded.
Sending forms through JavaScript - Learn web development
data sent and response
loaded.' ); } ); // define what happens in case of error xhr.addeventlistener( 'error', function(event) { alert( 'oops!
...data sent and response
loaded.' ); } ); // define what happens in case of error xhr.addeventlistener(' error', function( event ) { alert( 'oops!
...data sent and response
loaded.' ); } ); // define what happens in case of error xhr.addeventlistener( 'error', function( event ) { alert( 'oops!
UI pseudo-classes - Learn web development
now finally, we've used some javascript to toggle the disabling of the billing address fields: // wait for the page to finish loading document.addeventlistener('domcontent
loaded', function () { // attach `change` event listener to checkbox document.getelementbyid('billing-checkbox').addeventlistener('change', togglebilling); }, false); function togglebilling() { // select the billing text fields let billingitems = document.queryselectorall('#billing input[type="text"]'); // select the billing text labels let billinglabels = document.queryselectorall('.billi...
...both of these have the following html structure for the inputs: <p> <input type="radio" name="fruit" value="cherry" id="cherry"> <label for="cherry">cherry</label> <span></span> </p> for the :default example, we've added the checked attribute to the middle radio button input, so it will be selected by default when
loaded.
... we then style this with the following css: input ~ span { position: relative; } input:default ~ span::after { font-size: 0.7rem; position: absolute; content: "default"; color: white; background-color: black; padding: 5px 10px; right: -65px; top: -3px; } this provides a little "default" label on the one the was originally selected when the page
loaded.
Creating hyperlinks - Learn web development
for example, if an index.html page is up
loaded to a directory called projects that sits inside the root of a web server, and the web site's domain is http://www.example.com, the page would be available at http://www.example.com/projects/index.html (or even just http://www.example.com/projects/, as most web servers just look for a landing page such as index.html to load if it isn't specified in the url.) an absolute url will always point to t...
... linking to non-html resources — leave clear signposts when linking to a resource that will be down
loaded (like a pdf or word document), streamed (like video or audio), or has another potentially unexpected effect (opens a popup window, or loads a flash movie), you should add clear wording to reduce any confusion.
...eport.pdf"> download the sales report (pdf, 10mb) </a></p> <p><a href="http://www.example.com/video-stream/" target="_blank"> watch the video (stream opens in separate tab, hd quality) </a></p> <p><a href="http://www.example.com/car-game"> play the car game (requires flash) </a></p> use the download attribute when linking to a download when you are linking to a resource that's to be down
loaded rather than opened in the browser, you can use the download attribute to provide a default save filename.
Graceful asynchronous programming with Promises - Learn web development
we immediately run the blob() method on this response to ensure that the response body is fully down
loaded, and when it is available transform it into a blob object that we can do something with.
...instead, what we want is the
loaded data.
...= document.createelement('img'); let image2 = document.createelement('img'); image1.src = objecturl1; image2.src = objecturl2; document.body.appendchild(image1); document.body.appendchild(image2); // display the text in a paragraph let para = document.createelement('p'); para.textcontent = desctext; document.body.appendchild(para); save and refresh and you should see your ui components all
loaded, albeit in a not particularly attractive way!
Measuring performance - Learn web development
at the time of writing, mdn's performance report summary looks similar to the following: a performance report contains information about things like how long a user has to wait before anything is displayed on the page, how many bytes need to be down
loaded to display a page, and much more.
... network tools most browsers have tools available that you can use to run against
loaded pages and determine how they are performing.
... for example, the firefox network monitor returns detailed information on all the assets down
loaded form the network, along with a time graph that shows how long each one took to download.
Perceived performance - Learn web development
for example, because page render is blocked by loading and parsing css and javascript, minimizing the amount of css and js that needs to be
loaded on initially will have a major impact on improving perceived performance.
... to minimize the assets required for initial load, separate interactive functionality from content so that required content -- the text, styles, and images visible at initial load -- can be
loaded first.
... conclusion by turning as much of the download, render and wait time into active phases and reducing any passive waiting, even if the objective measurements stay the same, the user will feel like the content down
loaded, rendered, and responded more quickly.
A bird's-eye view of the Mozilla framework
when an html, xml, svg or other type of document is
loaded, the nglayout engine (also known as gecko) parses the contents into a dom tree, and handles the layout and rendering of the document pages.
...once
loaded, a module or package has full access to the xpcom objects of all the other modules in the runtime environment.
... xpcom in summary to summarize, the xpcom object model specifies the structure of xpcom components, builds a central registry based on the xpcom components
loaded at startup, generates xpcom component instances on demand using the registry, which specifies the supported interfaces, their corresponding implementation objects, and the nsifactory interface, provides api facilities clients can use to dynamically create xpcom components, and specifies the mechanism clients use to query an xpcom component for one of its interfaces, and to release the interfac...
Chrome registration
note: scripts (including those found in xbl)
loaded from skin packages will not execute.
... contentaccessible chrome resources can no longer be referenced from within <img>, <script>, or other elements contained in, or added to, content that was
loaded from an untrusted source.
...this can allow you to register different components for the same contract id or ensure a component can only be
loaded in the main process.
Obsolete Build Caveats and Tips
to get this code, do the following: # pull the mozilla source to the folder 20src/ - may take a while # as hundreds of megabytes of history is down
loaded to .hg hg clone https://hg.mozilla.org/releases/mozilla-2.0/ 20src cd 20src mozilla-1.9.2 (firefox 3.6) code for the firefox 3.6 (gecko 1.9.2) release lives in releases/mozilla-1.9.2.
... to get this code, do the following: # pull the mozilla source to the folder 192src/ - may take a while # as hundreds of megabytes of history is down
loaded to .hg hg clone https://hg.mozilla.org/releases/mozilla-1.9.2/ 192src cd 192src mozilla-1.9.1 (firefox 3.5) code for the firefox 3.5 (gecko 1.9.1) release lives in releases/mozilla-1.9.1.
... to get this code, do the following: # pull the mozilla source to the folder 191src/ - may take a while # as hundreds of megabytes of history is down
loaded to .hg hg clone https://hg.mozilla.org/releases/mozilla-1.9.1/ 191src cd 191src note: starting with gecko 5.0, you can actually build firefox without a .mozconfig file.
mach
these are the python files that implement mach commands and are
loaded by the mach driver.
...when these modules are
loaded, mach looks for specific signatures to detect mach commands.
... because mach command modules are
loaded at mach start-up, it is important that they be lean and not have a high import cost.
Experimental features in Firefox
nightly 59 no developer edition 59 no beta 59 no release 59 no preference name security.mixed_content.block_object_subrequest insecure page labeling these two preferences add a "not secure" text label in the address bar next to the traditional lock icon when a page is
loaded insecurely (that is, using http rather than https).
...the intent is to prevent mixed-content conditions in which some content is
loaded securely while other content is insecure.
... if the upgrade fails (because the media's host doesn't support https), the media is not
loaded.
Limitations of chrome scripts
the fix is generally some variant of "do that in a frame script
loaded into the content process".
... nsiaboutmodule by default, custom about: pages registered using nsiaboutmodule are
loaded in the chrome process.
...in multiprocess firefox, a jsm
loaded into one process does not share any state with the same jsm
loaded into a different process: so you can't use a jsm to share state between the chrome and content processes.
Limitations of frame scripts
nsiaboutmodule by default, custom about: pages registered using nsiaboutmodule are
loaded in the chrome process.
...by default, about: pages (except for a small whitelist) are
loaded in the chrome process when browsed to from the awesomebar.
... javascript code modules (jsms) in multiprocess firefox, a jsm
loaded into the content process does not share any state with the same jsm
loaded into the chrome process.
Message manager overview
amescriptloader nsimessagelistenermanager nsimessagebroadcaster you can access the global message manager like this: // chrome script let globalmm = cc["@mozilla.org/globalmessagemanager;1"] .getservice(ci.nsimessagelistenermanager); window message manager the window message manager 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.
... 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.
...since javascript modules are singletons they will only be executed once per process even when they are
loaded in multiple frame scripts.
HTMLIFrameElement.download()
parameters url the url of the file to be down
loaded.
...the available options are: filename: the filename to save the down
loaded file as.
... referrer: specifies a referrer for the down
loaded file.
mozbrowserloadend
can be used to make the theme of the surrounding ui complement the theme of the currently
loaded content, for example.
...in addition, the background of the controls ui bar is changed to the background color of the site that has just
loaded, to provide a more integrated experience.
... when the front page of https://developer.mozilla.org is
loaded, for example, the e.detail.backgroundcolor value reported is rgb(0, 83, 159).
mozbrowsersecuritychange
this may mean that the request is being
loaded as part of a page in which some content was received over an insecure channel.
...possible values are:
loaded_tracking_content: indicates that the tracking content has been
loaded.
...possible values are:
loaded_mixed_active_content: indicates that the mixed active content has been
loaded.
Browser API
htmliframeelement.getstructureddata() retrieves any structured microdata (and hcard and hcalendar microformat data) contained in the html
loaded in the browser <iframe> and returns it as json.
... htmliframeelement.executescript() allows a specified script to be executed against a page
loaded in the browser <iframe>.
... htmliframeelement.getmanifest() retrieves the manifest of an app
loaded in the browser <iframe> and returns it as json.
How Mozilla determines MIME Types
this means that every time an uri is
loaded, mozilla must find out its mime type.
... also, for images
loaded via <img src>, mozilla's image library will do content sniffing (never extension sniffing) to find out the real type of the image.
... if that also failed, the list of
loaded plugins is checked for a plugin that can handle this extension, and is asked for the mime type if no plugin is registered, the ext-to-type-mapping xpcom category is searched for the extension.
NSS tools : modutil
installing a cryptographic module from a jar file pkcs #11 modules can also be
loaded using a jar file, which contains all of the required libraries and an installation script that describes how to install the module.
...nss internal pkcs #11 module slots: 2 slots attached status:
loaded slot: nss internal cryptographic services token: nss generic crypto services slot: nss user private key and certificate services token: nss certificate db ----------------------------------------------------------- passing a specific module name with the -list returns details information about the module itself, like supported cipher mechanisms, version numbers, serial numbers, and other ...
...information about the module and the token it is
loaded on.
NSS tools : modutil
installing a cryptographic module from a jar file pkcs #11 modules can also be
loaded using a jar file, which contains all of the required libraries and an installation script that describes how to install the module.
...nss internal pkcs #11 module slots: 2 slots attached status:
loaded slot: nss internal cryptographic services token: nss generic crypto services slot: nss user private key and certificate services token: nss certificate db ----------------------------------------------------------- passing a specific module name with the -list returns details information about the module itself, like supported cipher mechanisms, ver...
...sion numbers, serial numbers, and other information about the module and the token it is
loaded on.
Receiving startup notifications
the startup process during application startup, the application's manifest is used to get a list of the components it needs to register, and those components are
loaded.
... this gets enough of xpcom and the application
loaded and running that the extension manager can then be
loaded and handle installing, uninstalling, and updating any installed extensions.
... once that process is completed, extensions can then be
loaded by simply reading their manifests, loading their components, and continuing with application startup, all without having to restart the browser.
imgIDecoderObserver
load notifications are fired as the image is
loaded from the network or filesystem.
...if imgidecoder::flag_sync_decode is passed to a function that triggers a decode, all notifications that can be generated from the currently
loaded data fire before the call returns.
... onstartcontainer() this load notification is called once enough data has been
loaded from the network that we were able to parse the width and height from the image.
nsIDOMChromeWindow
inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview void beginwindowmove(in nsidomevent mousedownevent); void getattention(); void getattentionwithcyclecount(in long acyclecount); void maximize(); void minimize(); void notifydefaultbutton
loaded(in nsidomelement defaultbutton); void restore(); void setcursor(in domstring cursor); attributes attribute type description browserdomwindow nsibrowserdomwindow the related nsibrowserdomwindow instance which provides access to yet another layer of utility functions by chrome script.
...notifydefaultbutton
loaded() when a document has been
loaded, the document can notify the default button of the document to the window by using this method.
...void notifydefaultbutton
loaded( in nsidomelement defaultbutton ); parameters defaultbutton the default button element of the window.
nsIDOMOfflineResourceList
ondownloading nsidomeventlistener an event listener to be called when resources are being down
loaded into the cache.
... downloading 3 resources are being down
loaded to be added to the cache.
...this means already
loaded resources should only update after a page refresh.
nsIDownload
download objects are used by the download manager (see nsidownloadmanager to manage files that are queued to download, being down
loaded, and finished being down
loaded.) inherits from: nsitransfer last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) note: once the download is completed, the download manager stops updating the nsidownload object.
... attributes attribute type description amounttransferred long long the number of bytes down
loaded so far.
... targetfile nsilocalfile indicates the location at which the down
loaded file will be (or is, if the download is complete) stored.
nsINavHistoryService
transition_embed 4 this transition type is set when some inner content is
loaded.
... transition_framed_link 8 this transition type is set when the user followed a link that
loaded a page in a frame.
...if this uri is
loaded soon after this message has been received, that transition will be marked as following a bookmark.
nsIProtocolHandler
uri_inherits_security_context 1<<4 uris for this protocol have no inherent security context, so documents
loaded using this protocol should inherit the security context of the document that loads them.
... uri_dangerous_to_load 1<<7 uris using this protocol are unsafe if
loaded by untrusted web content and may only be
loaded by privileged code (for example, code that has the system principal).
... uri_loadable_by_subsumers 1<<14 the uris for this protocol can be
loaded only by callers with a principal that subsumes this uri.
nsIWebBrowserPersist
persist_flags_append_to_file 32768 append the down
loaded data to the target file.
...some implementations of this interface may also support nsnull to imply the currently
loaded document.
...some implementations of this interface may also support nsnull to imply the currently
loaded uri.
Events
msgcreatedbview onactivecreatedview onactivemessages
loaded the active messages in the folder have been
loaded oncreatedview a folder view has been created, but not yet shown.
... ondisplayingfolder a folder gets displayed onfolderloading a folder is being
loaded onleavingfolder a folder is being un
loaded, includes deletion onloadingfolder a folder is being
loaded onmakeactive a folderdisplaywidget becomes active onmessagecountschanged the counts of the messages changed onmessages
loaded the messages in the folder have been
loaded onmessagesremovalfailed removing some messages from the current folder failed onmessagesremoved some messages of the current message l...
...ist have been removed onsearching a folder view derived from a search is being
loaded, e.g.
Mail event system
ed notifyitempropertychanged onitempropertychanged notifyitemintpropertychanged onitemintpropertychanged notifyitemboolpropertychanged onitemboolpropertychanged notifyitemunicharpropertychanged onitemunicharpropertychanged notifyitempropertyflagchanged onitempropertyflagchanged notifyitemevent onitemevent notifyfolder
loaded onfolder
loaded notifydeleteormovemessages ondeleteormovemessages sample code in this example, a listener will be set up to be notified when the message count changes in a folder: // our variable to know if the listener fired var listenerhasfired = false; var totalmessageslistenerhasfired = false; // the listening function that will react to changes function myonintproper...
...itempropertychanged: function(parent, item, viewstring) {}, onitemintpropertychanged: myonintpropertychanged, onitemboolpropertychanged: function(item, property, oldvalue, newvalue) {}, onitemunicharpropertychanged: function(item, property, oldvalue, newvalue) {}, onitempropertyflagchanged: function(item, property, oldflag, newflag) {}, onitemevent: function(item, event) = {}, onfolder
loaded: function(afolder) = {} ondeleteormovemessagescompleted: function( afolder) = {}, } // now register myself as a listener on every mail folder var mailsession = components.classes["component://netscape/messenger/services/session"].
... future plans the notification system has two duplicate methods which could be implemented with onitemevent/notifyitemevent: folder
loaded , and deleteormovemessagescompleted .
Using the Mozilla symbol server
to use only the mozilla symbol server, add the following entry to your symbol path (note: you can replace c:\symcache\ with any writable directory on your computer, if you'd prefer a different location for down
loaded symbols): srv*c:\symcache\*https://symbols.mozilla.org/ set this string as _nt_symbol_path in the environment, using the windbg menus, or by typing the .sympath command.
... if you would like to get symbols from microsoft's symbol server as well, you should list that first (note: you can replace c:\symcache\ with any writable directory on your computer, if you'd prefer a different location for down
loaded symbols): srv*c:\symcache\*https://msdl.microsoft.com/download/symbols;srv*c:\symcache\*https://symbols.mozilla.org/ downloading symbols using symchk.exe you can also download the symbols using symchk.exe, part of microsoft's debugging tools for windows.
... the command should look like this (again, you can replace c:\symcache\ with any writable directory on your computer, if you'd prefer a different location for down
loaded symbols): c:\program files\mozilla firefox>c:\progra~1\debugg~1\symchk.exe /r c:\progra~1\mozill~1\* /s srv*c:\symcache\*https://symbols.mozilla.org/ note the \* after the mozilla directory.
Working with windows in chrome code
note however, that the open() call returns before the window is fully
loaded, so some calls, like win.document.getelementbyid() will fail.
... accessing content documents assume you have a document
loaded in a <tabbrowser>, <browser>, or <iframe> element inside your document.
... 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>.
Using js-ctypes
might load the system user32 library like this: var lib = ctypes.open("user32.dll"); on mac os x, you can load the core foundation library from the core foundation framework like this: var corefoundation = ctypes.open("/system/library/frameworks/corefoundation.framework/corefoundation"); the returned object is a library object that you use to declare functions and data types for use with the
loaded library.
...e("messageboxw", ctypes.winapi_abi, ctypes.int32_t, ctypes.int32_t, ctypes.jschar.ptr, ctypes.jschar.ptr, ctypes.int32_t); var mb_ok = 0; var ret = msgbox(0, "hello world", "title", mb_ok); lib.close(); in line 3, the user32.dll system library is
loaded.
... in line 9, the carbon library is
loaded from the system's carbon framework.
Plug-in Development Overview - Plugins
but when the plug-in is
loaded from a well-known directory, a different method must be used.
... in this case to ensure the plug-in file will be
loaded, it should have a name in the form of "np*.dll".
...string/value pairs: mimetype: for mime types fileextents: for file extensions fileopenname: for file open template productname: for plug-in name filedescription: for description language: for language in use in the mime types and file extensions strings, multiple values are separated by the "|" character, for example: video/quicktime|audio/aiff|image/jpeg the version stamp will be
loaded only if it has been created with the language set to "us english" and the character set to "windows multilingual" in your development environment.
URLs - Plugins
if target refers to the window or frame containing the plug-in instance, it is destroyed and the plug-in may be un
loaded.
...if this target refers to the window or frame containing the instance, the instance is destroyed and the plug-in may be un
loaded.
...if the target refers to the window or frame containing the instance or one of its parents/ancestors, the instance is destroyed and the plug-in may be un
loaded.
Plugins
roadmap highlights since firefox 52, plugins other than flash are not
loaded by firefox.
... also from firefox 55 onwards, flash and other plugins can no longer be
loaded from any url scheme except for http:// and https:// (bug 1335475).
... see also flash can now be
loaded only from http/https for more useful information.
DOM Inspector FAQ - Firefox Developer Tools
inspect content document inspect content, e.g., unprivileged web pages
loaded in a browser tab.
...this causes the document to be
loaded in the browser pane.
... these can include chrome documents, but it's not suggested that you inspect xul documents by directly inspecting them via url, since some behavior may rely on the document being contained in another xul document, or the converse, where it won't behave correctly because it doesn't expect to be
loaded as a framed document.
UI Tour - Firefox Developer Tools
three panels source list pane source pane the contents of the third pane depend on the current state of the debugger and may include the following sections: toolbar watch expressions breakpoints call stack scopes xhr breakpoints event listener breakpoints dom mutation breakpoints source list pane the source list pane lists all the javascript source files
loaded into the page, and enables you to select one to debug.
... source pane this shows the javascript file currently
loaded.
... source maps: enabled by default, this option directs the debugger to load the original versions of files, and map them to the generated ones
loaded in a page, to ease debugging of translformed sources.
about:debugging (before Firefox 68) - Firefox Developer Tools
before firefox 48 if you change files that are
loaded on demand, like content scripts or popups, then changes you make are picked up automatically, and you'll see them the next time the content script is
loaded or the popup is shown.
... if you change files that stay
loaded the whole time, like background scripts, then you can pick up changes you've made by disabling and then re-enabling the add-on in the about:addons page.
... firefox 48 onwards from firefox 48 onwards: as before: if you change files that are
loaded on demand, like content scripts or popups, then changes you make are picked up automatically, and you'll see them the next time the content script is
loaded or the popup is shown.
Using images - Web APIs
so you need to be sure to use the load event so you don't try this before the image has
loaded: var img = new image(); // create new img element img.addeventlistener('load', function() { // execute drawimage statements here }, false); img.src = 'myimage.png'; // set source path if you're only using one external image this can be a good approach, but once you need to track more than one we need to resort to something more clever.
...as we will see later the drawimage() method is over
loaded and has several variants.
...when the page is
loaded, a <canvas> element is inserted for each image and a frame is drawn around it.
Document.write() - Web APIs
note: because document.write() writes to the document stream, calling document.write() on a closed (
loaded) document automatically calls document.open(), which will clear the document.
... writing to a document that has already
loaded without calling document.open() will automatically call document.open().
... 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.
EventTarget.addEventListener() - Web APIs
the code supports the use of handleevent() and also the domcontent
loaded event.
...ners=[]; var addeventlistener=function(type,listener /*, usecapture (will be ignored) */) { var self=this; var wrapper=function(e) { e.target=e.srcelement; e.currenttarget=self; if (typeof listener.handleevent != 'undefined') { listener.handleevent(e); } else { listener.call(self,e); } }; if (type=="domcontent
loaded") { var wrapper2=function(e) { if (document.readystate=="complete") { wrapper(e); } }; document.attachevent("onreadystatechange",wrapper2); eventlisteners.push({object:this,type:type,listener:listener,wrapper:wrapper2}); if (document.readystate=="complete") { var e=new event(); e.srcelement=window; ...
...pe,listener:listener,wrapper:wrapper}); } }; var removeeventlistener=function(type,listener /*, usecapture (will be ignored) */) { var counter=0; while (counter<eventlisteners.length) { var eventlistener=eventlisteners[counter]; if (eventlistener.object==this && eventlistener.type==type && eventlistener.listener==listener) { if (type=="domcontent
loaded") { this.detachevent("onreadystatechange",eventlistener.wrapper); } else { this.detachevent("on"+type,eventlistener.wrapper); } eventlisteners.splice(counter, 1); break; } ++counter; } }; element.prototype.addeventlistener=addeventlistener; element.prototype.removeeventlistener=removeeventlistener; ...
FontFaceSet.load() - Web APIs
the load() method of the fontfaceset forces all the fonts given in parameters to be
loaded.
... syntax result = afontfaceset.load(font); result = afontfaceset.load(font, text); returns a promise of an array of fontface
loaded.
... the promise is fulfilled when all the fonts are
loaded; it is rejected if one of the fonts failed to load.
HTMLImageElement - Web APIs
htmlimageelement.alt a domstring that reflects the alt html attribute, thus indicating the alternate fallback content to be displayed if the image has not been
loaded.
... htmlimageelement.currentsrc read only returns a usvstring representing the url from which the currently displayed image was
loaded.
... the specified image is corrupted in some way that prevents it from being
loaded.
HTMLMediaElement.readyState - Web APIs
examples this example will listen for audio data to be
loaded for the element `example`.
... it will then check if at least the current playback position has been
loaded.
... <audio id="example" preload="auto"> <source src="sound.ogg" type="audio/ogg" /> </audio> var obj = document.getelementbyid('example'); obj.addeventlistener('
loadeddata', function() { if(obj.readystate >= 2) { obj.play(); } }); specifications specification status comment html living standardthe definition of 'htmlmediaelement.readystate' in that specification.
History - Web APIs
the history interface allows manipulation of the browser session history, that is the pages visited in the tab or frame that the current page is
loaded in.
... length read only returns an integer representing the number of elements in the session history, including the currently
loaded page.
... for example, for a page
loaded in a new tab this property returns 1.
LargestContentfulPaint - Web APIs
may not be available if the element is a cross-origin image
loaded without the timing-allow-origin header.
... largestcontentfulpaint.loadtime the time the element was
loaded.
...(note: `rendertime` may not be available on // image elements
loaded cross-origin without the `timing-allow-origin` header.) lcp = lastentry.rendertime || lastentry.loadtime; }); po.observe({type: 'largest-contentful-paint', buffered: true}); // send data to the server.
Storage Access API - Web APIs
these restrictions range from giving embedded resources under each top-level origin a unique storage space to outright blocking of storage access when resources are
loaded in a third-party context.
... the semantics around third-party cookie blocking policies in particular differ from browser to browser, but the core functionality is similar: cross-origin resources embedded in a third-party context are not given access to the same cookies and site storage that they would have access to when
loaded in a first-party context.
...as a consequence, users who wish to continue to interact with embedded content are forced to greatly relax their blocking policy for resources
loaded from all embedded origins and possibly across all websites.
VideoPlaybackQuality.totalVideoFrames - Web APIs
the videoplaybackquality interface's totalvideoframes read-only property returns the total number of video frames that have been displayed or dropped since the media was
loaded.
... syntax value = videoplaybackquality.totalvideoframes; value the total number of frames that the <video> element has displayed or dropped since the media was
loaded into it.
... this value is reset when the media is re
loaded or replaced.
Window: popstate event - Web APIs
it happens after the new location has
loaded (if needed), displayed, made visible, and so on, after the pageshow event is sent, but before the persisted user state information is restored and the hashchange event is sent.
...this will eventually send events such as domcontent
loaded and load to the window containing the document, but the steps below will continue to execute in the meantime.
... if new-entry's document is already fully
loaded and ready—that is, its readystate is complete—and the document is not already visible, it's made visible and the pageshow event is fired at the document with the pagetransitionevent's persisted attribute set to true.
Using XMLHttpRequest - Web APIs
// progress on transfers from the server to the client (downloads) function updateprogress (oevent) { if (oevent.lengthcomputable) { var percentcomplete = oevent.
loaded / oevent.total * 100; // ...
... the progress event handler, specified by the updateprogress() function in this example, receives the total number of bytes to transfer as well as the number of bytes transferred so far in the event's total and
loaded fields.
...note also that, although in this example there are some file <input> fields, when you submit a form through the formdata api you do not need to use the filereader api also: files are automatically
loaded and up
loaded.
@font-face - CSS: Cascading Style Sheets
the @font-face css at-rule specifies a custom font with which to display text; the font can be
loaded from either a remote server or a locally-installed font on the user's own computer.
... syntax @font-face { font-family: "open sans"; src: url("/fonts/opensans-regular-webfont.woff2") format("woff2"), url("/fonts/opensans-regular-webfont.woff") format("woff"); } descriptors font-display determines how a font face is displayed based on whether and when it is down
loaded and ready to use.
...otherwise, the font resource specified using the url() function is down
loaded and used.
Variable fonts guide - CSS: Cascading Style Sheets
this results in more http requests, and more data being down
loaded (usually around 20k or more per file).
...the advantage in choosing the variable font is that you have access to the entire range of weights, widths, and styles available, rather than being constrained to only the few that you previously would have
loaded separately.
... the basic syntax is the same, but the font technology can be specified, and allowable ranges for descriptors like font-weight and font-stretch can be supplied, rather than named according to the font file being
loaded.
Audio and Video Delivery - Developer guides
"3gp_src" src="video.3gp" type='video/3gpp; codecs="mp4v.20.8, samr"'> </source> <source id="ogg_src" src="video.ogv" type='video/ogv; codecs="theora, vorbis"'> </source> </video> since firefox doesn't support mp4 and 3gp on some platforms due to their patent-encumbered nature, the <source> elements with the ids "mp4_src" and "3gp_src" will receive error events before the ogg resource is
loaded.
...audio editor and recorder miro — free, open-source music and video player handbrake — open source video transcoder firefogg — video and audio encoding for firefox ffmpeg2 — comprehensive command line encoder libav — comprehensive command line encoder vid.ly — video player,transcoding and delivery internet archive — free transcoding and storage detecting when no sources have
loaded to detect that all child <source> elements have failed to load, check the value of the media element's networkstate attribute.
... media buffering, seeking, and time ranges sometimes it's useful to know how much <audio> or <video> has down
loaded or is playable without delay — a good example of this is the buffered progress bar of an audio or video player.
<img>: The Image Embed element - HTML: Hypertext Markup Language
alt text is also displayed on the page if the image can't be
loaded for some reason: for example, network errors, content blocking, or linkrot.
... the image is corrupted in some way that prevents it from being
loaded.
... <a href="https://developer.mozilla.org"> <img src="https://udn.realityripple.com/samples/6c/98485e5d8a.png" alt="visit the mdn site"> </a> using the srcset attribute in this example we include a srcset attribute with a reference to a high-resolution version of the logo; this will be
loaded instead of the src image on high-resolution devices.
HTTP caching - HTTP
a browser cache holds all documents down
loaded via http by the user.
...a request is sent to the server and a full response is down
loaded each and every time.
...there is an option to force a validation each time a document is
loaded.
Web audio codec guide - Web media technologies
this is necessary because the rate at which the music is down
loaded needs to be no greater than the amount of bandwidth available on the network, and ideally there should be room left for network speed fluctuations and use of the network by other applications.
... example: music for download music being down
loaded by the user can be compressed to a larger overall file size than streamed music, since (unlike when streaming) it doesn't matter if the download speed is slower than the playback speed of the media.
...if you need to choose just one format, select one that makes sense given your requirements and the type of audio content being down
loaded.
Populating the page: how browsers work - Web Performance
it will retrieve resources in the background so that by the time the main html parser reaches requested assets, they may possibly already be in flight, or have been down
loaded.
... in our example, maybe the image
loaded quickly, but perhaps the anotherscript.js file was 2mb and our user's network connection was slow.
... in this case the user would see the page super quickly, but wouldn't be able to scroll without jank until the script was down
loaded, parsed and executed.
Lazy loading - Web Performance
a practical example would be when, you land on the home page of an e-commerce site which has a link to a cart page/section and all its resources (js, css, images...) are down
loaded only when the user navigates to that cart page.
...the rest can be
loaded on demand.
... <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.
Privacy, permissions, and information security
security security is about the active protection of data or a system against being accessed, down
loaded, or operated by people or organizations that don't have permission to do so.
...tificates 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 m...
... <--- allow attribute, feature policy, and permissions api stuff ---> a specific user experience issue that often arises is a document that's
loaded with permission to access a resource and the document contains an <iframe> with the allow attribute to delegate that permission to the contents of the frame.
mimeTypes.rdf corruption - SVG: Scalable Vector Graphics
for files
loaded over the network via http, it requires and uses the value assigned to the content-type http header.
... for files
loaded locally, it first looks in a cache of filename extension to media type mappings (stored in a mozilla profile file called mimetypes.rdf), and if it doesn't find a media type there, it asks the operating system.
...problems in the way mozilla obtains the media type for files
loaded locally can occur in two ways.
Index - XSLT: Extensible Stylesheet Language Transformations
the javascript loads the .xsl file only on the first sort and sets the xsl
loaded variable to true once it has finished loading the file.
...since the xml data
loaded only contains the raw information without any presentation data, it can load quickly even on dialup.
...the stylesheet has to be passed in as an xml document, which means that the .xsl file has to be
loaded by the page before calling xsltprocessor.importstylesheet().
Working with Events - Archive of obsolete content
for example, the following add-on registers a listener with the tabs module to listen for the ready event, and logs a string to the console reporting the event: var tabs = require("sdk/tabs"); tabs.on("ready", function () { console.log("tab
loaded"); }); it is not possible to enumerate the set of listeners for a given event.
...ner("ready", listener1); } function listener2() { console.log("listener 2"); } tabs.on("ready", listener1); tabs.on("ready", listener2); tabs.open("https://www.mozilla.org"); tabs.open("https://www.mozilla.org"); we should see output like this: info: tabevents: listener 1 info: tabevents: listener 2 info: tabevents: listener 2 listeners will be removed automatically when the add-on is un
loaded.
private-browsing - Archive of obsolete content
for example, here's an add-on that stores the titles of tabs the user loads, and uses isprivate() to exclude the titles of tabs that were
loaded into private windows: var simplestorage = require("simple-storage"); if (!simplestorage.storage.titles) simplestorage.storage.titles = []; require("tabs").on("ready", function(tab) { if (!require("sdk/private-browsing").isprivate(tab)) { console.log("storing..."); simplestorage.storage.titles.push(tab.title); } else { console.log("not storing, private data"); } }); here'...
...s an add-on that uses a page-mod to log the content of pages
loaded by the user, unless the page is private.
frame/utils - Archive of obsolete content
parameters document : nsidomdocument options : object optional options: name type type string string that defines access type of the document
loaded into it.
...for more details and other possible values see documentation on mdn uri string uri of the document to be
loaded into the new frame.
ui/toolbar - Archive of obsolete content
toolbar events toolbars get attach and detach events when their content is
loaded and un
loaded, and show and hide events when the uses shows or hides them.
... events attach this event is emitted when the toolbar is first
loaded.
Low-Level APIs - Archive of obsolete content
remote/child enables an sdk module
loaded into a child process to access web content in the child process and communicate with modules in the main process.
... system/unload register callbacks that are called when a module is un
loaded.
Displaying annotations - Archive of obsolete content
when a page is
loaded the matcher searches the dom for elements that match annotations.
...sage(simplestorage.storage.annotations); } worker.port.on('show', function(data) { annotation.content = data; annotation.show(); }); worker.port.on('hide', function() { annotation.content = null; annotation.hide(); }); worker.on('detach', function () { detachworker(this, matchers); }); matchers.push(worker); } }); when a new page is
loaded the function assigned to onattach is called.
Getting Started (jpm) - Archive of obsolete content
click the icon, and a new tab will open with http://www.mozilla.org/
loaded into it.
...for example, we could change the page that gets
loaded: var buttons = require('sdk/ui/button/action'); var tabs = require("sdk/tabs"); var button = buttons.actionbutton({ id: "mozilla-link", label: "visit mozilla", icon: { "16": "./icon-16.png", "32": "./icon-32.png", "64": "./icon-64.png" }, onclick: handleclick }); function handleclick(state) { tabs.open("https://developer.mozilla.org/"); } at the command prompt, execute...
Getting started (cfx) - Archive of obsolete content
click the icon, and a new tab will open with https://www.mozilla.org/
loaded into it.
...for example, we could change the page that gets
loaded: var buttons = require('sdk/ui/button/action'); var tabs = require("sdk/tabs"); var button = buttons.actionbutton({ id: "mozilla-link", label: "visit mozilla", icon: { "16": "./icon-16.png", "32": "./icon-32.png", "64": "./icon-64.png" }, onclick: handleclick }); function handleclick(state) { tabs.open("https://developer.mozilla.org/"); } at the command prompt, execute...
Canvas code snippets - Archive of obsolete content
once the remote page has
loaded, the remotepage
loaded method fires.
...add a listener to the // frame's onload event iframe.addeventlistener('load', this.remotepage
loaded, true); //append to the end of the page window.document.body.appendchild(iframe); return; }; remotecanvas.prototype.remotepage
loaded = function() { // look back up the iframe by id var ldrframe = document.getelementbyid('test-iframe'); // get a reference to the window object you need for the canvas // drawwindow method var remotewindow = ldrframe.contentwindow; ...
Miscellaneous - Archive of obsolete content
see also http://mxr.mozilla.org/seamonkey/source/browser/base/content/browser.js#4674 discovering which element in the
loaded document has focus // focusedcontrol stores the focused field, or null if there is none.
...am.readbytearray(stream.available()); var poststr = string.fromcharcode.apply(null, postbytes); //do anything to your poststr alert(poststr); getting a string from the input stream is made somewhat simpler in firefox 4, by the addition of netutil.readinputstreamtostring() getting postdata of a request before the request is sent the above code will get the postdata for a page that has already
loaded.
Displaying web content in an extension without security issues - Archive of obsolete content
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).
...t with an empty document, you would rather want to load some template into the frame: var request = new xmlhttprequest(); request.open("get", "chrome://foo/content/template.html", false); request.send(null); frame.setattribute("src", "data:text/html," + encodeuricomponent(request.responsetext)); that way you can have the template in your extension but still strip it off all privileges when it is
loaded in a frame.
Enhanced Extension Installation - Archive of obsolete content
user action requested notifications are now sent with the em-action-requested topic through the observer service: item-installed an item has just been down
loaded and configured for installation for the first time.
... item-upgraded a new version of an installed item has been down
loaded and configured for installation.
Extension Packaging - Archive of obsolete content
extensions are packaged in a form of installable bundle which can be down
loaded and installed by a user, or provided pre-packaged with an application or by an external program.
...instead, the xpi itself is placed in the extensions directory, and files are
loaded directly out of the package.
Extension Etiquette - Archive of obsolete content
global variables, such as top-level declarations on scripts
loaded into shared windows or web pages.
...scripts can be
loaded into their own globals, such as commonjs modules, javascript modules, or sandboxes, to avoid most global variable and prototype conflicts.
Install Manifests - Archive of obsolete content
examples <em:translator>janez novak</em:translator> <em:translator>kari nordmann</em:translator> unpack a true or false value that tells the application whether the extension requires its files be unpacked into a directory in order to work or whether the extension can be
loaded direct from the xpi.
...if an extension includes the following then it must request unpacking: binary xpcom components plugins search plugins dlls
loaded with ctypes dictionaries window icons examples <description about="urn:mozilla:install-manifest"> <em:id>extension@mysite.com</em:id> <em:unpack>true</em:unpack> ...
Installing Extensions and Themes From Web Pages - Archive of obsolete content
this is used to verify the down
loaded file, to protect against a corrupted file being served by a mirror download server, for example.
...furthermore, calling updateenabled may lead to problems if your distribution site is not in the user's whitelist, because firefox only displays the "installation blocked" message when install or installchrome are called, or when a xpi file is
loaded.
Adding Events and Commands - Archive of obsolete content
the most commonly used event is the onload event, which is used in overlays and other windows to detect when the window has
loaded and then run initialization code: // rest of overlay code goes here.
...it isn't hard for xul code to control the content on pages being
loaded or displayed, as we will see later on, but it can be hard for your extension xul code to receive information from pages in a secure manner.
Appendix F: Monitoring DOM changes - Archive of obsolete content
often times, this must be used in combination with a slight delay, or even polling, via settimeout, for cases where the url change happens before the page is fully
loaded.
...while it is no longer possible for web sites to use xbl directly, chrome code can still attach xbl bindings to web content from stylesheets
loaded via the stylesheet service.
Session store API - Archive of obsolete content
if you want to set permissions or otherwise manipulate a restored tab before the page is
loaded into it, you should watch sstabrestoring.
... if you want to do something after the page is
loaded, you should watch sstabrestored.
Signing an XPI - Archive of obsolete content
the csr will be up
loaded to the issuer.
...i down
loaded the certum root ca and certum level iii ca digital id for web and ssl/tls servers, copied the text and saved them to the files c:\projects\codesigning\certum root ca.cer and c:\projects\codesigning\certum level iii ca.cer.
Promises - Archive of obsolete content
the constructor returns a promise which resolves when the file’s contents have been
loaded.
... the contents of the file will be initially
loaded into the json store’s data property.
Add-ons - Archive of obsolete content
extension packaging extensions are packaged in a form of installable bundle which can be down
loaded and installed by a user, or provided pre-packaged with an application or by an external program.
...some of that will have to be replaced and the rest will need to be
loaded differently.
Adding preferences to an extension - Archive of obsolete content
startup() the stockwatcher.startup() function is called when our extension is first
loaded.
... installing the event listeners the only thing left to do is to install the event listeners needed to run the startup() and shutdown() routines automatically when the browser window is
loaded and un
loaded.
Localizing an extension - Archive of obsolete content
we do this by creating a string bundle, using the following code: <stringbundleset id="stringbundleset"> <stringbundle id="string-bundle" src="chrome://stockwatcher2/locale/stockwatcher2.properties"/> </stringbundleset> this establishes a new string bundle, referenced by the id "string-bundle", whose keys and values are to be
loaded from the stockwatcher2.properties file we've already created.
...this involves rewriting the refreshinformation() function to load the strings, and its enclosed inforeceived() function to use the
loaded, localized, strings instead of string literals.
Same-origin policy for file: URIs - Archive of obsolete content
directories cannot be
loaded this way, however.
...for cross-window dom access, each file is treated as a separate origin, with one exception: if a file is
loaded from another file that would otherwise be able to load it following this same-origin policy, they are considered to have the same origin.
Simple Storage - Archive of obsolete content
the object can also be forced to reload its data from disk by calling jetpack.storage.simple.open(), although the data comes
loaded automatically.
...open()as described above, the jetpack.storage.simple object is automatically populated when a feature is
loaded, but a feature may force the object to read from disk by calling jetpack.storage.simple.open().
Tabs - Archive of obsolete content
cusedstringtostringstringpopstringpushstringreversestringshiftstringsortstringsplicestringunshiftstring)this is some default text lengththe number of open tabsstring focusedthe current tab in your browserstring tostringstuffstring popstuffstring pushstuffstring reversestuffstring shiftstuffstring sortstuffstring splicestuffstring unshiftstuffstring onready()when the inherited document is fully
loaded.
...cusedstringtostringstringpopstringpushstringreversestringshiftstringsortstringsplicestringunshiftstring)this is some default text lengththe number of open tabsstring focusedthe current tab in your browserstring tostringstuffstring popstuffstring pushstuffstring reversestuffstring shiftstuffstring sortstuffstring splicestuffstring unshiftstuffstring onready()when the inherited document is fully
loaded.
Simple Storage - Archive of obsolete content
the object can also be forced to reload its data from disk by calling jetpack.storage.simple.open(), although the data comes
loaded automatically.
...open()as described above, the jetpack.storage.simple object is automatically populated when a feature is
loaded, but a feature may force the object to read from disk by calling jetpack.storage.simple.open().
Migrate apps from Internet Explorer to Mozilla - Archive of obsolete content
synchronous request: var myxmlhttprequest = new xmlhttprequest(); myxmlhttprequest.open("get", "data.xml", false); myxmlhttprequest.send(null); var myxmldocument = myxmlhttprequest.responsexml; asynchronous request: var myxmlhttprequest; function xml
loaded() { var myxmldocument = myxmlhttprequest.responsexml; } function loadxml(){ myxmlhttprequest = new xmlhttprequest(); myxmlhttprequest.open("get", "data.xml", true); myxmlhttprequest.onload = xml
loaded; myxmlhttprequest.send(null); } table 7 features a list of available methods and properties for mozilla's xmlhttprequest.
... 2
loaded - send() has been called, headers and status are available.
Scripting - Archive of obsolete content
this file will be
loaded into the prism chrome window very much like a firefox extension is
loaded into the browser chrome window.
...since the web application has not yet
loaded, the window object is still undefined.
Same origin policy for XBL - Archive of obsolete content
when mozilla needs to decide whether or not xbl is allowed to be
loaded, it looks at the nsiprincipal originating the load and the nsiuri to be
loaded.
... determining the originating principal the principal originating the load is determined using the following steps: for external stylesheets (<link>, <?xml-stylesheet?>, user sheets, and ua sheets), it depends on where the sheet is
loaded from, just like it would for an html document
loaded from a similar source.
validate - Archive of obsolete content
the following values are accepted, or leave out the attribute entirely for default handling: always the image is always checked to see whether it should be re
loaded.
... never the image will be
loaded from the cache if possible.
Introduction to XUL - Archive of obsolete content
preamble mozilla has configurable, downloadable chrome, meaning that the arrangement and even presence or absence of controls in the main window is not hardwired into the application, but
loaded from a separate ui description.
...widgets will generally live grouped in separate, dynamically
loaded libraries.
loadURIWithFlags - Archive of obsolete content
in addition to the flags allowed for the reloadwithflags method, the following flags are also valid: load_flags_is_refresh: this flag is used when the url is
loaded because of a meta tag refresh or redirect.
... load_flags_is_link: this flag is used when the url is
loaded because a user clicked on a link.
RDF Modifications - Archive of obsolete content
the second situation when notifications are made is when a datasource is being
loaded or re
loaded.
...if the re
loaded datasource hasn't changed, the builder won't receive any notifications.
Features of a Window - Archive of obsolete content
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.
...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.
image - Archive of obsolete content
the following values are accepted, or leave out the attribute entirely for default handling: always the image is always checked to see whether it should be re
loaded.
... never the image will be
loaded from the cache if possible.
menuitem - Archive of obsolete content
the following values are accepted, or leave out the attribute entirely for default handling: always the image is always checked to see whether it should be re
loaded.
... never the image will be
loaded from the cache if possible.
toolbarbutton - Archive of obsolete content
the following values are accepted, or leave out the attribute entirely for default handling: always the image is always checked to see whether it should be re
loaded.
... never the image will be
loaded from the cache if possible.
Using LDAP XPCOM with XULRunner - Archive of obsolete content
actually, the ldap interfaces are available (for exemple, components.interfaces.nsildapconnection is not null), but the components can't be
loaded (for example, components.classes["@mozilla.org/network/ldap-connection;1"] is null).
...the solution is to use the bsmedberg stub, described in using dependent libraries in extension components: the component library is just a loader of the real library and all its dependencies, so as all the needed libraries are
loaded.
NPN_PostURL - Archive of obsolete content
if unsuccessful, the plug-in is not
loaded and the function returns an error code.
... if you specify _current, _self, or _top, the response data is written to the same plug-in window and the plug-in is un
loaded.
NP_Shutdown - Archive of obsolete content
note: if enough memory is available, the browser can keep the plug-in library
loaded if it expects to create more instances in the near future.
... the browser calls np_shutdown only when the library is finally un
loaded.
Building a Theme - Archive of obsolete content
css, xul, and other files are part of "chrome packages" - bundles of user interface components which are
loaded via chrome:// uris.
... note: your theme will be passed faster and down
loaded more if you have a good description and some screenshots of the theme in action.
GetObject - Archive of obsolete content
for example: myobject.line(9, 90); myobject.inserttext(9, 100, "hello, world."); myobject.saveas("c:\\drawings\\sample.drw"); note: use the getobject function when there is a current instance of the object, or if you want to create the object with a file already
loaded.
... if there is no current instance, and you don't want the object started with a file
loaded, use the activexobject object.
Back to the Server: Server-Side JavaScript On The Rise - Archive of obsolete content
it is assumed that you have already down
loaded, extracted, and consumed the necessary documentation to get up and running with some basic rhino scripts.
...the appropriate database driver for mysql is
loaded and the connection string to a database named rhino on my local machine is configured using the user account urhino with the password of prhino.
Mozilla XForms Specials - Archive of obsolete content
information about how to whitelist domain can be found in the release notes the cross domain check also includes forms
loaded from file://.
... forms
loaded from that url should be local files, and thus trusted, but it is not always the case.
Displaying a graphic with audio samples - Archive of obsolete content
controls="true" style="width: 512px;"> </audio> <div><canvas id="fft" width="512" height="200"></canvas></div> <img id="mozlogo" style="display:none" src="mozilla2.png"></img> <script> var canvas = document.getelementbyid('fft'), ctx = canvas.getcontext('2d'), channels, rate, framebufferlength, fft; function
loadedmetadata() { channels = audio.mozchannels; rate = audio.mozsamplerate; framebufferlength = audio.mozframebufferlength; fft = new fft(framebufferlength / channels, rate); } function audioavailable(event) { var fb = event.framebuffer, t = event.time, /* unused, but it's there */ signal = new ...
... // draw rectangle bars for each frequency bin ctx.fillrect(i * 4, canvas.height, 3, -magnitude); } ctx.drawimage(document.getelementbyid('mozlogo'),0,0, canvas.width, canvas.height); } var audio = document.getelementbyid('audio-element'); audio.addeventlistener('mozaudioavailable', audioavailable, false); audio.addeventlistener('
loadedmetadata',
loadedmetadata, false); </script> </body> </html> ...
Buttons - Game development
add these lines below your other variable definitions: var playing = false; var startbutton; loading the button spritesheet we can load the button spritesheet the same way we
loaded the ball's wobble animation.
...to do that, adjust the update() function like so: function update() { game.physics.arcade.collide(ball, paddle, ballhitpaddle); game.physics.arcade.collide(ball, bricks, ballhitbrick); if(playing) { paddle.x = game.input.x || game.world.width*0.5; } } that way the paddle is immovable after everything is
loaded and prepared, but before the start of the actual game.
Visual typescript game engine - Game development
find configuration at ./src/lib/client-config.ts /** * addson * all addson are ansync
loaded scripts.
... https://www.npmjs.com/package/@types/matter-js crypto icons down
loaded from https://www.behance.net/junikstudio todo list for 2019 i'm still far away from the project objective : make visual nodes for editor mode in gameplay.
Domain sharding - MDN Web Docs Glossary: Definitions of Web-related terms
the initial response from an http request is generally an html file listing other resources such as javascript, css, images and other media files that need to be down
loaded.
... as browsers limit the number of active connections per domain, serving all the required resources from a single domain could be slow as assets need to be down
loaded sequentially.
Practical positioning examples - Learn web development
you might be thinking "why not just create the separate tabs as separate webpages, and just have the tabs clicking through to the separate pages to create the effect?" this code would be simpler, yes, but then each separate "page" view would actually be a newly-
loaded webpage, which would make it harder to save information across views, and integrate this feature into a larger ui design.
... note: some web developers take things even further, only having one page of information
loaded at once, and dynamically changing the information shown using a javascript feature such as xmlhttprequest.
Web fonts - Learn web development
web fonts are a css feature that allows you to specify font files to be down
loaded along with your website as it is accessed, meaning that any browser that supports web fonts can have exactly the fonts you specify available to it.
...in newer browsers, you can also specify a unicode-range value, which is a specific range of characters you want to use out of the web font — in supporting browsers, only the specified characters will be down
loaded, saving unnecessary downloading.
What are browser developer tools? - Learn web development
these tools do a range of things, from inspecting currently-
loaded html, css and javascript to showing which assets the page has requested and how long they took to load.
...it allows you to run lines of javascript against the page currently
loaded in the browser, and reports the errors encountered as the browser tries to execute your code.
JavaScript basics - Learn web development
if the javascript loads first and it is supposed to affect the html that hasn't
loaded yet, there could be problems.
... the code uses a conditional to check if the src value is equal to the path of the original image: if it is, the code changes the src value to the path of the second image, forcing the other image to be
loaded inside the <img> element.
Adding vector graphics to the Web - Learn web development
the svg file can be cached by the browser, resulting in faster loading times for any page that uses the image
loaded in the future.
... the browser cannot cache inline svg as it would cache regular image assets, so pages that include the image will not load faster after the first page containing the image is
loaded.
Introduction to web APIs - Learn web development
image source: over
loaded plug socket by the clear communication people, on flickr.
... common browser apis in particular, the most common categories of browser apis you'll use (and which we'll cover in this module in greater detail) are: apis for manipulating documents
loaded into the browser.
Video and Audio APIs - Learn web development
if you down
loaded our examples repo, you'll find it in javascript/apis/video-audio/start/ at this point, if you load the html you should see a perfectly normal html5 video player, with the native controls rendered.
... the <video> element contains two <source> elements so that different formats can be
loaded depending on the browser viewing the site.
CSS performance optimization - Learn web development
the browser can paint the page once it has down
loaded the css and built the css object model.
... will-change: opacity, transform; the font-display property applied to the @font-face rule, the font-display property defines how font files are
loaded and displayed by the browser, allowing text to appear with a fallback font while a font loads, or fails to load.
What is web performance? - Learn web development
this is the process that the browser uses to construct the web document once the files have been down
loaded from the server.
...extensive dom manipulation after the pages has
loaded (e.g., adding, deleting, or moving of nodes) can affect performance, so it is worth understanding how to dom works, and how such issues can be mitigated.
Multimedia: video - Learn web development
previous overview: performance next as we learned in the previous section, media, namely images and video, account for over 70% of the bytes down
loaded for the average website.
... setting preload="none" results in none of the video being down
loaded until playback.
The "why" of web performance - Learn web development
a 22.6 mb site could take up to 83 seconds to load on a 3g network, with domcontent
loaded (meaning the site's base html structure) at 31.86 seconds.
... and if this site were
loaded on a us carrier's international roaming plan?
Properly configuring server MIME types - Learn web development
note: historically, firefox has
loaded css files even if they had the wrong mime type, as long as the html document that requested them was being processed in quirks mode.
... for security reasons, gecko 2.0 will no longer do this for stylesheets
loaded from a different origin than the requesting document.
Ember resources and troubleshooting - Learn web development
both of these files are generated with sourcemaps, so when you open the vendor.js or {app-name}.js to search for relevant code, when a debugger is placed, the sourcemap will be
loaded and the breakpoint will be placed in the pre-transpiled code for easier correlation to your project code.
... model — where data is
loaded.
Introducing a complete toolchain - Learn web development
git can be down
loaded and installed via the git-scm website — download the relevant installer for your system, run it, and follow the on-screen prompts.
... note: if you want to just take our existing project and set it up, ready to use, you could go into the root directory of the unzipped down
loaded, and run one single installation command to install all of the project’s dependencies: npm install.
Package management basics - Learn web development
a bundle is the term that’s generally used to refer to a single file on your web server that contains all the javascript for your software — typically compressed as much as possible to help reduce the time it takes to get your software down
loaded and displayed in your visitors’ browser.
... if we had avoided any development tools and pointed a <script src=””> element to a hosted version of date-fns, roughly the same thing would have happened — all of the library would be down
loaded when our example page is
loaded in a browser.
Mozilla accessibility architecture
one benefit of this approach is that accessibility.dll/libaccessibility.so does not need get
loaded until the accessibility service gets used, and for most users it is never
loaded.
...these crashes occur when the assistive techology releases after some gecko modules have already been un
loaded, when the necessary destructors no longer exist in memory.
Debugging on Mac OS X
on macos 10.15+, down
loaded try builds will not launch by default because notarization is required.
... to workaround this problem, remove the quarantine extended attribute from the down
loaded nightly: $ xattr -r -d com.apple.quarantine /path/to/nightly.app local builds local builds of mozilla-central do not enable hardened runtime and hence do not have debugging restrictions.
Debugging on Windows
setting breakpoints in dlls which are not yet
loaded in memory vc++ 6.0: go to project > settings..., debug tab and select "additional dlls" from the drop down list.
... find the directory where visual studio caches down
loaded symbols; in vc++ 10 open the menu to tools > options > debugging > symbols and copy the field "cache symbols in this directory".
Error codes returned by Mozilla APIs
ns_error_factory_not_
loaded (0x800401f8) ns_error_factory_exists (0xc1f30100) ns_error_factory_no_signature_support (0xc1f30101) ns_error_proxy_invalid_in_parameter (0x80010010) ns_error_proxy_invalid_out_parameter (0x80010011) ns_error_cannot_convert_data (0x80460001) ns_error_object_is_immutable (0x80460002) ns_error_loss_of_significant_data (0x80460003) ns_error_illegal_during_shutdown (0x...
...03e9) ns_error_uconv_noconv (0x80500001) ns_error_udec_illegalinput (0x8050000e) ns_imagelib_error_failure (0x80540005) ns_imagelib_error_no_decoder (0x80540006) ns_imagelib_error_not_finished (0x80540007) ns_imagelib_error_load_aborted (0x80540008) ns_error_wont_handle_content (0x805d0001) moz_error_storage_error (0x80630001) ns_error_schemavalidator_no_schema_
loaded (0x80640001) ns_error_schemavalidator_no_dom_node_specified (0x80640002) ns_error_schemavalidator_no_type_found (0x80640003) ns_error_schemavalidator_type_not_found (0x80640004) note: there are other errors in these files: gfx/public/nsidevicecontext.h base/public/nsneterror.h parser/htmlparser/public/nsiparser.h layout/base/nslayouterrors.h profile/public/nsiprofileintern...
Frame script environment
the frame script's global is a contentframemessagemanager, giving it the following environment: content the dom window of the content
loaded in the browser.
... another use is to interact with the content very early in the page load process, long before domcontent
loaded event is fired.
Limitations of frame scripts
nsiaboutmodule by default, custom about: pages registered using nsiaboutmodule are
loaded in the chrome process.
... javascript code modules (jsms) in multiprocess firefox, a jsm
loaded into the content process does not share any state with the same jsm
loaded into the chrome process.
Frame script environment
the frame script's global is a contentframemessagemanager, giving it the following environment: content the dom window of the content
loaded in the browser may be null (see below) docshell the nsidocshell associated with the browser.
... another use is to interact with the content very early in the page load process, long before domcontent
loaded event is fired.
Performance best practices for Firefox front-end engineers
consider loading scripts with the subscript loader asynchronously if you've ever used the subscript loader, you might not know that it can load scripts asynchronously, and return a promise once they're
loaded.
... for example: services.scriptloader.loadsubscriptwithoptions(myscripturl, { async: true }).then(() => { console.log("script at " + myscripturl + "
loaded asynchronously!"); }); ...
HTMLIFrameElement.executeScript()
the executescript() method of the htmliframeelement interface allows a specified script to be executed against a page
loaded in the browser <iframe>.
... syntax var mydomrequest = instanceofhtmliframeelement.executescript(script, options); return value a domrequest object that returns an onsuccess handler if the script is successfully executed against the
loaded content, or an onerror handler if not.
HTMLIFrameElement.getManifest()
the getmanifest() method of the htmliframeelement interface retrieves the manifest of an app
loaded in the browser <iframe> and returns it as json.
... return value a promise that resolves to a json object representation of the
loaded app's manifest.
HTMLIFrameElement.getStructuredData()
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.
...if the request is successful, the request.result is a json object representation of all microdata contained on the page
loaded in the browser.
Overview of Mozilla embedding APIs
each service is represented by a singleton object which is instantiated the first time it is requested and remains alive until the service manager is shut down, or the service is explicitly un
loaded.
... through the service manager, individual services can be
loaded, un
loaded and accessed.
How to get a stacktrace with WinDbg
once the download is complete, you need to configure windbg to examine child processes, ignore a specific event caused by flash player, and record a log of
loaded modules.
...enter these three commands, one at a time, to get the stacktrace, crash/hang analysis and log of
loaded modules.
DownloadTarget
partfilepath read only string the path of the ".part" file containing the data down
loaded so far, or null to disable the use of a ".part" file to keep partially down
loaded data.
... calling this method lets the download object's properties be updated if the user moves or deletes the target file or its associated ".part" file, which contains a partially-down
loaded file's contents.
XPCOMUtils.jsm
the xpcomutils.jsm javascript code module offers utility routines for javascript components
loaded by the javascript component loader.
... examples definelazygetter var myservices = {}; cu.import('resource://gre/modules/xpcomutils.jsm'); //set it up xpcomutils.definelazygetter(myservices, 'as', function () { return cc['@mozilla.org/alerts-service;1'].getservice(ci.nsialertsservice) }); //when you need to use it myservices.as.showalertnotification('chrome://branding/content/icon64.png', 'this was lazy
loaded', 'this is a notification from myservices.as', null, null); ...
Bootstrapping a new locale
directories to localize if you're starting from scratch, you should have just down
loaded: mozilla-1.9.x/browser/locales/ mozilla-1.9.x/dom/locales/ mozilla-1.9.x/netwerk/locales/ mozilla-1.9.x/other-licenses/branding/firefox/locales/en-us mozilla-1.9.x/security/manager/locales/ mozilla-1.9.x/toolkit/locales/ and then copied them so that the files for localization end up in the following directories: ab-cd/browser/ ab-cd/dom/ ab-cd/netwerk/ ab-cd/other-licenses/branding/firefox/ ab...
... (read more about tools at l10n:tools.) after you have down
loaded your editor of choice, type the following command in the same path from above (~/ab-cd/browser/chrome/browser) $ edit ab-cd/browser/chrome/browser/aboutcerterror.dtd read the top of the file to get any context on how to translate contained in the notes written by the developers or l10n-drivers.
Using the viewport meta tag to control layout on mobile browsers
(there are corresponding height and device-height values, which may be useful for pages with elements that change size or position based on the viewport height.) the initial-scale property controls the zoom level when the page is first
loaded.
...for example, mobile safari often just zooms the page when changing from portrait to landscape, instead of laying out the page as it would if originally
loaded in landscape.
about:memory
single memory report files can also be
loaded automatically when about:memory is
loaded by appending a file query string, for example: about:memory?file=/home/username/reports.json.gz this is most useful when loading memory reports files obtained from a firefox os device.
...these files can be
loaded as is, but they can also be
loaded after unzipping.
PR_FindSymbol
syntax #include <prlink.h> void* pr_findsymbol ( prlibrary *lib, const char *name); parameters the function has these parameters: lib a valid reference to a
loaded library, as returned by pr_loadlibrary, or null.
...if the library is un
loaded, for instance, the results of any pr_findsymbol calls become invalid as well.
PR_FindSymbolAndLibrary
finds a symbol in one of the currently
loaded libraries, and returns both the symbol and the library in which it was found.
... description this function finds the specified symbol in one of the currently
loaded libraries.
NSS FAQ
binary builds of nss for several platforms including the command-line tools can be down
loaded from http://ftp.mozilla.org/pub/mozilla.o...y/nss/releases/.
... nspr, which you will need as well, can be down
loaded from http://ftp.mozilla.org/pub/mozilla.org/nspr/releases/.
JSS Provider Notes
at runtime, the jre automatically verifies this signature whenever a jss class is
loaded that implements a jce algorithm.
... if you build jss yourself from source instead of using binaries down
loaded from mozilla.org, your jar file will not have a valid signature.
Mozilla-JSS JCA Provider notes
at runtime, the jre automatically verifies this signature whenever a jss class is
loaded that implements a jce algorithm.
...if you build jss yourself from source instead of using binaries down
loaded from mozilla.org, your jar file will not have a valid signature.
PKCS #11 Module Specs
critical - if this library cannot be
loaded, completely fail initialization.
...at init time nss, will try to look for a default root cert device if one has not already been
loaded.
The JavaScript Runtime
instead, every property accessor method in scriptable (has, get, set, remove, getattributes, and setattributes) has over
loaded forms that take either a string or an int argument.
... it is the responsibility of the caller to invoke the appropriate over
loaded form.
Rhino scopes and contexts
these objects would normally be lazy
loaded but the lazy loading fails if the scope is sealed.
... scriptableobject sealedsharedscope = cx.initstandardobjects(null, true); // force the liveconnect stuff to be
loaded.
JSErrorReport
ismuted bool the web platform allows scripts to be
loaded from arbitrary cross-origin sources.
... to counter this attack, html5 specifies that script errors should be sanitized ("muted") when the script is not same-origin with the global for which it is
loaded.
Bundling multiple binary components
the costs get higher if you have many methods that need to be
loaded.
... the real components are manually
loaded and registered using the stub ("krealcomponent" in the sample).
An Overview of XPCOM
performance when code is modularized, modules that are not necessary right away can be "lazy
loaded", or not
loaded at all, which can improve the performance of your application.
...this is important when you want to group sets of factories together and determine if they can be un
loaded.
Finishing the Component
when the component is
loaded, gecko calls the nsicontentpolicy implementation in weblock on every page load, and this prevents pages from displaying by returning the proper value when the load method is called.
...or you could implement the web lock so that instead of blocking any site, the component would simply log all urls that are
loaded.
Starting WebLock
since the component hasn't been created yet, there are no instantiated nsiobserver objects that can be passed into the nsiobserverservice, nor can the component code do anything until it is
loaded.
...the first section of the interface controls whether or not weblock checks to see if a web page can be
loaded.
Components.utils.import
note: prior to gecko 2.0, javascript code modules could only be
loaded using file: or resource: urls.
... syntax components.utils.import(url [, scope]); // or, if you use a tool such as jslint which reports compiler errors for the above, components.utils["import"](url [, scope]); parameters url a string of the url of the script to be
loaded.
nsIApplicationCacheChannel
loadedfromapplicationcache prbool true if the resource was
loaded from the application cache, otherwise false.
... this value may be false even if the resource is assigned to an application cache if, for example, it was
loaded as a fallback.
nsIBrowserSearchService
exceptions thrown ns_error_failure if the type is invalid, or if the description file cannot be successfully
loaded.
...this includes all
loaded engines that aren't in the user's profile directory (ns_app_user_search_dir).
nsICategoryManager
icategorymanager); var enumerator = categorymanager.enumeratecategory("app-startup"); var entries = []; while (enumerator.hasmoreelements()) { var item = enumerator.getnext(); var entry = item.queryinterface(components.interfaces.nsisupportscstring) entries.push(entry.tostring()); } entries.sort(); var entriesstring = entries.join("\n"); dump(entriesstring + "\n"); disable currently
loaded plugins by type this snippet here shows how to disable plugins that are currently
loaded for the file type of pdf.
... var content_type = 'application/pdf'; // update the category manager in case the plugins are already
loaded.
nsICharsetResolver
requestcharset() called to resolve the charset that should be used for parsing the document being
loaded from achannel.
...acstring requestcharset( in nsiwebnavigation awebnavigation, in nsichannel achannel, out boolean awantcharset, out nsisupports aclosure ); parameters awebnavigation the nsiwebnavigation the document is being
loaded in.
nsIDownloadProgressListener
alocation the uri of the file being down
loaded.
... adownload the nsidownload object representing the file being down
loaded.
nsIExternalProtocolService
for example, a non-exposed protocol would not be
loaded by the application in response to a link click or a x-remote openurl command.
...awindowcontext the window to parent the dialog against, and, if a web handler is chosen, it is
loaded in this window as well.
nsIFaviconService
for a normal page with a favicon we've stored, this will be an annotation uri which will then cause the corresponding favicon data to be
loaded from this service.
...for a normal page with a favicon we've stored, this will be an annotation uri which will then cause the corresponding favicon data to be
loaded from this service.
nsIMicrosummaryObserver
1.0 66 introduced gecko 1.8 obsolete gecko 6.0 inherits from: nsisupports last changed in gecko 1.9 (firefox 3) warning: microsummary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) method overview void oncontent
loaded(in nsimicrosummary microsummary); void onelementappended(in nsimicrosummary microsummary); void onerror(in nsimicrosummary microsummary); methods oncontent
loaded() called when an observed microsummary updates its content.
...void oncontent
loaded( in nsimicrosummary microsummary ); parameters microsummary the microsummary whose content has just been updated.
nsIMicrosummaryService
the set might change after this method returns, since this method will trigger an asynchronous load of the page in question (if it isn't already
loaded) to see if it references any page-specific microsummaries.
... if the caller passes a bookmark id, and one of the microsummaries is the current one for the bookmark, this method will retrieve content from the datastore for that microsummary, which is useful when callers want to display a list of microsummaries for a page that isn't
loaded, and they want to display the actual content of the selected microsummary immediately (rather than after the content is asynchronously
loaded).
nsIMsgFolder
lastmessage
loaded nsmsgkey unique id to the folder, it is not a globally unique identifier.
... will return nsmsgkey_none if there was no last message
loaded.
nsIMsgMessageService
adisplayconsumer is (for now) an nsidocshell which the message is
loaded into.
... adisplayconsumer for now, a nsidocshell which the message is
loaded into.
nsINavHistoryQuery
rray,size_is(count)] out unsigned long transitions); void setfolders([const,array, size_is(foldercount)] in long long folders, in unsigned long foldercount); void settransitions([const,array, size_is(count)] in unsigned long transitions, in unsigned long count); attributes attribute type description absolutebegintime prtime read only: retrieves the begin time value that the currently
loaded reference points + offset resolve to.
... absoluteendtime prtime read only: retrieves the end time value that the currently
loaded reference points + offset resolve to.
nsIParserUtils
in that case, <a> links (and similar) to other content are preserved, so an explicit user action (following a link) after the content has been
loaded can still leak information.
... note: if -moz-binding is not present, <style> elements and style attributes, and if sanitizerallowstyle is specified, the sanitized content may still be xss dangerous if
loaded into a non-gecko web engine!
nsIProtocolProxyService
however, if the nsiproxyinfo type is "http", then it means that the given uri should be
loaded using the http protocol handler, which also supports nsiproxiedprotocolhandler.
... note: if pac is configured, and the pac file has not yet been
loaded, then this method will return a nsiproxyinfo instance with a type of "unknown" to indicate to the consumer that asyncresolve should be used to wait for the pac file to finish loading.
nsISHistory
listeners are notified when pages are
loaded or purged from history.
...listeners are notified when pages are
loaded from history.
nsIUpdate
state astring the state of the selected patch: "downloading" the update is being down
loaded.
..."download-failed" the update failed to be down
loaded.
nsIUpdateCheckListener
position the number of bytes down
loaded so far.
... totalsize the total number of bytes that need to be down
loaded.
nsIUpdateItem
xpiurl astring the url of the xpi where this item can be down
loaded.
... name the item's name downloadurl the url from which the item is to be down
loaded.
nsIUploadChannel2
1.0 66 introduced gecko 1.9.2 inherits from: nsisupports last changed in gecko 1.9.2 (firefox 3.6 / thunderbird 3.1 / fennec 1.0) method overview void explicitsetuploadstream(in nsiinputstream astream, in acstring acontenttype, in long long acontentlength, in acstring amethod, in boolean astreamhasheaders); methods explicitsetuploadstream() sets a stream to be up
loaded by this channel with the specified content-type and content-length header values.
... void explicitsetuploadstream( in nsiinputstream astream, in acstring acontenttype, in long long acontentlength, in acstring amethod, in boolean astreamhasheaders ); parameters astream the stream to be up
loaded by this channel.
nsIWebPageDescriptor
docshell/base/nsiwebpagedescriptor.idlscriptable this interface allows content being displayed in one window to be
loaded into another window without refetching it from the network.
...adisplaytype the display type to use when displaying the
loaded page; see display type constants for possible values.
nsIWindowWatcher
if the name doesn't exist, then a new window is opened and the specified resource is
loaded into its browsing context.">window.open.
...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.
Troubleshooting XPCOM components registration
there are several common reasons that registration can fail: a component that is a binary (shared library) fails to load a javascript component has parsing errors the shared library
loaded correctly, but registration was not successful did registration succeed?
... windows-specific hints use dependency walker to check that your dependent libraries are
loaded correctly.
Xray vision
javascript
loaded from normal web pages is called content code.
... because this code is being
loaded from arbitrary web pages, it is regarded as untrusted and potentially hostile, both to other websites and to the user.
Main Windows
things appear confusing for several reasons: much of the code is written to be portable, so instead of duplicating it, its been put in overlays that are
loaded over many different types of windows.
...the rest is
loaded from overlays: mailwindowoverlay.xul this is the red sections shown in the interface above (where?), including the toolbars, notification bars, and the status bar, but also includes most of the commands, keysets, and context menus of thunderbird, along with a whole lot of javascript.
Thunderbird Binaries
described below are three types of generally available thunderbird packages - releases, early preview releases, and nightly builds (including trunk development builds) - and their down
loaded locations.
... thunderbird current release can be down
loaded from https://www.mozilla.org/thunderbird/ past thunderbird releases can be down
loaded from https://releases.mozilla.org/pub/thunderbird/releases/ early preview releases whilst writing new versions of thunderbird, developers release preview versions, known as betas.
Creating a Custom Column
window.addeventlistener("load", doonce
loaded, false); function doonce
loaded() { var observerservice = components.classes["@mozilla.org/observer-service;1"].getservice(components.interfaces.nsiobserverservice); observerservice.addobserver(createdbobserver, "msgcreatedbview", false); } var createdbobserver = { // components.interfaces.nsiobserver observe: function(amsgfolder, atopic, adata) { addcustomcolumnhandler(); } } ...
...what happens is: usually, the event sequence is: jsm load -> onload -> msgcreatedbview with enigmail, the event sequence becomes jsm load -> msgcreatedbview -> onload to workaround this, you can either i) manually run addcustomhandler() at the end of your onload handler or ii) register createdbobserver when your .jsm is
loaded.
XPI
when down
loaded or dropped into an extension manager, xpinstall automatically interacts with the installation instructions contained in the xpi, and installs the contained software.
...instead, the xpi itself is placed in the extensions directory, and files are
loaded directly out of the package.
Access debugging in add-ons - Firefox Developer Tools
the following items are accessible in the context of chrome://browser/content/debugger.xul (or, in version 23 beta, chrome://browser/content/devtools/debugger.xul): window.addeventlistener("debugger:editor
loaded") - called when the read-only script panel
loaded.
... window.addeventlistener("debugger:editorun
loaded") relevant files: chrome://browser/content/devtools/debugger-controller.js chrome://browser/content/devtools/debugger-toolbar.js chrome://browser/content/devtools/debugger-view.js chrome://browser/content/devtools/debugger-panes.js unfortunately there is not yet any api to evaluate watches/expressions within the debugged scope, or highlight elements on the page that are referenced as variables in the debugged scope.
Tree map view - Firefox Developer Tools
scripts: javascript sources
loaded by the page.
...you can see the much larger proportion of the heap occupied by scripts, that are
loaded from a large number of origins.
Network request details - Firefox Developer Tools
queued, started, down
loaded new in firefox 72, we now show the following timings at the top of the timings tab, making dependency analysis a lot easier: queued: when the resource was queued for download.
... down
loaded: when the the resource finished downloading.
Edit fonts - Firefox Developer Tools
this tool contains several useful features for viewing and manipulating fonts applied to any document
loaded in the browser including inspection of all fonts applied to the page, and precise adjustment of variable font axis values.
... the url to the font file in the case of web fonts not available on your system, or "system" in the case of fonts
loaded from your computer (either default system fonts, or web fonts that you've also got installed on your system).
How to - Firefox Developer Tools
save a profile to save a profile, click the link labeled "save" in the recordings pane: load a profile to load a profile, click "import..." and choose the file: clear all
loaded profiles to clear all
loaded profiles, click "clear".
... if you do this, you'll lose any
loaded profiles that you have not saved.
Responsive Design Mode - Firefox Developer Tools
n - take a screenshot settings button - opens the rdm settings menu close button - closes rdm mode and returns to regular browsing the settings menu includes the following commands: left-align viewport - when checked moves the rdm viewport to the left side of the browser window show user agent - when checked displays the user agent string the final two options define when the page is re
loaded: reload when touch simulation is toggled: when this option is enabled, the page is re
loaded whenever you toggle touch support.
... reload when user agent is changed: when this option is enabled, the page isre
loaded whenever the user agent is changed.
AbstractRange - Web APIs
first, after your page is
loaded, the browser simply isn't thinking in terms of html.
... once it's been
loaded, the page is a tree of dom node objects, so you need to specify the beginning and ending locations of a range in terms of nodes and positions within nodes.
AudioProcessingEvent - Web APIs
example the following example shows basic usage of a scriptprocessornode to take a track
loaded via audiocontext.decodeaudiodata(), process it, adding a bit of white noise to each audio sample of the input track (buffer) and play it through the audiodestinationnode.
...n() { var audiodata = request.response; audioctx.decodeaudiodata(audiodata, function(buffer) { mybuffer = buffer; source.buffer = mybuffer; }, function(e){"error with decoding audio data" + e.err}); } request.send(); } // give the node a function to process audio events scriptnode.onaudioprocess = function(audioprocessingevent) { // the input buffer is the song we
loaded earlier var inputbuffer = audioprocessingevent.inputbuffer; // the output buffer contains the samples that will be modified and played var outputbuffer = audioprocessingevent.outputbuffer; // loop through the output channels (in this case there is only one) for (var channel = 0; channel < outputbuffer.numberofchannels; channel++) { var inputdata = inputbuffer.getchanneldata(channe...
BaseAudioContext.createScriptProcessor() - Web APIs
example the following example shows basic usage of a scriptprocessornode to take a track
loaded via audiocontext.decodeaudiodata(), process it, adding a bit of white noise to each audio sample of the input track (buffer) and play it through the audiodestinationnode.
...n() { var audiodata = request.response; audioctx.decodeaudiodata(audiodata, function(buffer) { mybuffer = buffer; source.buffer = mybuffer; }, function(e){"error with decoding audio data" + e.err}); } request.send(); } // give the node a function to process audio events scriptnode.onaudioprocess = function(audioprocessingevent) { // the input buffer is the song we
loaded earlier var inputbuffer = audioprocessingevent.inputbuffer; // the output buffer contains the samples that will be modified and played var outputbuffer = audioprocessingevent.outputbuffer; // loop through the output channels (in this case there is only one) for (var channel = 0; channel < outputbuffer.numberofchannels; channel++) { var inputdata = inputbuffer.getchanneldata(channe...
CSSStyleSheet - Web APIs
notes in some browsers, if a stylesheet is
loaded from a different domain, accessing cssrules results in securityerror.
... a cssstylesheet object is created and inserted into the document's document.stylesheets list automatically by the browser, when a stylesheet is
loaded for a document.
CanvasRenderingContext2D.drawImage() - Web APIs
ns_error_not_available the image is not
loaded yet.
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); const image = new image(60, 45); // using optional size for image image.onload = drawimageactualsize; // draw when image has
loaded // load an image of intrinsic size 300x227 in css pixels image.src = 'https://udn.realityripple.com/samples/db/f374e9c6fc.jpg'; function drawimageactualsize() { // use the intrinsic size of image in css pixels for the canvas element canvas.width = this.naturalwidth; canvas.height = this.naturalheight; // will draw the image as 300x227, ignoring the custom size of 60x45 // given in th...
Applying styles and colors - Web APIs
for example: var img = new image(); img.src = 'someimage.png'; var ptrn = ctx.createpattern(img, 'repeat'); note: like with the drawimage() method, you must make sure the image you use is
loaded before calling this method or the pattern may be drawn incorrectly.
...this is to make sure the image is
loaded before it is assigned to the pattern.
Clients.claim() - Web APIs
be aware that this results in your service worker controlling pages that
loaded regularly over the network, or possibly via a different service worker.
... example the following example uses claim() inside service worker's "activate" event listener so that clients
loaded in the same scope do not need to be re
loaded before their fetches will go through this service worker.
DOMHighResTimeStamp - Web APIs
it's calculated like this: if the script's global object is a window, the time origin is determined as follows: if the current document is the first one
loaded in the window, the time origin is the time at which the browser context was created.
... if during the process of unloading the previous document which was
loaded in the window, a confirmation dialog was displayed to let the user confirm whether or not to leave the previous page, the time origin is the time at which the user confirmed that navigating to the new page was acceptable.
Document.fonts - Web APIs
the fontfaceset interface is useful for loading new fonts, checking the status of previously
loaded fonts etc.
... examples doing operation after all fonts are
loaded document.fonts.ready.then(function() { // any operation that needs to be done only after all the fonts // have finished loading can go here.
Document.readyState - Web APIs
var span = document.createelement("span"); span.textcontent = "a <span> element."; document.body.appendchild(span); break; case "complete": // the page is fully
loaded.
... console.log("the first css rule is: " + document.stylesheets[0].cssrules[0].csstext); break; } readystatechange as an alternative to domcontent
loaded event // alternative to domcontent
loaded event document.onreadystatechange = function () { if (document.readystate === 'interactive') { initapplication(); } } readystatechange as an alternative to load event // alternative to load event document.onreadystatechange = function () { if (document.readystate === 'complete') { initapplication(); } } readystatechange as event listener to insert or modify the dom before domcontent
loaded document.addeventlistener('readystatechange', event => { if (event.target.readystate === 'interactive') { initloader(); } else if (event.target.readystate === 'complete') { ini...
Introduction to the DOM - Web APIs
this following javascript will display an alert when the document is
loaded (and when the whole dom is available for use): <body onload="window.alert('welcome to my home page!');"> another example.
... this function creates a new h1 element, adds text to that element, and then adds the h1 to the tree for this document: <html> <head> <script> // run this function when the document is
loaded window.onload = function() { // create a couple of elements in an otherwise empty html page const heading = document.createelement("h1"); const heading_text = document.createtextnode("big head!"); heading.appendchild(heading_text); document.body.appendchild(heading); } </script> </head> <body> </body> </html> fundamental data types this reference tries to describe the various objects and types in simple terms.
FetchEvent() - Web APIs
isreload read only a boolean that signifies whether the page was re
loaded or not when the event was dispatched.
... preloadresponse read only a promise which returns a previously-
loaded response to the client.
FetchEvent.preloadResponse - Web APIs
if no match is found, the code checks for a pre
loaded response.
... addeventlistener('fetch', event => { event.respondwith(async function() { // respond from the cache if we can const cachedresponse = await caches.match(event.request); if (cachedresponse) return cachedresponse; // else, use the pre
loaded response, if it's there const response = await event.preloadresponse; if (response) return response; // else try the network.
FetchEvent.navigationPreload - Web APIs
example the following example shows the implementation of a fetch event that uses a pre
loaded response.
... addeventlistener('fetch', event => { event.respondwith(async function() { // respond from the cache if we can const cachedresponse = await caches.match(event.request); if (cachedresponse) return cachedresponse; // else, use the pre
loaded response, if it's there const response = await event.preloadresponse; if (response) return response; // else try the network.
Using Fetch - Web APIs
const data = { username: 'example' }; fetch('https://example.com/profile', { method: 'post', // or 'put' headers: { 'content-type': 'application/json', }, body: json.stringify(data), }) .then(response => response.json()) .then(data => { console.log('success:', data); }) .catch((error) => { console.error('error:', error); }); uploading a file files can be up
loaded using an html <input type="file" /> input element, formdata() and fetch().
...t.queryselector('input[type="file"]'); formdata.append('username', 'abc123'); formdata.append('avatar', filefield.files[0]); fetch('https://example.com/profile/avatar', { method: 'put', body: formdata }) .then(response => response.json()) .then(result => { console.log('success:', result); }) .catch(error => { console.error('error:', error); }); uploading multiple files files can be up
loaded using an html <input type="file" multiple /> input element, formdata() and fetch().
FileReader - Web APIs
this is one of the following: empty 0 no data has been
loaded yet.
... loading 1 data is currently being
loaded.
FileRequest.onprogress - Web APIs
those objects contain two properties:
loaded a number representing the current amount of bytes processed by the operation.
... example // assuming 'request' which is a filerequest object request.onprogress = function (status) { var progress = document.queryselector('progress'); progress.value = status.
loaded; progress.max = status.total; } specification not part of any current specification.
FontFace.status - Web APIs
the status read-only property of the fontface interface returns an enumerated value indicating the status of the font, one of "un
loaded", "loading", "
loaded", or "error".
... syntax var status = fontface.status; value one of "un
loaded", "loading", "
loaded", or "error".
FontFaceSet - Web APIs
it will be one of 'loading' or '
loaded'.
... fontfaceset.check() a boolean that indicates whether a font is
loaded, but doesn't initiate a load when it isn't.
Fullscreen API - Web APIs
the full-screen mode feature is identified by the string "fullscreen", with a default allow-list value of "self", meaning that full-screen mode is permitted in top-level document contexts, as well as to nested browsing contexts
loaded from the same origin as the top-most document.
... view live examples watching for the enter key when the page is
loaded, this code is run to set up an event listener to watch for the enter key.
GlobalEventHandlers.onload - Web APIs
the load event fires when a given resource has
loaded.
... there are also dom events like domcontent
loaded and domframecontent
loaded (which can be handled using eventtarget.addeventlistener()) which are fired after the dom for the page has been constructed, but do not wait for other resources to finish loading.
GlobalEventHandlers - Web APIs
globaleventhandlers.on
loadeddata is an eventhandler representing the code to be called when the
loadeddata event is raised.
... globaleventhandlers.on
loadedmetadata is an eventhandler representing the code to be called when the
loadedmetadata event is raised.
HTMLImageElement.alt - Web APIs
the htmlimageelement property alt provides fallback (alternate) text to display when the image specified by the <img> element is not
loaded.
... syntax htmlimageelement.alt = alttext; let alttext = htmlimageelement.alt; value a domstring which contains the alternate text to display when the image is not
loaded or for use by assistive devices.
HTMLImageElement.crossOrigin - Web APIs
this means that cors is enabled and credentials are sent if the image is fetched from the same origin from which the document was
loaded.
... example in this example, a new <img> element is created and added to the document, loading the image with the anonymous state; the image will be
loaded using cors and credentials will be used for all cross-origin loads.
HTMLTrackElement - Web APIs
loaded 2 indicates that the text track has been
loaded with no fatal errors.
... usage notes loading of the track's text resource the webvtt or ttml data describing the actual cues for the text track isn't
loaded if the track's mode is initially in the disabled state.
Using microtasks in JavaScript with queueMicrotask() - Web APIs
element.addeventlistener("load", () => console.log("
loaded data")); console.log("fetching data..."); element.getdata(); console.log("data fetched"); executing this code twice in a row gives the results shown in the table below: results when data isn't cached (left) vs.
... when it is found in the cache data isn't cached data is cached fetching data data fetched
loaded data fetching data
loaded data data fetched even worse, sometimes the element's data property will be set and other times it won't be by the time this code finishes running.
History.length - Web APIs
the history.length read-only property returns an integer representing the number of elements in the session history, including the currently
loaded page.
... for example, for a page
loaded in a new tab this property returns 1.
IDBOpenDBRequest.onupgradeneeded - Web APIs
the onupgradeneeded property of the idbopendbrequest interface is the event handler for the upgradeneeded event, triggered when a database of a bigger version number than the existing stored database is
loaded.
...}; example in the following example you can see the onupgradeneeded handler being used to update the database structure if a database with a higher version number is
loaded.
Using IndexedDB - Web APIs
when you call open() with a greater version than the actual version of the database, all other open databases must explicitly acknowledge the request before you can start making changes to the database (an onblocked event is fired until they are closed or re
loaded).
... here's how it works: var openreq = mozindexeddb.open("mytestdatabase", 2); openreq.onblocked = function(event) { // if some other tab is
loaded with the database, then it needs to be closed // before we can proceed.
Timing element visibility with the Intersection Observer API - Web APIs
although many aspects of this example will not match real world usage (in particular, the articles all have the same text and aren't
loaded from a database, and there are just a handful of simple text-only ads that are selected from an array), this should provide enough understanding of the api to quickly learn how to apply the intersection observer api to your own site.
...following every odd-numbered article, an ad is "
loaded" and inserted into the page.
Intersection Observer API - Web APIs
implementing "infinite scrolling" web sites, where more and more content is
loaded and rendered as you scroll, so that the user doesn't have to flip through pages.
...when a site is
loaded with these tests, things can get downright ugly.
Capabilities, constraints, and settings - Web APIs
s }).then(function(stream) { let audiotracks = stream.getaudiotracks(); let videotracks = stream.getvideotracks(); videoelement.srcobject = stream; if (audiotracks.length) { audiotrack = audiotracks[0]; } if (videotracks.length) { videotrack = videotracks[0]; } }).then(function() { return new promise(function(resolve) { videoelement.on
loadedmetadata = resolve; }); }).then(function() { getcurrentsettings(); }).catch(handleerror); } there are several steps here: it calls buildconstraints() to create the mediatrackconstraints objects for the two tracks from the code in the edit boxes.
... then we set up a promise which resolves when the on
loadedmetadata event occurs on the video element.
MessageChannel() - Web APIs
when the iframe has
loaded, we pass port2 to the iframe using messageport.postmessage along with a message.
... var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = document.queryselector('iframe'); var otherwindow = ifr.contentwindow; ifr.addeventlistener("load", iframe
loaded, false); function iframe
loaded() { 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).
MessageChannel.port1 - Web APIs
when the <iframe> has
loaded, we pass messagechannel.port2 to the <iframe> using messageport.postmessage along with a message.
... var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = document.queryselector('iframe'); var otherwindow = ifr.contentwindow; ifr.addeventlistener("load", iframe
loaded, false); function iframe
loaded() { 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.
MessageChannel.port2 - Web APIs
when the iframe has
loaded, we pass port2 to the iframe using messageport.postmessage along with a message.
... var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = document.queryselector('iframe'); var otherwindow = ifr.contentwindow; ifr.addeventlistener("load", iframe
loaded, false); function iframe
loaded() { 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).
MessagePort.onmessage - Web APIs
when the iframe has
loaded, we pass messagechannel.port2 to the iframe using messageport.postmessage along with a message.
... var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = document.queryselector('iframe'); var otherwindow = ifr.contentwindow; ifr.addeventlistener("load", iframe
loaded, false); function iframe
loaded() { 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).
MessagePort.postMessage() - Web APIs
when the iframe has
loaded, we pass messagechannel.port2 to the iframe using window.postmessage along with a message.
... var channel = new messagechannel(); var para = document.queryselector('p'); var ifr = document.queryselector('iframe'); var otherwindow = ifr.contentwindow; ifr.addeventlistener("load", iframe
loaded, false); function iframe
loaded() { 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).
msFirstPaint - Web APIs
msfirstpaint is a read-only property which gets the time when the document
loaded by the window object began to be displayed to the user.
... syntax p = object.msfirstpaint; value an integer value that represents the time when the document began to be displayed or 0 if the document could not be
loaded.
NavigationPreloadManager - Web APIs
await self.registration.navigationpreload.enable(); } }()); }); using a pre
loaded response the following example shows the implementation of a fetch event that uses a pre
loaded response.
... addeventlistener('fetch', event => { event.respondwith(async function() { // respond from the cache if we can const cachedresponse = await caches.match(event.request); if (cachedresponse) return cachedresponse; // else, use the pre
loaded response, if it's there const response = await event.preloadresponse; if (response) return response; // else try the network.
Navigator.getUserMedia() - Web APIs
your callback can then assign the stream to the desired object (such as an <audio> or <video> element), as shown in the following example: function(stream) { var video = document.queryselector('video'); video.srcobject = stream; video.on
loadedmetadata = function(e) { // do something with the video here.
...vigator.getusermedia = navigator.getusermedia || navigator.webkitgetusermedia || navigator.mozgetusermedia; if (navigator.getusermedia) { navigator.getusermedia({ audio: true, video: { width: 1280, height: 720 } }, function(stream) { var video = document.queryselector('video'); video.srcobject = stream; video.on
loadedmetadata = function(e) { video.play(); }; }, function(err) { console.log("the following error occurred: " + err.name); } ); } else { console.log("getusermedia not supported"); } ...
Page Visibility API - Web APIs
un
loaded the page is in the process of being un
loaded from memory.
... note: not all browsers support the un
loaded value.
PerformanceNavigationTiming - Web APIs
performancenavigationtiming.domcontent
loadedeventend read only a domhighrestimestamp representing the time value equal to the time immediately after the current document's domcontent
loaded event completes.
... performancenavigationtiming.domcontent
loadedeventstart read only a domhighrestimestamp representing the time value equal to the time immediately before the user agent fires the domcontent
loaded event at the current document.
PerformanceTiming - Web APIs
performancetiming.domcontent
loadedeventstart read only right before the parser sent the domcontent
loaded event, that is right after all the scripts that need to be executed right after parsing have been executed.
... performancetiming.domcontent
loadedeventend read only right after all the scripts that need to be executed as soon as possible, in order or not, have been executed.
ProgressEvent() - Web APIs
syntax progressevent = new progressevent(type, {lengthcomputable: abooleanvalue,
loaded: anumber, total: anumber}); arguments the progressevent() constructor also inherits arguments from event().
...
loaded optional is an unsigned long long representing the amount of work already performed by the underlying process.
ProgressEvent.initProgressEvent() - Web APIs
do not use it anymore, use the standard constructor, progressevent(), to create a synthetic progressevent syntax progress.initprogressevent(typearg, canbubblearg, cancelablearg, lengthcomputable,
loaded, total); parameters typearg is a domstring identifying the specific type of animation event that occurred.
...
loaded is an unsigned long long representing the amount of work already performed by the underlying process.
ProgressEvent - Web APIs
progressevent.
loaded read only is an unsigned long long representing the amount of work already performed by the underlying process.
... var progressbar = document.getelementbyid("p"), client = new xmlhttprequest() client.open("get", "magical-unicorns") client.onprogress = function(pe) { if(pe.lengthcomputable) { progressbar.max = pe.total progressbar.value = pe.
loaded } } client.onloadend = function(pe) { progressbar.value = pe.
loaded } client.send() specifications specification status comment xmlhttprequestthe definition of 'progressevent' in that specification.
SVGElement: load event - Web APIs
the load event fires on an svgelement when it is
loaded in the browser, e.g.
... bubbles no cancelable no interface svgevent event handler property onload examples svgelem.addeventlistener('load', () => { console.log('svg
loaded.'); }) specifications specification status comment scalable vector graphics (svg) 2the definition of 'load' in that specification.
ScriptProcessorNode.bufferSize - Web APIs
example the following example shows basic usage of a scriptprocessornode to take a track
loaded via audiocontext.decodeaudiodata(), process it, adding a bit of white noise to each audio sample of the input track (buffer) and play it through the audiodestinationnode.
...tion() { var audiodata = request.response; audioctx.decodeaudiodata(audiodata, function(buffer) { mybuffer = buffer; source.buffer = mybuffer; }, function(e){"error with decoding audio data" + e.err}); } request.send(); } // give the node a function to process audio events scriptnode.onaudioprocess = function(audioprocessingevent) { // the input buffer is the song we
loaded earlier var inputbuffer = audioprocessingevent.inputbuffer; // the output buffer contains the samples that will be modified and played var outputbuffer = audioprocessingevent.outputbuffer; // loop through the output channels (in this case there is only one) for (var channel = 0; channel < outputbuffer.numberofchannels; channel++) { var inputdata = inputbuffer.getchanneldata(channe...
ScriptProcessorNode.onaudioprocess - Web APIs
} example the following example shows basic usage of a scriptprocessornode to take a track
loaded via audiocontext.decodeaudiodata(), process it, adding a bit of white noise to each audio sample of the input track (buffer) and play it through the audiodestinationnode.
...n() { var audiodata = request.response; audioctx.decodeaudiodata(audiodata, function(buffer) { mybuffer = buffer; source.buffer = mybuffer; }, function(e){"error with decoding audio data" + e.err}); } request.send(); } // give the node a function to process audio events scriptnode.onaudioprocess = function(audioprocessingevent) { // the input buffer is the song we
loaded earlier var inputbuffer = audioprocessingevent.inputbuffer; // the output buffer contains the samples that will be modified and played var outputbuffer = audioprocessingevent.outputbuffer; // loop through the output channels (in this case there is only one) for (var channel = 0; channel < outputbuffer.numberofchannels; channel++) { var inputdata = inputbuffer.getchanneldata(channe...
ScriptProcessorNode - Web APIs
examples the following example shows basic usage of a scriptprocessornode to take a track
loaded via audiocontext.decodeaudiodata(), process it, adding a bit of white noise to each audio sample of the input track (buffer) and play it through the audiodestinationnode.
...tion() { var audiodata = request.response; audioctx.decodeaudiodata(audiodata, function(buffer) { mybuffer = buffer; source.buffer = mybuffer; }, function(e){"error with decoding audio data" + e.err}); } request.send(); } // give the node a function to process audio events scriptnode.onaudioprocess = function(audioprocessingevent) { // the input buffer is the song we
loaded earlier var inputbuffer = audioprocessingevent.inputbuffer; // the output buffer contains the samples that will be modified and played var outputbuffer = audioprocessingevent.outputbuffer; // loop through the output channels (in this case there is only one) for (var channel = 0; channel < outputbuffer.numberofchannels; channel++) { var inputdata = inputbuffer.getchanneldata(channe...
ServiceWorkerContainer.startMessages() - Web APIs
explanation by default, all messages sent from a page's controlling service worker to the page (using client.postmessage()) are queued while the page is loading, and get dispatched once the page's html document has been
loaded and parsed (i.e.
... after the domcontent
loaded event fires).
VideoPlaybackQuality.corruptedVideoFrames - Web APIs
the videoplaybackquality interface's read-only corruptedvideoframes property the number of corrupted video frames that have been received since the <video> element was last
loaded or re
loaded.
... syntax corruptframefount = videoplaybackquality.corruptedvideoframes; value the number of corrupted video frames that have been received since the <video> element was last
loaded or re
loaded.
VideoPlaybackQuality.droppedVideoFrames - Web APIs
the read-only droppedvideoframes property of the videoplaybackquality interface returns the number of video frames which have been dropped rather than being displayed since the last time the media was
loaded into the htmlvideoelement.
... syntax value = videoplaybackquality.droppedvideoframes; value an unsigned 64-bit value indicating the number of frames that have been dropped since the last time the media in the <video> element was
loaded or re
loaded.
Using textures in WebGL - Web APIs
// load texture const texture = loadtexture(gl, 'cubetexture.png'); mapping the texture onto the faces at this point, the texture is
loaded and ready to use.
... because webgl now requires textures to be
loaded from secure contexts, you can't use textures
loaded from file:/// urls in webgl.
window.location - Web APIs
syntax var oldlocation = location; location = newlocation; examples basic example alert(location); // alerts "/docs/web/api/window/location" example #1: navigate to a new page whenever a new value is assigned to the location object, a document will be
loaded using the url as if location.assign() had been called with the modified url.
...lick="showloc();">show location properties</button> example #5: send a string of data to the server by modifying the search property: function senddata (sdata) { location.search = sdata; } // in html: <button onclick="senddata('some data');">send data</button> the current url with "?some%20data" appended is sent to the server (if no action is taken by the server, the current document is re
loaded with the modified search string).
Window.openDialog() - Web APIs
syntax newwindow = opendialog(url, name, features, arg1, arg2, ...) newwindow the opened window url the url to be
loaded in the newly opened window.
...the variables specified in the javascript code which gets
loaded from the dialog), it is not possible to pass return values back past the close operation using globals (or any other constructs).
window.postMessage() - Web APIs
example /* * in window a's scripts, with a being on <http://example.com:8080>: */ var popup = window.open(/* popup details */); // when the popup has fully
loaded, if not blocked by a popup blocker: // this does nothing, assuming the window hasn't changed its location.
... the value of the origin property when the sending window contains a javascript: or data: url is the origin of the script that
loaded the url.
Window: unload event - Web APIs
the unload event is fired when the document or a child resource is being un
loaded.
...doctype html> <html> <head> <title>child frame</title> <script> window.addeventlistener('beforeunload', function(event) { console.log('i am the 2nd one.'); }); window.addeventlistener('unload', function(event) { console.log('i am the 4th and last one…'); }); </script> </head> <body> ☻ </body> </html> when the parent frame is un
loaded, events will be fired in the order described by the console.log() messages.
WindowOrWorkerGlobalScope.setTimeout() - Web APIs
firefox for android uses a timeout value of 15 minutes for background tabs since bug 736602 in firefox 14, and background tabs can also be un
loaded entirely.
...in background tabs, however, the throttling minimum delay is 10,000 ms, or 10 seconds, which comes into effect 30 seconds after a document has first
loaded.
Sending and Receiving Binary Data - Web APIs
var filestream = load_binary_resource(url); var abyte = filestream.charcodeat(x) & 0xff; // throw away high-order byte (f7) the example above fetches the byte at offset x within the
loaded binary data.
... var oreq = new xmlhttprequest(); oreq.open("post", url, true); oreq.onload = function (oevent) { // up
loaded.
XMLHttpRequestEventTarget.onprogress - Web APIs
event event.
loaded the amount of data currently transfered.
... xmlhttprequest.onprogress = function (event) { event.
loaded; event.total; }; example var xmlhttp = new xmlhttprequest(), method = 'get', url = 'https://developer.mozilla.org/'; xmlhttp.open(method, url, true); xmlhttp.onprogress = function () { //do something }; xmlhttp.send(); specifications specification status comment xmlhttprequest living standard whatwg living standard ...
Web applications and ARIA FAQ - Accessibility
here's the markup for a progress bar widget: <div id="percent-
loaded" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" /> this progress bar is built using a <div>, which is not very descriptive.
...var progressbar = document.getelementbyid("percent-
loaded"); // set its aria roles and states, so that assistive technologies know what kind of widget it is.
ARIA - Accessibility
here's the markup for a progress bar widget: <div id="percent-
loaded" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"> </div> this progress bar is built using a <div>, which has no meaning.
...var progressbar = document.getelementbyid("percent-
loaded"); // set its aria roles and states, // so that assistive technologies know what kind of widget it is.
unicode-range - CSS: Cascading Style Sheets
if the page doesn't use any character in this range, the font is not down
loaded; if it uses at least one, the whole font is down
loaded.
...for users viewing the english version of a page, the font resources for greek and japanese fonts wouldn't need to be down
loaded, saving bandwidth.
Using CSS animations - CSS: Cascading Style Sheets
animation-delay configures the delay between the time the element is
loaded and the beginning of the animation sequence.
...this code configures our event listeners; we call it when the document is first
loaded in order to set things up.
background-image - CSS: Cascading Style Sheets
if a specified image cannot be drawn (for example, when the file denoted by the specified uri cannot be
loaded), browsers handle it as they would a none value.
...if the images cannot be
loaded—for instance, when the network is down—the background color will be used as a fallback.
cursor - CSS: Cascading Style Sheets
the browser will try to load the first image specified, falling back to the next if it can't, and falling back to the keyword value if no images could be
loaded (or if none were specified).
... for example, this specifies two images using <url> values, providing <x><y> coordinates for the second one, and falling back to the progress keyword value if neither image can be
loaded: cursor: url(one.svg), url(two.svg) 5 5, progress; values <url> a url(…) or a comma separated list url(…), url(…), …, pointing to an image file.
Getting Started - Developer guides
} the full list of the readystate values is documented at xmlhttprequest.readystate and is as follows: 0 (uninitialized) or (request not initialized) 1 (loading) or (server connection established) 2 (
loaded) or (request received) 3 (interactive) or (processing request) 4 (complete) or (request finished and response is ready) next, check the http response status codes of the http response.
... simple timed xhr example another simple example follows — here we are loading a text file via xhr, the structure of which is assumed to be like this: time: 312.05 time: 312.07 time: 312.10 time: 312.12 time: 312.14 time: 312.15 once the text file is
loaded, we split() the items into an array at each newline character (\n — basically where each line break is in the text file), and then print the complete list of timestamps, and the last timestamp, onto the page.
Live streaming web audio and video - Developer guides
it can also be used instead of the traditional progressive download method for audio and video on demand: there are several advantages to this: latency is generally lower so media will start playing more quickly adaptive streaming makes for better experiences on a variety of devices media is down
loaded just in time which makes bandwidth usage more efficient streaming protocols while static media is usually served over http, there are several protocols for serving adaptive streams; let's take a look at the options.
... at the start of the streaming session, an extended m3u (m3u8) playlist is down
loaded.
Overview of events and handlers - Developer guides
for example, code might be attached as: var funcinit = function(){ // user code goes here and can safely address all the html elements from the page // since the document has successfully been '
loaded' } document.addeventlistener('domcontent
loaded', funcinit); so that this code will only be executed after the document object emits the 'domcontent
loaded' event because the html has been parsed and javasript objects created representing each of the nodes of the html document.
... the global object window emits an event called 'load' when the page has finished rendering, meaning that all resources have been down
loaded and acted upon, so that the scripts have been run and the images displayed, the global object window emits an event called 'resize' when the height or the width of the browser window is changed by a user, the dom object document representing the html document emits an event called 'domcontent
loaded' when the document has finished loading, the dom node objects such as div or button emit an even...
HTML attribute: rel - HTML: Hypertext Markup Language
while this attribute defines the link as being a stylesheet, the interaction with other attributes and other keyterms within the rel value impact whether the stylesheet is down
loaded and / or used.
... the external stylesheet will not be used or even down
loaded if the media does not match the value of the media attribute.
<input type="color"> - HTML: Hypertext Markup Language
here we establish some variables, setting up a variable that contains the color we'll set the color well to when we first load up, and then setting up a load handler to do the main startup work once the page is fully
loaded.
... var colorwell; var defaultcolor = "#0000ff"; window.addeventlistener("load", startup, false); initialization once the page is
loaded, our load event handler, startup(), is called: function startup() { colorwell = document.queryselector("#colorwell"); colorwell.value = defaultcolor; colorwell.addeventlistener("input", updatefirst, false); colorwell.addeventlistener("change", updateall, false); colorwell.select(); } this gets a reference to the color <input> element in a variable called colorwell, then sets the color input's value to the value in defaultcolor.
<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
required for accessibility autocomplete all hint for form autofill feature autofocus all automatically focus the form control when the page is
loaded capture file media capture input method in file upload controls checked radio, checkbox whether the command or control is checked dirname text, search name of form field to use for sending the element's directionality in form submission disabled all whether the form control is disabled form all associates the control with ...
... note: an element with the autofocus attribute may gain focus before the domcontent
loaded event is fired.
<script>: The Script element - HTML: Hypertext Markup Language
defer this boolean attribute is set to indicate to a browser that the script is meant to be executed after the document has been parsed, but before firing domcontent
loaded.
... scripts with the defer attribute will prevent the domcontent
loaded event from firing until the script has
loaded and finished evaluating.
MIME types (IANA media types) - HTTP
if this is not correctly configured, browsers are likely to misinterpret the contents of files and sites will not work correctly, and down
loaded files may be mishandled.
...this is not valid, and in most cases will result in a script not being
loaded.
Configuring servers for Ogg media - HTTP
handle http 1.1 byte range requests correctly in order to support seeking and playing back regions of the media that aren't yet down
loaded, gecko uses http 1.1 byte-range requests to retrieve the media from the seek target position.
...setting payload to auto tells the browser to automatically begin downloading the media as soon as the page is
loaded, under the assumption that the user will play it.
Content-Disposition - HTTP
in a regular http response, the content-disposition response header is a header indicating if the content is expected to be displayed inline in the browser, that is, as a web page or as part of a web page, or as an attachment, that is down
loaded and saved locally.
... header type response header (for the main body) general header (for a subpart of a multipart body) forbidden header name no syntax as a response header for the main body the first parameter in the http context is either inline (default value, indicating it can be displayed inside the web page, or as the web page) or attachment (indicating it should be down
loaded; most browsers presenting a 'save as' dialog, prefilled with the value of the filename parameters if present).
CSP: script-src-attr - HTTP
this includes only inline script event handlers like onclick, but not urls
loaded directly into <script> elements.
... 'strict-dynamic' the strict-dynamic source expression specifies that the trust explicitly given to a script present in the markup, by accompanying it with a nonce or a hash, shall be propagated to all the scripts
loaded by that root script.
Feature-Policy: unsized-media - HTTP
'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.
...the page will re-flow every time an image with unknown dimensions is
loaded.
HTTP headers - HTTP
x-download-options the x-download-options http header indicates that the browser (internet explorer) should not display the option to "open" a file that has been down
loaded from an application, to prevent phishing attacks as the file otherwise would gain access to execute in the context of the application.
... large-allocation tells the browser that the page being
loaded is going to want to perform a large allocation.
Link prefetching FAQ - HTTP
if a prefetched document is partially down
loaded, then the partial document will still be stored in the cache provided the server sent an "accept-ranges: bytes" response header.
... basically, there are two ways of looking at this issue: websites can already cause things to be silently down
loaded using js/dom hacks.
JavaScript modules - JavaScript
over in main.js we've grabbed a reference to each button using a document.queryselector() call, for example: let squarebtn = document.queryselector('.square'); we then attach an event listener to each button so that when pressed, the relevant module is dynamically
loaded and used to draw the shape: squarebtn.addeventlistener('click', () => { import('./modules/square.js').then((module) => { let square1 = new module.square(mycanvas.ctx, mycanvas.listid, 50, 50, 100, 'blue'); square1.draw(); square1.reportarea(); square1.reportperimeter(); }) }); note that, because the promise fulfillment returns a module object, the class is then made a subfea...
... we mentioned this before, but to reiterate: .js files need to be
loaded with a mime-type of text/javascript (or another javascript-compatible mime-type, but text/javascript is recommended), otherwise you'll get a strict mime type checking error like "the server responded with a non-javascript mime type".
background_color - Web app manifests
type string mandatory no the background_color member defines a placeholder background color for the application page to display before its stylesheet is
loaded.
... this value is used by the user agent to draw the background color of a shortcut when the manifest is available before the stylesheet has
loaded.
Web app manifests
unlike regular web apps with simple homescreen links or bookmarks, pwas can be down
loaded in advance and can work offline, as well as use regular web apis.
... the web app manifest provides information about a web application in a json text file, necessary for the web app to be down
loaded and be presented to the user similarly to a native app (e.g., be installed on the homescreen of a device, providing users with quicker access and a richer experience).
Critical rendering path - Web Performance
optimizing for crp improve page load speed by prioritizing which resources get
loaded, controlling the order in which they are
loaded, and reducing the file sizes of those resources.
... performance tips include 1) minimizing the number of critical resources by deferring their download, marking them as async, or eliminating them altogether, 2) optimizing the number of requests required along with the file size of each request, and 3) optimizing the order in which critical resources are
loaded by prioritizing the downloading critical assets, shorten the critical path length.
Web Performance
it can apply to a file, a file type, all files
loaded on a page, a specific metric (e.g.
...this could be a file
loaded later or link target a user tries to follow.
Making PWAs work offline with Service workers - Progressive web apps (PWAs)
lifecycle of a service worker when registration is complete, the sw.js file is automatically down
loaded, then installed, and finally activated.
...examples/js13kpwa/icons/icon-32.png', '/pwa-examples/js13kpwa/icons/icon-64.png', '/pwa-examples/js13kpwa/icons/icon-96.png', '/pwa-examples/js13kpwa/icons/icon-128.png', '/pwa-examples/js13kpwa/icons/icon-168.png', '/pwa-examples/js13kpwa/icons/icon-192.png', '/pwa-examples/js13kpwa/icons/icon-256.png', '/pwa-examples/js13kpwa/icons/icon-512.png' ]; next, the links to images to be
loaded along with the content from the data/games.js file are generated in the second array.
Using templates and slots - Web Components
ers can fill with their own markup, with the effect of composing different dom trees together.</span> <dl slot="attributes"> <dt>name</dt> <dd>the name of the slot.</dd> </dl> </element-details> <element-details> <span slot="element-name">template</span> <span slot="description">a mechanism for holding client- side content that is not to be rendered when a page is
loaded but may subsequently be instantiated during runtime using javascript.</span> </element-details> about that snippet, notice these points: the snippet has two instances of <element-details> elements which both use the slot attribute to reference the named slots "element-name" and "description" we put in the <element-details> shadow root .
... the effect of composing different dom trees together.</span> <dl slot="attributes"> <dt>name</dt> <dd>the name of the slot.</dd> </dl> </element-details> <element-details> <span slot="element-name">template</span> <span slot="description">a mechanism for holding client- side content that is not to be rendered when a page is
loaded but may subsequently be instantiated during runtime using javascript.</span> </element-details> <script> customelements.define('element-details', class extends htmlelement { constructor() { super(); const template = document .getelementbyid('element-details-template') .content; const shadowroot = this.attachs...
Advanced Example - XSLT: Extensible Stylesheet Language Transformations
the javascript loads the .xsl file only on the first sort and sets the xsl
loaded variable to true once it has finished loading the file.
... figure 7: sorting based on div contentview example // xhtml fragment: <div id="example"> <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div> <div>6</div> <div>7</div> <div>8</div> <div>9</div> <div>10</div> </div> // javascript var xslref; var xsl
loaded = false; var xsltprocessor = new xsltprocessor(); var mydom; var xmlref = document.implementation.createdocument("", "", null); function sort() { if (!xsl
loaded){ p = new xmlhttprequest(); p.open("get", "example2.xsl", false); p.send(null); xslref = p.responsexml; xsltprocessor.importstylesheet(xslref); xsl
loaded = true; } // create a new xml document in memory ...
WebAssembly Concepts - WebAssembly
an instance is like an es2015 module that has been
loaded into a particular global with a particular set of imports.
... since javascript has complete control over how webassembly code is down
loaded, compiled and run, javascript developers could even think of webassembly as just a javascript feature for efficiently generating high-performance functions.
Interacting with page scripts - Archive of obsolete content
by default, content scripts
loaded by add-ons and scripts
loaded by web pages are insulated from each other: content scripts can't interact directly with page scripts or access javascript objects they create page scripts can't interact directly with content scripts or access objects they create.
port - Archive of obsolete content
for example, to include an array of strings in the payload: // main.js var pagemods = require("sdk/page-mod"); var self = require("sdk/self"); var pagemod = pagemods.pagemod({ include: ['*'], contentscriptfile: self.data.url("content-script.js"), onattach: setuplistener }); function setuplistener(worker) { worker.port.on('
loaded', function(pageinfo) { console.log(pageinfo[0]); console.log(pageinfo[1]); }); } //content-script.js self.port.emit('
loaded', [ document.location.tostring(), document.title ]); ...
Communicating using "port" - Archive of obsolete content
for example, to include an array of strings in the payload: var pagemodscript = "self.port.emit('
loaded'," + " [" + " document.location.tostring()," + " document.title" + " ]" + ");" var pagemod = require('page-mod').pagemod({ include: ['*'], contentscript: pagemodscript, onattach: function(worker) { worker.port.on('
loaded', function(pageinfo) { console.log(pageinfo[0]); co...
addon-page - Archive of obsolete content
after this, the page
loaded from "data/index.html" will not contain navigational elements: var addontab = require("sdk/addon-page"); var data = require("sdk/self").data; require("sdk/tabs").open(data.url("index.html")); this only affects the page at "data/index.html": all other pages are displayed normally.
context-menu - Archive of obsolete content
when the context menu is first shown and all of the declarative contexts for your item are current) and then remains active until you destroy your context menu item or the page is un
loaded.
self - Archive of obsolete content
loadreason this property contains of the following strings describing the reason your add-on was
loaded: install enable startup upgrade downgrade isprivatebrowsingsupported this property indicates whether or not the add-on supports private browsing.
jpm - Archive of obsolete content
here are some possible outcomes of running the sign command: your add-on passed validation, was signed by mozilla, and a new signed xpi was down
loaded to your working directory.
Creating annotations - Archive of obsolete content
data.url('selector.js')], onattach: function(worker) { worker.postmessage(annotatorison); selectors.push(worker); worker.port.on('show', function(data) { console.log(data); }); worker.on('detach', function () { detachworker(this, selectors); }); } }); make sure the name you use to load jquery matches the name of the jquery version you down
loaded.
Storing annotations - Archive of obsolete content
, data.url('list/annotation-list.js')], contentscriptwhen: 'ready', onshow: function() { this.postmessage(simplestorage.storage.annotations); }, onmessage: function(message) { require('sdk/tabs').open(message); } }); since this panel's content script uses jquery we will pass that in too: again, make sure the name of it matches the version of jquery you down
loaded.
Bookmarks - Archive of obsolete content
id, aproperty, aisannotationproperty, avalue) { myextension.dosomething(); }, onitemvisited: function(abookmarkid, avisitid, time) {}, onitemmoved: function(aitemid, aoldparent, aoldindex, anewparent, anewindex) {}, queryinterface: xpcomutils.generateqi([components.interfaces.nsinavbookmarkobserver]) }; // an extension var myextension = { // this function is called when my add-on is
loaded onload: function() { bmsvc.addobserver(myext_bookmarklistener, false); }, // this function is called when my add-on is un
loaded onunload: function() { bmsvc.removeobserver(myext_bookmarklistener); }, dosomething: function() { alert("did something."); } }; see also nsinavbookmarksservice nsinavbookmarkobserver places using xpcom without chrome - bookmark observer ...
Page Loading - Archive of obsolete content
page loading on page load how to execute code each time a new page is
loaded in browser/mail progress listeners progress listeners allow extensions to be notified of events associated with documents loading in the browser and with tab switching events.
Common Pitfalls - Archive of obsolete content
how to do security checks for uri loads before loading a uri, one of two security checks needs to be performed: if the uri is a string that will be
loaded via passing the string to nsiwebnavigation::loaduri, the one must call checkloaduristrwithprincipal and pass the principal that the uri originates from as the first argument and the uri string as the second argument.
Communication between HTML and your extension - Archive of obsolete content
ajax request, i created and dispatched the event like this: var event = document.createevent("events"); event.initevent("my-custom-event", true, true); document.body.dispatchevent(event); in the code of the extension that catches the loading of a new page i added this code: var doc = aevent.originaltarget; // doc is document that triggered "onload" event // do something with the
loaded page.
Inline options - Archive of obsolete content
you can't do this until your options xul has been
loaded into the add-on manager window, so you should listen for the addon-options-displayed notification to initialize your settings.
Firefox addons developer guide - Archive of obsolete content
the stuff about installing the dom inspector (https://developer.mozilla.org/en/firefox_addons_developer_guide/let%27s_build_a_firefox_extension#install_the_dom_inspector) is not accurate for firefox 3 or later, since it's no longer included in the firefox installer and must be down
loaded from amo.
updateready - Archive of obsolete content
the updateready event is fired when the resources listed in the application cache manifest have been newly redown
loaded, and the script can use swapcache() to switch to the new cache.
Index of archived content - Archive of obsolete content
ation extensions faq hostwindow installer scripting styling proxy ui pydom rdf api rdf datasource how-to reading textual data remote xul remote debugging rsyncing the cvs repository running windows debug builds down
loaded from tinderbox sxsw 2007 presentations safe browsing safe browsing: design documentation safely loading uris same origin policy for xbl space manager detailed design space manager high level design standalone xpcom standard makefile header static analysis for windows code under linux stre...
JXON - Archive of obsolete content
vvalue : new vvalue.constructor(vvalue); } var atmpels = []; //
loaded element nodes cache function getjxontree (oxmlparent) { var sprop, vcontent, vresult, nlength = 0, nlevelstart = atmpels.length, nchildren = oxmlparent.haschildnodes() ?
MCD, Mission Control Desktop, AKA AutoConfig - Archive of obsolete content
been compiled?) about:buildconfig build platform target i686-pc-linux-gnu build tools compiler version compiler flags gcc gcc version 3.4.3 20050227 (red hat 3.4.3-22.fc3) -wall -w -wno-unused -wpointer-arith -wcast-align -wno-long-long -pedantic -pthread -pipe c++ gcc version 3.4.3 20050227 (red hat 3.4.3-22.fc3) -fno-rtti -fno-exceptions -wall -wconversion -wpointer-arith -wcast-align -wover
loaded-virtual -wsynth -wno-ctor-dtor-privacy -wno-non-virtual-dtor -wno-long-long -pedantic -fshort-wchar -pthread -pipe -i/usr/x11r6/include configure arguments --disable-mailnews --enable-extensions=cookie,xml-rpc,xmlextras,pref,transformiix,universalchardet,webservices,inspector,gnomevfs,negotiateauth --enable-crypto --disable-composer --enable-single-profile --disable-profilesharing --with-system-...
Automated testing tips and tricks - Archive of obsolete content
.js how to execute test code with chrome privileges using a chrome doc - see sbtests.xul in http://people.mozilla.com/~davel/scripts/ for an example firefox-bin -p sbtestprofile -chrome chrome://sbtests/content/ above code calls the quit function in quit.js to exit after test is finished how to detect content onload event from chrome use the domcontent
loaded event chromewindow.addeventlistener('domcontent
loaded',callbackfunction,false); ...
Block and Line Layout Cheat Sheet - Archive of obsolete content
ns_frame_external_reference ns_frame_replaced_element ns_frame_generated_content ns_frame_has_
loaded_images ns_frame_out_of_flow ns_frame_selected_content ns_frame_is_dirty ns_frame_is_unflowable an unflowable frame is an error condition; for example, due to system limitations.
Using microformats - Archive of obsolete content
to use the api, you need to first load the object: components.utils.import("resource://gre/modules/microformats.js"); once you've
loaded the microformats api, you can manage microformats using the methods listed here; for information about parsing microformats, see parsing microformats in javascript.
Java in Firefox Extensions - Archive of obsolete content
the following is a somewhat simplified snippet from xquseme: var reflect = java.lang.reflect; // build an array of the class types which are expected by our constructor (in this case, java.io.file and a class from another jar we
loaded, com.sleepycat.db.environmentconfig) var paramtypes = reflect.array.newinstance(java.lang.class, 2); // 2nd argument should indicate the number of items in following array paramtypes[0] = java.io.file; var envconfigclass = loader.loadclass('com.sleepycat.db.environmentconfig'); paramtypes[1] = envconfigclass; // get the constructor var constructor = envclass.getconstructor(paramtypes); // now tha...
Basics - Archive of obsolete content
cusedstringtostringstringpopstringpushstringreversestringshiftstringsortstringsplicestringunshiftstring)this is some default text lengththe number of open tabsstring focusedthe current tab in your browserstring tostringstuffstring popstuffstring pushstuffstring reversestuffstring shiftstuffstring sortstuffstring splicestuffstring unshiftstuffstring onready()when the inherited document is fully
loaded.
slideBar - Archive of obsolete content
slidebaruri htmlhtml content for the featurehtml/xml urlurl to load content for the featureuri widthwidth of the content area and the selected slide sizeint persistdefault slide behavior when being selectedbool autoreloadautomatically reload content on selectbool onclickcallback when the icon is clickedfunction onselectcallback when the feature is selectedfunction onreadycallback when featured is
loadedfunction an example: jetpack.slidebar.append({ url: "http://mozilla.com", width: 150, onclick: function(slide){ slide.icon.src = "chrome://branding/content/icon48.png"; }}); ...
Metro browser chrome tests - Archive of obsolete content
a simple test looks like this: gtests.push({ desc: "test loading about:blank", setup: function () { }, teardown: function () { }, run: function () { yield addtab("about:blank"); is(tab.browser.currenturi.spec, "about:blank", "about:blank is
loaded"); } }); function test() { runtests(); } gtests contains individual tests that make up the library of tests your test file will contain.
Microsummary topics - Archive of obsolete content
note: when web sites install generators via window.sidebar.addmicrosummarygenerator(), firefox sets their uri attribute to urn:source:sourceurl, where sourceurl is the url from which the generator was down
loaded.
Supporting per-window private browsing - Archive of obsolete content
var channel = services.io.newchannel("http://example.org", null, null); channel.queryinterface(components.interfaces.nsiprivatebrowsingchannel); channel.setprivate(true); // force the channel to be
loaded in private mode similarly, xmlhttprequest objects created via createinstance(ci.nsixmlhttprequest) will often require explicit adjustment, since they have no context from which to derive a privacy status.
Table Layout Regression Tests - Archive of obsolete content
execute the baseline test shutdown the layoutdebugger execute mozilla -layoutdebug - p foo >selftest.txt execute the verify test make a note which tests have failed grep 'failed' selftest.txt (these are false positives, quite frequently they indicate reflow problems, pages showing differently when
loaded from cache) make your changes to the source, recompile.
Tamarin Build System Documentation - Archive of obsolete content
; cd scripts edit environment.sh, change the basedir and buildsdir settings (around line 51) basedir=~/hg/tamarin-redux (path to my test repository) (next line) buildsdir=~/hg/builds (a directory to store down
loaded builds) always set current working directory to the scripts directory when running a script run a script (e.g.) ../all/run-acceptance-release.sh <optional hg revision number like 1902> how do i navigate the build status page?
When To Use ifdefs - Archive of obsolete content
the only time when they might be a problem is in cross-platform extension code and locales: since this code is down
loaded on multiple platforms, platform-specific ifdefs are generally out of the question.
Install Wizards (aka: Stub Installers) - Archive of obsolete content
it then proceeds to extract the xpinstall engine and feed it the down
loaded software packages to install.) the stub installer code includes: the logic to display the install wizard widgets and dialogs the code that reads in the configuration file (config.ini) and dynamically installs from the net or from local xpi modules found next to the installer binary the code that processes user selections the code that calls the xpinstall engine through xpistub the libxpnet...
Install script template - Archive of obsolete content
l error values used by the cycore developers (www.cycore.com) who helped make this install script var exceptionoccurederror = -4711; var winregisnullerror = -4712; var invalidrootkeyerror = -4713; var registrykeynotwritableerror = -4714; //initinstall block //the installation is initialized here -- if we fail here, cancel the installation // initinstall is quite an over
loaded method, but i have invoked it here with three strings // which are globally defined err = initinstall(software_name, plid, version); if (err != 0) { // call initinstall again in case illegal characters in plid err = initinstall(software_name, software_name, version); if (err != 0) cancelinstall(err); } //addfiles to current browser block var pluginsfolder = getfolder("plugins"); //v...
Learn XPI Installer Scripting by Example - Archive of obsolete content
ation appears in theinstall.js file as follows: if (err==success) { err = performinstall(); logcomment("performinstall() returned: " + err); } else { cancelinstall(err); logcomment("cancelinstall() due to error: " + err); } } else cancelinstall(insufficient_disk_space); performinstall is the function used to execute the install once it has been initialized and
loaded, and it is the last step to installing the software.
disablefastfind - Archive of obsolete content
« xul reference homedisablefastfindtype: booleanput disablefastfind="true" on the root element of a xul document, which is intended to be
loaded in a tab, to disable the find bar for the tab with this document.
Building accessible custom components in XUL - Archive of obsolete content
if (!gfocuscell) { gfocuscell = e.target.getelementsbytagname('label')[0]; } gfocuscell.focus(); } else { gfocuscell = e.target; } } function spreadsheet_click(e) { e.target.focus(); } </code> finally, we'll add two lines to our .xul file to link in the javascript file (accjax.js) and call the install_handlers function when the spreadsheet is
loaded.
Mozilla.dev.apps.firefox-2006-09-29 - Archive of obsolete content
eltnzer announced that 'users running the bon echo 20060921 nightly build will be offered the chance to upgrade to a "new version"' firefox start up performance boris zbarsky recently performed some profiling of firefox's start up - these are some of the details discussions problem handling dmg files on mac discussion about why sometimes dmg files are not mounted correctly after they are down
loaded.
2006-09-29 - Archive of obsolete content
eltnzer announced that 'users running the bon echo 20060921 nightly build will be offered the chance to upgrade to a "new version"' firefox start up performance boris zbarsky recently performed some profiling of firefox's start up - these are some of the details discussions problem handling dmg files on mac discussion about why sometimes dmg files are not mounted correctly after they are down
loaded.
2006-10-20 - Archive of obsolete content
question regarding how to make a firefox extension that would insert an image next to all links in the
loaded web pages similar to the mcafee siteadvisor extension.
2006-11-10 - Archive of obsolete content
build problem firefox 2.0 on fc3 november 10th: vin down
loaded the latest firefox 2 rc3 and tried to build it on fc3 with the following options: ./configure --enable-application=browser --prefix=$prefix --enable-extensions=default,spatialnavigation then he tried running "make" and received the following error: /usr/bin/ld: testtarray.o(.text+0x2237): unresolvable relocation against symbol `nstarray_base::semptyhdr' /usr/bin/ld: final link failed: nonr...
2006-11-17 - Archive of obsolete content
summary: mozilla.dev.l10n - november 17, 2006 announcements seamonkey 1.1b in russian (ru-ru) seamonkey 1.1b in russian (ru-ru) is up
loaded to ftp.mozilla.org seamonkey 1.0.6 in russian (ru-ru) seamonkey 1.0.6 in russian (ru-ru) is up
loaded to ftp.mozilla.org seamonkey 1.0.6 in czech (cs-cz) seamonkey 1.0.6 in czech (cs-cz) is up
loaded to ftp.mozilla.org seamonkey 1.0.6 he-il seamonkey 1.0.6 he-il is released.
The First Install Problem - Archive of obsolete content
(note that the file name must still begin with "np", just as it must when the file is
loaded from the .\plugins directory.) example: [hkey_local_machine\software\mozillaplugins\@mycompany.com/myapplication,version=5.01] path=c:\mycompany\myapplication\netscape\npmyapp.dll "xptpath" -- string value -- absolute path to xpt module required for scripting plug-in, if applicable example: [hkey_local_machine\software\mozillaplugins\@mycompany.com/mya...
LiveConnect - Archive of obsolete content
old liveconnect documents, broken links: java method overloading and liveconnect 3 the technique that liveconnect uses to invoke over
loaded java methods from javascript.
XQuery - Archive of obsolete content
xquseme is a working proof-of-concept (so far tested on windows and linux with java installed; mac does not work) extension which allows one to perform xqueries on external urls, the currently
loaded webpage (even if originally from poorly formed html), and/or xml (including well-formed xhtml) documents stored locally.
Building up a basic demo with PlayCanvas editor - Game development
as you can see, the file contains some boilerplate code already: pc.script.create('boxanimation', function (app) { // creates a new boxanimation instance var boxanimation = function (entity) { this.entity = entity; }; boxanimation.prototype = { // called once after all resources are
loaded and before the first update initialize: function () { }, // called every frame, dt is time in seconds since last update update: function (dt) { } }; return boxanimation; }); the most interesting part is the update() function, which is where we can put any code that we want repeated on every frame.
Constructor - MDN Web Docs Glossary: Definitions of Web-related terms
syntax // this is a generic default constructor class default function default() { } // this is an over
loaded constructor class over
loaded // with parameter arguments function over
loaded(arg1, arg2, ...,argn){ } to call the constructor of the class in javascript, use a new operator to assign a new object reference to a variable.
First input delay - MDN Web Docs Glossary: Definitions of Web-related terms
the time between when content is painted to the page and when all the functionality becomes responsive to human interaction often varies based on the the size and complexity of the javascript needing to be down
loaded, parsed, and executed on the main thread, and on the device speed or lack thereof (think low end mobile devices).
Function - MDN Web Docs Glossary: Definitions of Web-related terms
function loop(x) { if (x >= 10) return; loop(x + 1); }; //using ecmascript 2015 arrow notation const loop = x => { if (x >= 10) return; loop(x + 1); }; an immediately invoked function expressions (iife) is a function that is called directly after the function is
loaded into the browser’s compiler.
Organizing your CSS - Learn web development
so for example, with partials, you could have several style files inside a directory, say foundation/_code.scss, foundation/_lists.scss, foundation/_footer.scss, foundation/_links.scss, etc., then use the sass @use role to load them into other stylesheets: // foundation/_index.sass @use 'code' @use 'lists' @use 'footer' @use 'links' if the partials are all
loaded into an index file, as implied above, you can then load that entire directory into another stylesheet in one go: // style.sass @use 'foundation' note: a simple way to try out sass is to use codepen — you can enable sass for your css in the settings for a pen, and codepen will then run the sass parser for you, in order that you can see the resulting webpage with regular css applied.
Styling links - Learn web development
this is because if the real links were included, clicking on them would break the examples (you'd end up with an error, or a page
loaded in the embedded example that you couldn't get back from.) # just links to the current page.
HTML forms in legacy browsers - Learn web development
here is an example: modernizr.load({ // this tests if your browser supports the html5 form validation api test : modernizr.formvalidation, // if the browser does not support it, the following polyfill is
loaded nope : form-validation-api-polyfill.js, // in any case, your core app file that depends on that api is
loaded both : app.js, // once both files are
loaded, this function is called in order to initialize the app.
Other form controls - Learn web development
<progress max="100" value="75">75/100</progress> this is for implementing anything requiring progress reporting, such as the percentage of total files down
loaded, or the number of questions filled in on a questionnaire.
Styling web forms - Learn web development
if the fontsquirrel output was different to what we described above, you can find the correct @font-face blocks inside your down
loaded webfont kit, in the stylesheet.css file (you'll need to replace the below @font-face blocks with them, and update the paths to the font files): @font-face { font-family: 'handwriting'; src: url('fonts/journal-webfont.woff2') format('woff2'), url('fonts/journal-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'typewr...
How the Web works - Learn web development
when a client device wants to access a webpage, a copy of the webpage is down
loaded from the server onto the client machine to be displayed in the user's web browser.
Use JavaScript within a webpage - Learn web development
<script> window.addeventlistener('load', function () { console.log('this function is executed once the page is fully
loaded'); }); </script> that's convenient when you just need a small bit of javascript, but if you keep javascript in separate files you'll find it easier to focus on your work write self-sufficient html write structured javascript applications use scripting accessibly accessibility is a major issue in any software development.
Images in HTML - Learn web development
but if the image isn't being displayed, for example, the user has just navigated to the page, and the image hasn't yet
loaded, you'll notice the browser is leaving a space for the image to appear in: this is a good thing to do, resulting in the page loading quicker and more smoothly.
Introduction to events - Learn web development
in the case of the web, events are fired inside the browser window, and tend to be attached to a specific item that resides in it — this might be a single element, set of elements, the html document
loaded in the current tab, or the entire browser window.
Working with JSON - Learn web development
ne wilson", "powers": [ "million tonne punch", "damage resistance", "superhuman reflexes" ] }, { "name": "eternal flame", "age": 1000000, "secretidentity": "unknown", "powers": [ "immortality", "heat immunity", "inferno", "teleportation", "interdimensional travel" ] } ] } if we
loaded this object into a javascript program, parsed in a variable called superheroes for example, we could then access the data inside it using the same dot/bracket notation we looked at in the javascript object basics article.
Object-oriented JavaScript for beginners - Learn web development
with your finished exercise from the previous sections
loaded in the browser, try this in your javascript console: let person2 = object.create(person1); now try these: person2.name; person2.greeting(); you'll see that person2 has been created based on person1—it has the same properties and method available to it.
Test your skills: JSON - Learn web development
the json is
loaded into the page as a text string and made available in the catstring parameter of the displaycatinfo() function, called when the provided promise chain (which starts by fetching the json data) is fulfilled.
Client-side tooling overview - Learn web development
bundlers/packagers these are tools that get your code ready for production, for example by “tree-shaking” to make sure only the parts of your code libraries that you are actually using are put into your final production code, or "minifying" to remove all the whitespace in your production code, making it as small as possible before it is up
loaded to a server.
Embedding API for Accessibility
accepting special content on an instance basis after being notified of special content, the user needs to be able to select specific un
loaded content for loading.
Links and Resources
this html advanced validator may also be down
loaded from firefox add-ons: html validator.
Mozilla’s UAAG evaluation report
(p1) g preferences, advanced, scripts & windows - enable javascript for when toggled off, we don't notify the user when a page is
loaded with scripts 3.5 toggle content refresh.
Command line options
-safe-mode launches the application with all extensions disabled, for that launch only (extensions are not
loaded, but are not permanently disabled in the extension manager data source).
Creating a Language Pack
$ make wget-en-us en_us_binary_url=http://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/latest-mozilla-aurora if you're building on mac 64 bit, you'll need to change the command slightly: $ make wget-en-us en_us_binary_url=http://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/latest-mozilla-aurora moz_pkg_platform=mac at some point, you should see the following success message: down
loaded http://ftp.mozilla.org/pub/mozilla.o....en-us.mac.dmg to /users/your_id/mozilla/vc/firefox/browser/locales/../../dist/firefox-3.6b5pre.en-us.mac.dmg the en-us binary has been down
loaded.
Creating Sandboxed HTTP Connections
for cookies, the two topics are: http-on-modify-request - happens after the cookie data has been
loaded into the request, but before the request is sent.
HTTP logging
other bugs may require all the logs to be up
loaded--ask the developer if you're not sure.
Simple Thunderbird build
note that the down
loaded outlook 2010 mapi header files contain 18 fies, of which only 17 are needed.
ESLint
my script is a frame-script, or includes items that
loaded into content scripts: add a line to tell eslint to use the frame-script environment: /* eslint-env mozilla/frame-script */ my script is a worker: add a line to tell eslint to use the worker environment: /* eslint-env worker */ or, to use a chrome worker environment: /* eslint-env mozilla/chrome-worker */ my file u...
Eclipse CDT
if you've down
loaded an eclipse developer build then you can use eclipse's software update mechanism to update your developer snapshot to the latest nightly for that developer branch.
Index
in private browsing windows (tabs, in firefox for android), firefox will block content
loaded from domains that track users across sites.
Multiple Firefox profiles
windows in windows, the developer and nightly builds get their own directory in the "programs" folder, so you don't have to worry about where to store the down
loaded files.
Site Identity Button
y looking in the web console in the firefox developer tools: ensure your web console is displaying messages in the 'security' category force-refresh the page on your site that is causing problems watch for any security messages that may appear a downgraded security ui will be due to one of these three problems: mixed content - while your page has been served over tls, but subresources
loaded for your page have not.
mozbrowsercaretstatechanged
the mozbrowsercaretstatechanged event is fired when the user selects content in a page
loaded in a browser <iframe>.
mozbrowsermanifestchange
the mozbrowsermanifestchange event is fired when the manifest location of the app
loaded in the browser <iframe> changes.
mozbrowseropentab
details the details property returns an anonymous javascript object with the following properties: url a domstring representing the url of the new document
loaded.
mozbrowseropenwindow
details the details property returns an anonymous javascript object with the following properties: url a domstring representing the url of the document
loaded within the frameelement property.
Embedding the editor
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>).
Gecko SDK
issues with the os x sdk if you need to use the xpidl utility to compile idl files on os x, it's likely that you will receive a strange error when running the tool that looks something along the lines of this: dyld: library not
loaded: /opt/local/lib/libintl.3.dylib referenced from: /users/varmaa/xulrunner-sdk/bin/./xpidl reason: image not found trace/bpt trap unfortunately, this is caused by a problem with the sdk build process which cannot currently be resolved (see bugzilla bug #430274).
Addon
for an add-on that has not yet been down
loaded, this may be an estimated value.
AddonInstall
this may be null if the add-on is coming from the internet and has yet to be down
loaded.
UpdateInfo
updateurl string the updateurl that the update can be down
loaded from.
Add-on Manager
any available update is returned as an addoninstall which is ready to be down
loaded and installed.
CustomizableUI.jsm
onwidgetinstanceremoved(awidgetid, adocument) fired when a window is un
loaded and a widget's instance is destroyed because of this.
DownloadList
this method finalizes each removed download, ensuring that any partially down
loaded data associated with it is also removed.
Examples
http://www.mozilla.org/media/img/firefox/favicon.png', 'https://developer.cdn.mozilla.net/media/redesign/img/favicon32.png']; [].foreach.call(imagepaths, function(path) { let myimage = new image(); let loadthisimagepromise = promise.defer(); mysubpromises.push(loadthisimagepromise.promise); myimage.onload = function() { loadthisimagepromise.resolve('succesfully
loaded image at path = "' + path + '" the width of this image is = "' + this.naturalwidth + '".'); if (!this.naturalwidth) { loadthisimagepromise.reject('image
loaded but it has 0 width at path = "' + path + '" the naturalwidth was 0'); } } myimage.onerror = function(e) { loadthisimagepromise.reject('an error occured while loading path = "' + path + '".
source-editor.jsm
acallback a function that will be called when the editor has been fully
loaded and initialized.
JavaScript code modules
xpcomutils.jsm contains utilities for javascript components
loaded by the js component loader.
Localizing without a specialized tool
(read more about tools at l10n:tools.) after you have down
loaded your editor of choice, type the following command in the same path from above (l10n-mozilla-1.9.2/x-testing/browser/chrome/browser) $ edit l10n-mozilla-1.9.2/x-testing/browser/chrome/browser/aboutcerterror.dtd read the top of the file to get any context on how to translate contained in the notes written by the developers or l10n-drivers.
Localization formats
for example, below is the entire introduction used for a certificate that was presented to those who down
loaded firefox during the download day campaign.
DMD
first, you will need to push the libdmd.so library to the device so that it can by dynamically
loaded by fennec.
Profiling with the Firefox Profiler
symbols for try builds are not up
loaded to the symbol server automatically, you need to trigger a "sym" job on treeherder: using treeherder's add new jobs ui, schedule a "sym" job for each platform whose "b" job you want symbols for.
Reporting a Performance Problem
once up
loaded, copy permalink url to your clipboard by right clicking and add the profile url to a bug for your performance problem and/or send it to the appropriate person.
Phishing: a short definition
after all, the browser plays an essential role in the scheme: a fake website is
loaded in a browser and here is the maker’s last chance to preventing fraud.
nglayout.debug.disable_xul_cache
during development of xul applications, it’s convenient to disable the xul cache so that changes you make to files on disk take effect the next time the window or dialog is
loaded (instead of the next time mozilla starts).
Preferences system
ui elements that refer to the preferences above, e.g.: <checkbox id="check1" preference="pref1" label="&check1.label;" accesskey="&check1.accesskey;"/> </prefpane> <prefpane id="pane2" label="&pane2.title;" src="chrome://uri/to/pane.xul"/> </prefwindow> pane content can be specified inline or an external chrome uri supplied for pane content to be
loaded in via a dynamic overlay.
Debugging out-of-memory problems
by the time about:memory is
loaded in a new tab and you have clicked the "measure" button to diagnose what's happened, the memory usage causing the spike has gone away, making temporary memory spikes difficult to diagnose.
Emscripten techniques
by the time about:memory is
loaded in a new tab and you have clicked the "measure" button to diagnose what's happened, the memory usage causing the spike has gone away, making temporary memory spikes difficult to diagnose.
Dynamic Library Linking
it also provides a method by which to condition symbols of statically linked code so that to other clients it appears as though they are dynamically
loaded.
PL_HashTableAdd
it doubles the number of buckets if the table is over
loaded.
PL_HashTableRemove
if the table is under
loaded, pl_hashtableremove also shrinks the number of buckets by half.
PR_Connect
if pr_connect is invoked on a udp socket, it has an over
loaded meaning: pr_connect merely saves the specified address as the default peer address for the socket, so that subsequently one can send and receive datagrams from the socket using pr_send and pr_recv instead of the usual pr_sendto and pr_recvfrom.
PR_GetLibraryName
the constructed path name refers to the actual dynamically
loaded library.
PR_LoadLibrary
syntax #include <prlink.h> prlibrary* pr_loadlibrary(const char *name); parameters the function has this parameter: name a platform-dependent character array that names the library to be
loaded, as returned by pr_getlibraryname.
Running NSPR tests
since none of our operating systems is a real-time os, such test programs may fail when the test machine is heavily
loaded.
Introduction to Network Security Services
platform for 32-bit cpus for 64-bit cpus solaris/sparc libfreebl_pure32_3.so libfreebl_hybrid_3.so hpux/parisc libfreebl_pure32_3.sl libfreebl_hybrid_3.sl aix (planned for a future release) libfreebl_pure32_3_shr.a libfreebl_hybrid_3_shr.a an application should not link against these libraries, because they are dynamically
loaded by nss at run time.
JSS
read using jss to get you started with development after you've built and down
loaded it.
NSS 3.14.2 release notes
bug 816853 - when using libpkix for certificate validation, applications may now supply additional application-defined trust anchors to be used in addition to those from
loaded security tokens, rather than as an alternative to.
NSS 3.14 release notes
nss 3.14 source tarballs can be down
loaded from https://ftp.mozilla.org/pub/mozilla.org/security/nss/releases/nss_3_14_rtm/src/.
NSS 3.18 release notes
a pkcs#11 library that contains root ca certificates can be
loaded by tstclnt, which may either be the nssckbi library provided by nss (-b) or another compatible library (-r).
NSS Sample Code Sample1
eypublickey **pubkey); int wrapkey(pk11symkey *key, seckeypublickey *pubkey, secitem **data); // export raw key (unwrapped) do not use int rawexportkey(pk11symkey *key, secitem **data); char *mservername; // these items represent data that might be stored // in files or in a configuration file secitem *mwrappedenckey; secitem *mwrappedmackey; // these are the runtime keys as
loaded from the files pk11symkey *menckey; pk11symkey *mmackey; }; server::server(const char *servername) : mservername(0), mwrappedenckey(0), mwrappedmackey(0), menckey(0), mmackey(0) { // copy the server name mservername = pl_strdup(servername); } server::~server() { if (mservername) pl_strfree(mservername); if (mwrappedenckey) secitem_freeitem(mwrappedenckey, pr_true); if (mwrappedm...
NSS Third-Party Code
compiled in sqlite [/lib/sqlite] berkleydb [/lib/dbm] zlib [/lib/zlib] libjar [/lib/jar] fiat-crypto, ring [lib/freebl/ecl] used for tests gtest [/gtests] down
loaded by certain test tooling tlsfuzzer [/tests/tlsfuzzer] bogo tests [/tests/bogo] boringssl, openssl [/tests/interop] ...
PKCS11 Implement
if a certificate is
loaded, the value of the certificate's cka_id attribute must match the value of the cka_id attribute for the corresponding private key, and the value of the certificate's cka_label attribute must also match the value of the cka_label attribute for the private key.
Python binding for NSS
certificate() constructor signature changed from certificate(data=none, der_is_signed=true) to certificate(data, certdb=cert_get_default_certdb(), perm=false, nickname=none) this change was necessary because all certs should be added to the nss temporary database when they are
loaded, but earlier code failed to to that.
NSS environment variables
nss_memory_allocation 3.4 nss_disable_unload string (any non-empty value) disable unloading of dynamically
loaded nss shared libraries during shutdown.
NSS tools : certutil
* if there are multiple security devices
loaded, then the -h tokenname argument can search a specific token or all tokens.
sslerr.html
sec_error_duplicate_cert_name -8169 down
loaded certificate's name duplicates one already in your database.
certutil
o if there are multiple security devices
loaded, then the -h tokenname argument can search a specific token or all tokens.
Network Security Services
pkcs #11 information documentation on pkcs #11 modules implementing pkcs #11 for nss the strings nss uses to load pkcs #11 modules pkcs #11 faq using the jar installation manager to install a pkcs #11 cryptographic module pkcs #11 conformance testing - archived version ca certificates pre-
loaded into nss mozilla ca certificate policy list of pre-
loaded ca certificates consumers of this list must consider the trust bit setting for each included root certificate.
Necko Architecture
necko has been designed to accommodate pluggable protocols so developers can contribute their own protocol libraries that can be dynamically
loaded and used by applications utilizing necko.
Necko Interfaces Overview
tp) maps uri string to nsiuri instance via newuri method creates nsichannel instance from nsiuri instance via newchannel method nsistreamlistener : nsirequestobserver implemented by the consumer of a nsichannel instance passed to nsichannel::asyncopen method nsirequestobserver::onstartrequest - notifies start of async download nsistreamlistener::ondataavailable - notifies presence of down
loaded data nsirequestobserver::onstoprequest - notifies completion of async download, possibly w/ error nsiloadgroup : nsirequest attribute of a nsirequest channel impl adds itself to its load group during invocation of asyncopen channel impl removes itself from its load group when download completes load groups in gecko own all channels used to load a particular page (until the channels comple...
Rhino Debugger
the
loaded script will be run in a new thread and control will be given to the debugger on its first instruction.
Rhino history
the classfile generation code was moved to an optional, dynamically-
loaded package.
Rhino JavaScript compiler
the resulting java class files can then be
loaded and executed at another time, providing a convenient method for transferring javascript, and for avoiding translation cost.
Rhino overview
when the class was defined and
loaded, the appropriate security domain was associated with it, and can be retrieved by calling this method.
Shumway
once your flash content is
loaded, you can see how shumway manages it in detail.
Creating JavaScript tests
these tests will also show up as infrequent oranges on our heavily
loaded test machines, lowering the value of our test suite for everyone.
Hacking Tips
u came from with the following set of gdb commands: (gdb) record full (gdb) si (gdb) record goto 0 (gdb) record stop if you have a core file, you can use the gdb unwinder the same way, or do everything from the command line as follow: $ gdb -ex 'enable unwinder .* spidermonkey' -ex 'bt 0' -ex 'thread apply all backtrace' -ex 'quit' out/dist/bin/js corefile the gdb unwinder is supposed to be
loaded by dist/bin/js-gdb.py and load python scripts which are located in js/src/gdb/mozilla under gdb.
Index
that will open a small window in the bottom left with a line like "artifact up
loaded: mozjs-57.0.1.tar.bz2".
Functions
but a with block can: function f(s) { eval(s); print(s); // s can be
loaded with getarg with (obj) { print(s); // no getarg here; s might refer to obj.s } } upvar instructions.
JSClass.flags
it results in finalization work being off
loaded to another thread which improves performance.
JSObjectOps.lookupProperty
the jsobjectops.lookupproperty callback is called for every property access (except when a higher-level callback, such as jsobjectops.getproperty, is over
loaded in a way that does not call lookupproperty).
SpiderMonkey 52
that will open a small window in the bottom left with a line like "artifact up
loaded:mozjs-52.x.y.tar.bz2".
SpiderMonkey releases
that will open a small window in the bottom left with a line like "artifact up
loaded: mozjs-57.0.1.tar.bz2".
WebReplayRoadmap
recordings can be up
loaded, and cloud services can locate the correct build and os needed to replay them.
Setting up an update server
<?xml version="1.0" encoding="utf-8"?> <updates> <update type="minor" displayversion="2000.0a1" appversion="2000.0a1" platformversion="2000.0a1" buildid="21181002100236"> <patch type="complete" url="http://127.0.0.1:8000/<mar name>" hashfunction="sha512" hashvalue="<hash>" size="<size>"/> </update> </updates> if you've down
loaded the mar you're using, you'll find the sha512 value in a file called sha512sums in the root of the release directory on archive.mozilla.org for a release or beta build (you'll have to search it for the file name of your mar, since it includes the sha512 for every file that's part of that release), and for a nightly build you'll find a file with a .checksums extension adjacent to your mar that cont...
Gecko events
is supported: yes event_document_reload the document contents are being re
loaded.
Manipulating bookmarks using Places
id, aproperty, aisannotationproperty, avalue) { myextension.dosomething(); }, onitemvisited: function(abookmarkid, avisitid, time) {}, onitemmoved: function(aitemid, aoldparent, aoldindex, anewparent, anewindex) {}, queryinterface: xpcomutils.generateqi([components.interfaces.nsinavbookmarkobserver]) }; // an extension var myextension = { // this function is called when my add-on is
loaded onload: function() { bmsvc.addobserver(myext_bookmarklistener, false); }, // this function is called when my add-on is un
loaded onunload: function() { bmsvc.removeobserver(myext_bookmarklistener); }, dosomething: function() { alert("did something."); } }; see also nsinavbookmarksservice nsinavbookmarkobserver places using xpcom without chrome - bookmark observer ...
Using the Places annotation service
uri's are easier to use for services that want to annotate a web page
loaded in the browser, while id's are easier to use for services already working with the places database.
Using the Places favicon service
the expiration time is only used to determine whether data should be re
loaded from the network (or cache) or whether the version in the database is fresh enough.
FUEL
cts extiapplication objects extiapplication exticonsole extieventitem extieventlistener extievents extiextension extiextensions extipreference extipreferencebranch extisessionstorage fueliapplication objects fueliannotations fueliapplication fuelibookmark fuelibookmarkfolder fuelibookmarkroots fuelibrowsertab fueliwindow xpcom although the fuel application object is pre
loaded into xul scripts, it is not pre
loaded into javascript xpcom code.
SMILE
objects extiapplication objects exticonsole extieventitem extieventlistener extievents extiextension extiextensions extipreference extipreferencebranch extisessionstorage smileiapplication objects smileibookmarkroots smileiwindow smileibrowsertab smileiapplication xpcom although the extiapplication object is pre
loaded into xul scripts, it is not pre
loaded into javascript xpcom code.
STEEL
objects extiapplication objects extiapplication exticonsole extieventitem extieventlistener extievents extiextension extiextensions extipreference extipreferencebranch extisessionstorage steeliapplication objects steeliapplication xpcom although the steel steeliapplication object is pre
loaded into xul scripts, it is not pre
loaded into javascript xpcom code.
extIApplication
xpcom although the application object is pre
loaded into xul scripts, it is not pre
loaded into javascript xpcom code.
XPCOM glue
this is the case for xpcom components, because they are
loaded into mozilla which already has full xpcom
loaded and initialized.
Component Internals
"native" here includes any language that can generate a platform native dynamically
loaded library.
Components.utils.unload
example you can unload a module called mymodule.jsm using the following line of code: components.utils.unload("resource://myaddon/modules/mymodule.jsm"); note: currently components.utils.unload clears the global object of an un
loaded module.
NS_InitXPCOM3
this can be a performance improvement over dynamically
loaded xpcom modules.
imgICache
findentryproperties() find properties used to get properties such as 'type' and 'content-disposition' 'type' is a nsisupportscstring containing the images' mime type such as 'image/png' 'content-disposition' will be a nsisupportscstring containing the header if you call this before any data has been
loaded from a uri, it will succeed, but come back empty.
nsIDOMHTMLSourceElement
note that dynamically manipulating this value after the page has
loaded has no effect on the containing element; instead, change the src attribute of that element (audio or video) instead.
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] in boolean casesensitive, [optional] in boolean backwards, [optional] in boolean wraparound, [optional] in boolean wholewor...
nsIEditorDocShell
methods makeeditable() make this docshell editable, setting a flag that causes an editor to get created, either immediately, or after a url has been
loaded.
nsIFocusManager
this will always be an element within the document
loaded in focusedwindow or null if no element in that document is focused.
nsIFrameLoader
native code only!updatepositionandsize updates the position and size of the subdocument
loaded by this frameloader.
nsILivemarkService
void reloadlivemarkfolder( in long long folderid ); parameters folderid the id of the folder to be re
loaded.
nsIMacDockSupport
note: the hidden window of firefox (services.appshel.hiddendomwindow) loads on browser startup, so if you would like to access it on startup of the browser make sure to check and wait for the window to be
loaded.
nsIMessenger
unfortunately, you must call this before navigating to a position, because calling this has the side effect of making us adjust our current history position, and not adding the
loaded message to the history queue.
nsIMicrosummaryGenerator
s from: nsisupports last changed in gecko 1.9 (firefox 3) warning: microsummary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) method overview long calculateupdateinterval(in nsidomnode apagecontent); boolean equals(in nsimicrosummarygenerator aother); astring generatemicrosummary(in nsidomnode apagecontent); attributes attribute type description
loaded boolean has the generator itself (which may be a remote resource) been
loaded.
Building an Account Manager Extension
<?xml version="1.0" encoding="utf-8"?> <?xml-stylesheet href="chrome://messenger/skin/accountmanage.css" type="text/css"?> <page xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" onload="parent.onpanel
loaded('am-devmo-account.xul');"> <script type="application/javascript" src="chrome://messenger/content/accountmanager.js"/> <script type="application/javascript" src="chrome://example@mozilla.org/content/am-devmo-account.js"/> <dialogheader title="devmo example panel"/> <description> this panel is only shown in imap accounts...
nsIMsgAccountManagerExtension
return value a true indicates, that the account manager can display the panel for the given account, while false prevents the panel to be
loaded.
nsIMsgWindow
void stopurls(); closewindow() when the msg window is being un
loaded from the content window, this notification can be used to force a flush on anything the message window hangs on.
nsIPluginHost
void reloadplugins( in boolean reloadpages ); parameters reloadpages indicates whether currently visible pages should also be re
loaded.
nsISHEntry
owner nsisupports get the owner, if any, that was associated with the channel that the document that was
loaded to create this history entry came from.
nsITelemetry
(components.interfaces.nsitelemetry); method overview jsval gethistogrambyid(in acstring id); jsval snapshothistograms(in uint32_t adataset, in boolean asubsession, in boolean aclear); jsval getkeyedhistogrambyid(in acstring id); void capturestack(in acstring name); jsval snapshotcapturedstacks([optional] in boolean clear); nsisupports get
loadedmodules(); jsval snapshotkeyedhistograms(in uint32_t adataset, in boolean asubsession, in boolean aclear); void sethistogramrecordingenabled(in acstring id, in boolean enabled); void asyncfetchtelemetrydata(in nsifetchtelemetrydatacallback acallback); double mssinceprocessstart(); void scalaradd(in acstring aname, in jsval avalue); void scala...
nsIWebBrowser
the embedder may set this property to their own implementation if they intend to override or prevent how certain kinds of content are
loaded.
nsIWebProgress
isloadingdocument prbool indicates whether or not a document is currently being
loaded in the context of this nsiwebprogress instance.
nsIWindowMediator
ndow) { // wait for the window to finish loading let domwindow = awindow.queryinterface(ci.nsiinterfacerequestor).getinterface(ci.nsidomwindowinternal || ci.nsidomwindow); domwindow.addeventlistener("load", function () { domwindow.removeeventlistener("load", arguments.callee, false); //this removes this load function from the window //window has now
loaded now do stuff to it //as example this will add a function to listen to tab select and will fire alert in that window if (domwindow.gbrowser && domwindow.gbrowser.tabcontainer) { domwindow.gbrowser.tabcontainer.addeventlistener('tabselect', function () { domwindow.alert('tab was selected') }, false); } }...
Using nsIDirectoryService
since it was a component and was
loaded implicitly by many other components, it was difficult to customize.
Using the Gecko SDK
(<tt>about:buildconfig</tt> can be
loaded in mozilla to reveal details about the compiler that was used.) for the remainder of this guide, we'll assume you are developing components under linux.
Using the clipboard
// import the services module for future use, if we're not in // a browser window where it's already
loaded.
XPCOM category image-sniffing-services
if mozilla's built-in image code cannot identify an image, then any xpcom components implementing the nsicontentsniffer interface may register under the "image-sniffing-services" category, and will be queried to determine the mime type of the image being down
loaded.
XSLT 2.0
for users saxon-ce no extensions are required, saxon-ce runs whenever a html page is
loaded that links to the saxon-ce javascript library.
Address Book examples
for example, in order to register a load listener for a contact, the following should take place within the scope of the contact editor dialog: /* an example load listener for a contact * acard the nsiabcard being
loaded * adocument a reference to the contact editor document */ function foo(acard, adocument) { // do something useful, like disabling // input fields that cards for this // address book type do not support.
Filelink Providers
that url is then
loaded into an iframe directly beneath the provider menulist.
Index
55 thunderbird binaries branch, trunk, comm-central, thunderbird described below are three types of generally available thunderbird packages - releases, early preview releases, and nightly builds (including trunk development builds) - and their down
loaded locations.
MailNews Filters
after the fact filters these are one or more filters run on one or more folders *after* the headers have been down
loaded.
Mail and RDF
what else do we store?) datasources are created when each window's javascript is
loaded by declaring the datasource variables in the source javascript as global variables.
Mail composition back end
const struct nsmsgattachedfile *pre
loaded_attachments, - attachments that are already locally stored on disk (note: both attachments and pre
loaded_attachments cannot be specified on a single call void *relatedpart /* nsmsgsendpart */, - a related part for multipart related operations nsimsgsendlistener **alistenerarray) = 0; - an array of listeners for ...
Access Thunderbird Window Areas
var foldertree = getfoldertree(); var searchinput = getsearchinput(); var messagepane = getmessagepane(); var messagepaneframe = getmessagepaneframe(); var mailtoolbox = getmailtoolbox(); var currentmsgfolder = get
loadedmsgfolder(); see the msgmail3panewindow.js for other helper methods ...
customDBHeaders Preference
forrow: function(hdr) {return 0;} } function addcustomcolumnhandler() { gdbview.addcolumnhandler("colsuperfluous",columnhandler); dump("column handler being added: " + columnhandler + "\n"); } var createdbobserver = { // components.interfaces.nsiobserver observe: function(amsgfolder, atopic, adata) { dump("here here!"); addcustomcolumnhandler(); } } function doonce
loaded(){ var observerservice = components.classes["@mozilla.org/observer-service;1"].getservice(components.interfaces.nsiobserverservice); observerservice.addobserver(createdbobserver, "msgcreatedbview", false); window.document.getelementbyid('foldertree').addeventlistener("select",addcustomcolumnhandler,false); } window.addeventlistener("load",doonce
loaded,false); dump(" ~ ~ ~ ~ end superfluou...
Using the Multiple Accounts API
ver.server.namespace.personal - the server's namespace for personal folders preference: mail.server.server.namespace.other_users - the server's namespace for other user's folders the following are specific to pop: the following are specific to news: preference: mail.server.server.leave_on_server - boolean, should we leave messages on the server after we have down
loaded them?
libmime content type handlers
api's content type handler plugins are dynamically
loaded and need to access internal pointers, functions that are part of the c based object system.
Add to iPhoto
downloading the image the downloadimage() method handles actually downloading the image to a temporary file; it then returns the local pathname of the down
loaded file to the caller.
Library
the library object represents a native library
loaded by the ctypes open() method.
ctypes
the library is
loaded from the specified full path, or, if a partial path is specified, from the appropriate library directory based on the platform on which the application is running.
Mozilla
this means that every time an uri is
loaded, mozilla must find out its mime type.
Blocking By Domain - Plugins
third-party plugin block list sites on this list may not use plugins when they are
loaded into a third-party iframe in another site.
Streams - Plugins
in general, this mode is more expensive, because the entire stream must be down
loaded to a temporary file before use unless the stream comes from a local file or an http server that supports the byte-range extension to http.
Preferences System
ui elements that refer to the preferences above, e.g.: <checkbox id="check1" preference="pref1" label="&check1.label;" accesskey="&check1.accesskey;"/> </prefpane> <prefpane id="pane2" label="&pane2.title;" src="chrome://uri/to/pane.xul"/> </prefwindow> pane content can be specified inline or an external chrome uri supplied for pane content to be
loaded in via a dynamic overlay.
Accessibility Inspector - Firefox Developer Tools
print accessibility tree to json you can print the contents of the accessibility tree to json by right-clicking on an entry in the accessibility tab and selecting print to json: when you do, you will get a new tab with the selected accessibility tree
loaded into the json viewer: once opened, you can save or copy the data as necessary.
Browser Toolbox - Firefox Developer Tools
you will be presented with a dialog like this (it can be removed by setting the devtools.debugger.prompt-connection property to false): click ok, and the browser toolbox will open in its own window: you'll be able to inspect the browser's chrome windows and see, and be able to debug, all the javascript files
loaded by the browser itself and by any add-ons that are running.
Search - Firefox Developer Tools
you can use the up and down arrows to move through the list, and return to open the file you want: searching within a file to search for a particular substring in the file currently
loaded into the source pane, press control + f (or command + f on a mac) while the source pane is focused.
Index - Firefox Developer Tools
this tool contains several useful features for viewing and manipulating fonts applied to any document
loaded in the browser including inspection of all fonts applied to the page, and precise adjustment of variable font axis values.
UI Tour - Firefox Developer Tools
access the settings popup recordings pane the recordings pane lists all the recordings you have
loaded, including any you have made in this session and any you have imported.
Web Audio Editor - Firefox Developer Tools
two good demos are: the voice-change-o-matic, which can apply various effects to the microphone input and also provides a visualisation of the result the violent theremin, which changes the pitch and volume of a sine wave as you move the mouse pointer visualizing the graph the web audio editor will now display the graph for the
loaded audio context.
AbstractWorker - Web APIs
var myworker = new worker('worker.js'); first.onchange = function() { myworker.postmessage([first.value, second.value]); console.log('message posted to worker'); } the worker's code is
loaded from the file "worker.js".
AudioContext.createMediaStreamSource() - Web APIs
); var range = document.queryselector('input'); // getusermedia block - grab stream // put it into a mediastreamaudiosourcenode // also output the visuals into a video element if (navigator.mediadevices) { console.log('getusermedia supported.'); navigator.mediadevices.getusermedia ({audio: true, video: true}) .then(function(stream) { video.srcobject = stream; video.on
loadedmetadata = function(e) { video.play(); video.muted = true; }; // create a mediastreamaudiosourcenode // feed the htmlmediaelement into it var audioctx = new audiocontext(); var source = audioctx.createmediastreamsource(stream); // create a biquadfilter var biquadfilter = audioctx.createbiquadfilter(); biquadf...
AudioContext.createMediaStreamTrackSource() - Web APIs
navigator.mediadevices.getusermedia ({audio: true, video: false}) .then(function(stream) { audio.srcobject = stream; audio.on
loadedmetadata = function(e) { audio.play(); audio.muted = true; }; let audioctx = new audiocontext(); let source = audioctx.createmediastreamsource(stream); let biquadfilter = audioctx.createbiquadfilter(); biquadfilter.type = "lowshelf"; biquadfilter.frequency.value = 3000; biquadfilter.gain.value = 20; source.connect(biquadfilter); biquadfilter.connect(audioctx.destinatio...
BaseAudioContext - Web APIs
in this case, the arraybuffer is usually
loaded from an xmlhttprequest's response attribute after setting the responsetype to arraybuffer.
Beacon API - Web APIs
requests are guaranteed to be initiated before a page is un
loaded and they are run to completion, without requiring a blocking request (for example xmlhttprequest).
Manipulating video using canvas - Web APIs
canvas c1 is used to display the current frame of the original video, while c2 is used to display the video after performing the chroma-keying effect; c2 is pre
loaded with the still image that will be used to replace the green background in the video.
Basic usage of canvas - Web APIs
this function, or one like it, could also be called using window.settimeout(), window.setinterval(), or any other event handler, as long as the page has been
loaded first.
Content Index API - Web APIs
examples could be a news website prefetching the latest articles in the background, or a content streaming app registering down
loaded content.
ConvolverNode.normalize - Web APIs
its default value is true in order to achieve a more uniform output level from the convolver, when
loaded with diverse impulse responses.
DataTransfer.clearData() - Web APIs
an> <span class="tweaked" id="target">drop zone</span> <div>status: <span id="status">drag to start</span></div> <div>data is: <span id="data">uninitialized</span></div> css span.tweaked { display: inline-block; margin: 1em 0; padding: 1em 2em; } #source { color: blue; border: 1px solid black; } #target { border: 1px solid black; } javascript window.addeventlistener('domcontent
loaded', function () { // select html elements var draggable = document.getelementbyid('source'); var dropable = document.getelementbyid('target'); var status = document.getelementbyid('status'); var data = document.getelementbyid('data'); var dropped = false; // register event handlers draggable.addeventlistener('dragstart', dragstarthandler); draggable.addeventlistener('dragend', dr...
Document() - Web APIs
the document constructor creates a new document object that is a web page
loaded in the browser and serving as an entry point into the page's content.
Document.open() - Web APIs
document.open(); document.write("<p>hello world!</p>"); document.write("<p>i am a fish</p>"); document.write("<p>the number is 42</p>"); document.close(); notes an automatic document.open() call happens when document.write() is called after the page has
loaded.
Document: readystatechange event - Web APIs
click', () => { log.textcontent =''; window.settimeout(() => { window.location.reload(true); }, 200); }); window.addeventlistener('load', (event) => { log.textcontent = log.textcontent + 'load\n'; }); document.addeventlistener('readystatechange', (event) => { log.textcontent = log.textcontent + `readystate: ${document.readystate}\n`; }); document.addeventlistener('domcontent
loaded', (event) => { log.textcontent = log.textcontent + `domcontent
loaded\n`; }); result specifications specification status comment html living standardthe definition of 'readystatechange' in that specification.
Document.requestStorageAccess() - Web APIs
note: if the requesting origin is not classified as a tracking origin, the access request is automatically given an ephemeral storage access grant, which will go away when the page is re
loaded.
Document.title - Web APIs
in xul, accessing document.title before the document is fully
loaded has undefined behavior: document.title may return an empty string and setting document.title may have no effect.
Examples of web and XML development using the DOM - Web APIs
"pid"); p.style.color = "blue" p.style.fontsize = "18pt" } </script> </head> <body> <p id="pid" onclick="window.location.href = 'http://www.cnn.com/';">linker</p> <form> <p><input value="rec" type="button" onclick="changetext();" /></p> </form> </body> </html> example 4: using stylesheets the stylesheets property on the document object returns a list of the stylesheets that have been
loaded on that document.
How to create a DOM tree - Web APIs
another application is that, since xul is xml, the ui of your application can be dynamically manipulated, down
loaded, up
loaded, saved,
loaded, converted, or transformed quite easily.
Element.innerHTML - Web APIs
usage notes the innerhtml property can be used to examine the current html source of the page, including any changes that have been made since the page was initially
loaded.
FileReader: abort event - Web APIs
log>label { display: block; } .event-log-contents { resize: none; } js const fileinput = document.queryselector('input[type="file"]'); const preview = document.queryselector('img.preview'); const eventlog = document.queryselector('.event-log-contents'); const reader = new filereader(); function handleevent(event) { eventlog.textcontent = eventlog.textcontent + `${event.type}: ${event.
loaded} bytes transferred\n`; if (event.type === "load") { preview.src = reader.result; } } function addlisteners(reader) { reader.addeventlistener('loadstart', handleevent); reader.addeventlistener('load', handleevent); reader.addeventlistener('loadend', handleevent); reader.addeventlistener('progress', handleevent); reader.addeventlistener('error', handleevent); ...
FileReader: load event - Web APIs
log>label { display: block; } .event-log-contents { resize: none; } js const fileinput = document.queryselector('input[type="file"]'); const preview = document.queryselector('img.preview'); const eventlog = document.queryselector('.event-log-contents'); const reader = new filereader(); function handleevent(event) { eventlog.textcontent = eventlog.textcontent + `${event.type}: ${event.
loaded} bytes transferred\n`; if (event.type === "load") { preview.src = reader.result; } } function addlisteners(reader) { reader.addeventlistener('loadstart', handleevent); reader.addeventlistener('load', handleevent); reader.addeventlistener('loadend', handleevent); reader.addeventlistener('progress', handleevent); reader.addeventlistener('error', handleevent); ...
FileReader: loadend event - Web APIs
log>label { display: block; } .event-log-contents { resize: none; } js const fileinput = document.queryselector('input[type="file"]'); const preview = document.queryselector('img.preview'); const eventlog = document.queryselector('.event-log-contents'); const reader = new filereader(); function handleevent(event) { eventlog.textcontent = eventlog.textcontent + `${event.type}: ${event.
loaded} bytes transferred\n`; if (event.type === "load") { preview.src = reader.result; } } function addlisteners(reader) { reader.addeventlistener('loadstart', handleevent); reader.addeventlistener('load', handleevent); reader.addeventlistener('loadend', handleevent); reader.addeventlistener('progress', handleevent); reader.addeventlistener('error', handleevent); ...
FileReader: loadstart event - Web APIs
log>label { display: block; } .event-log-contents { resize: none; } js const fileinput = document.queryselector('input[type="file"]'); const preview = document.queryselector('img.preview'); const eventlog = document.queryselector('.event-log-contents'); const reader = new filereader(); function handleevent(event) { eventlog.textcontent = eventlog.textcontent + `${event.type}: ${event.
loaded} bytes transferred\n`; if (event.type === "load") { preview.src = reader.result; } } function addlisteners(reader) { reader.addeventlistener('loadstart', handleevent); reader.addeventlistener('load', handleevent); reader.addeventlistener('loadend', handleevent); reader.addeventlistener('progress', handleevent); reader.addeventlistener('error', handleevent); ...
FileReader: progress event - Web APIs
log>label { display: block; } .event-log-contents { resize: none; } js const fileinput = document.queryselector('input[type="file"]'); const preview = document.queryselector('img.preview'); const eventlog = document.queryselector('.event-log-contents'); const reader = new filereader(); function handleevent(event) { eventlog.textcontent = eventlog.textcontent + `${event.type}: ${event.
loaded} bytes transferred\n`; if (event.type === "load") { preview.src = reader.result; } } function addlisteners(reader) { reader.addeventlistener('loadstart', handleevent); reader.addeventlistener('load', handleevent); reader.addeventlistener('loadend', handleevent); reader.addeventlistener('progress', handleevent); reader.addeventlistener('error', handleevent); ...
FileSystemFileEntry.file() - Web APIs
the filereader's load event handler is set up to deliver the
loaded string to the successcallback specified when the readfile() method was called; similarly, its error handler is set up to call the errorcallback specified.
FileHandle API - Web APIs
var progress = document.queryselector('progress'); var myfile = myfilehandle.open('readonly'); // let's read a 1gb file var action = myfile.readasarraybuffer(1000000000); action.onprogress = function (event) { if (progress) { progress.value = event.
loaded; progress.max = event.total; } } action.onsuccess = function () { console.log('yeah \o/ just read a 1gb file'); } action.onerror = function () { console.log('oups :( unable to read a 1gb file') } file storage when a file handle is created, the associated file only exists as a "temporary file" as long as you hold the filehandle instance.
Introduction to the File and Directory Entries API - Web APIs
the app can access partially down
loaded files (so that you can watch the first chapter of your dvd, even if the app is still downloading the rest of the content or if the app didn't complete the download because you had to run to catch a train).
FontFace.FontFace() - Web APIs
it can have the following keys: family: family style: style weight: weight stretch: stretch unicoderange: unicode range variant: variant featuresettings: feature settings example async function loadfonts() { const font = new fontface('myfont', 'url(myfont.woff)'); // wait for font to be
loaded await font.load(); // add font to document document.fonts.add(font); // enable font with css class document.body.classlist.add('fonts-
loaded'); } specifications specification status comment css font loading module level 3the definition of 'fontface constructor' in that specification.
FontFaceSet.check() - Web APIs
the check() method of the fontfaceset returns whether all fonts in the given font list have been
loaded and are available.
Using FormData Objects - Web APIs
m = document.forms.nameditem("fileinfo"); form.addeventlistener('submit', function(ev) { var ooutput = document.queryselector("div"), odata = new formdata(form); odata.append("customfield", "this is some extra data"); var oreq = new xmlhttprequest(); oreq.open("post", "stash.php", true); oreq.onload = function(oevent) { if (oreq.status == 200) { ooutput.innerhtml = "up
loaded!"; } else { ooutput.innerhtml = "error " + oreq.status + " occurred when trying to upload your file.<br \/>"; } }; oreq.send(odata); ev.preventdefault(); }, false); note: if you pass in a reference to the form, the request method specified in the form will be used over the method specified in the open() call.
Using the Gamepad API - Web APIs
if a gamepad is already connected when the page
loaded, the gamepadconnected event is dispatched to the focused page when the user presses a button or moves an axis.
GlobalEventHandlers.oncanplay - Web APIs
the canplay event is fired when the user agent can play the media, but estimates that not enough data has been
loaded to play the media up to its end without having to stop for further buffering of content.
GlobalEventHandlers.oncanplaythrough - Web APIs
the canplaythrough event is fired when the user agent can play the media and estimates that enough data has been
loaded to play the media up to its end without having to stop for further buffering of content.
GlobalEventHandlers.onemptied - Web APIs
the emptied event is fired when the media has become empty; for example, this event is sent if the media has already been
loaded (or partially
loaded), and the load() method is called to reload it.
GlobalEventHandlers.onerror - Web APIs
notes when an error occurs in a script,
loaded from a different origin, the details of the error are not reported to prevent leaking information (see bug 363897).
GlobalEventHandlers.onloadend - Web APIs
examples html content <img src="myimage.jpg"> javascript content // 'loadstart' fires first, then 'load', then 'loadend' image.addeventlistener('load', function(e) { console.log('image
loaded'); }); image.addeventlistener('loadstart', function(e) { console.log('image load started'); }); image.addeventlistener('loadend', function(e) { console.log('image load finished'); }); ...
GlobalEventHandlers.onloadstart - Web APIs
examples html content <img src="myimage.jpg"> javascript content // 'loadstart' fires first, then 'load', then 'loadend' image.addeventlistener('load', function(e) { console.log('image
loaded'); }); image.addeventlistener('loadstart', function(e) { console.log('image load started'); }); image.addeventlistener('loadend', function(e) { console.log('image load finished'); }); specifications specification status comment html living standardthe definition of 'onloadstart' in that specification.
HTMLAnchorElement.download - Web APIs
the htmlanchorelement.download property is a domstring indicating that the linked resource is intended to be down
loaded rather than displayed in the browser.
HTMLAnchorElement - Web APIs
htmlanchorelement.download is a domstring indicating that the linked resource is intended to be down
loaded rather than displayed in the browser.
HTMLAreaElement - Web APIs
htmlareaelement.download is a domstring indicating that the linked resource is intended to be down
loaded rather than displayed in the browser.
Audio() - Web APIs
determining when playback can begin there are three ways you can tell when enough of the audio file has
loaded to allow playback to begin: check the value of the readystate property.
HTMLAudioElement - Web APIs
this snippet copies the audio file's duration to a variable: var audioelement = new audio('car_horn.wav'); audioelement.addeventlistener('
loadeddata', () => { let duration = audioelement.duration; // the duration variable now holds the duration (in seconds) of the audio clip }) events inherits methods from its parent, htmlmediaelement, and from its ancestor htmlelement.
HTMLButtonElement.labels - Web APIs
example html <label id="label1" for="test">label 1</label> <button id="test">button</button> <label id="label2" for="test">label 2</label> javascript window.addeventlistener("domcontent
loaded", function() { const button = document.getelementbyid("test"); for(var i = 0; i < button.labels.length; i++) { console.log(button.labels[i].textcontent); // "label 1" and "label 2" } }); specifications specification status comment html living standardthe definition of 'labels' in that specification.
HTMLCanvasElement.toDataURL() - Web APIs
exceptions securityerror the canvas's bitmap is not origin clean; at least some of its contents have or may have been
loaded from a site other than the one from which the document itself was
loaded.
HTMLIFrameElement - Web APIs
via element.removeattribute()) causes about:blank to be
loaded in the frame in firefox (from version 65), chromium-based browsers, and safari/ios.
Image() - Web APIs
usage note the entire bitmap is
loaded regardless of the sizes specified in the constructor.
HTMLInputElement.labels - Web APIs
example html <label id="label1" for="test">label 1</label> <input id="test"/> <label id="label2" for="test">label 2</label> javascript window.addeventlistener("domcontent
loaded", function() { const input = document.getelementbyid("test"); for(var i = 0; i < input.labels.length; i++) { console.log(input.labels[i].textcontent); // "label 1" and "label 2" } }); specifications specification status comment html living standardthe definition of 'labels' in that specification.
HTMLLinkElement.as - Web APIs
the as property of the htmllinkelement interface returns a domstring representing the type of content being
loaded by the html link, one of "script", "style", "image", "video", "audio", "track", "font", "fetch".
HTMLMediaElement.autoplay - Web APIs
syntax htmlmediaelement.autoplay = true | false; var autoplay = htmlmediaelement.autoplay; value a boolean whose value is true if the media element will begin playback as soon as enough content has
loaded to allow it to do so without interruption.
HTMLMediaElement: canplay event - Web APIs
the canplay event is fired when the user agent can play the media, but estimates that not enough data has been
loaded to play the media up to its end without having to stop for further buffering of content.
HTMLMediaElement: canplaythrough event - Web APIs
the canplaythrough event is fired when the user agent can play the media, and estimates that enough data has been
loaded to play the media up to its end without having to stop for further buffering of content.
HTMLMediaElement: emptied event - Web APIs
the emptied event is fired when the media has become empty; for example, this event is sent if the media has already been
loaded (or partially
loaded), and the load() method is called to reload it.
HTMLMediaElement.play() - Web APIs
usage notes although the term "autoplay" is usually thought of as referring to pages that immediately begin playing media upon being
loaded, web browsers' autoplay policies also apply to any script-initiated playback of media, including calls to play().
HTMLMeterElement.labels - Web APIs
example html <label id="label1" for="test">label 1</label> <meter id="test" min="0" max="100" value="70">70</meter> <label id="label2" for="test">label 2</label> javascript window.addeventlistener("domcontent
loaded", function() { const meter = document.getelementbyid("test"); for(var i = 0; i < meter.labels.length; i++) { console.log(meter.labels[i].textcontent); // "label 1" and "label 2" } }); specifications specification status comment html living standardthe definition of 'labels' in that specification.
Option() - Web APIs
so that this <option> will be the default value selected in the <select> element when the page is first
loaded.
HTMLOutputElement.labels - Web APIs
example html <label id="label1" for="test">label 1</label> <output id="test">output</output> <label id="label2" for="test">label 2</label> javascript window.addeventlistener("domcontent
loaded", function() { const output = document.getelementbyid("test"); for(var i = 0; i < output.labels.length; i++) { console.log(output.labels[i].textcontent); // "label 1" and "label 2" } }); specifications specification status comment html living standardthe definition of 'labels' in that specification.
HTMLProgressElement.labels - Web APIs
example html <label id="label1" for="test">label 1</label> <progress id="test" value="70" max="100">70%</progress> <label id="label2" for="test">label 2</label> javascript window.addeventlistener("domcontent
loaded", function() { const progress = document.getelementbyid("test"); for(var i = 0; i < progress.labels.length; i++) { console.log(progress.labels[i].textcontent); // "label 1" and "label 2" } }); specifications specification status comment html living standardthe definition of 'labels' in that specification.
HTMLScriptElement - Web APIs
cripttohead(url, onloadfunction) { var newscript = document.createelement("script"); newscript.onerror = loaderror; if (onloadfunction) { newscript.onload = onloadfunction; } document.head.appendchild(newscript); newscript.src = url; } sample usage: affixscripttohead("myscript1.js"); affixscripttohead("myscript2.js", function () { alert("the script \"myscript2.js\" has been correctly
loaded."); }); specifications specification status comment html living standardthe definition of 'htmlscriptelement' in that specification.
HTMLSelectElement.labels - Web APIs
example html <label id="label1" for="test">label 1</label> <select id="test"> <option value="1">option 1</option> <option value="2">option 2</option> </select> <label id="label2" for="test">label 2</label> javascript window.addeventlistener("domcontent
loaded", function() { const select = document.getelementbyid("test"); for(var i = 0; i < select.labels.length; i++) { console.log(select.labels[i].textcontent); // "label 1" and "label 2" } }); specifications specification status comment html living standardthe definition of 'labels' in that specification.
HTMLSelectElement.options - Web APIs
example html <label for="test">label</label> <select id="test"> <option value="1">option 1</option> <option value="2">option 2</option> </select> javascript window.addeventlistener("domcontent
loaded", function() { const select = document.getelementbyid("test"); for(var i = 0; i < select.options.length; i++) { console.log(select.options[i].label); // "option 1" and "option 2" } }); specifications specification status comment html living standardthe definition of 'options' in that specification.
HTMLTextAreaElement.labels - Web APIs
example html <label id="label1" for="test">label 1</label> <textarea id="test">some text</textarea> <label id="label2" for="test">label 2</label> javascript window.addeventlistener("domcontent
loaded", function() { const textarea = document.getelementbyid("test"); for(var i = 0; i < textarea.labels.length; i++) { console.log(textarea.labels[i].textcontent); // "label 1" and "label 2" } }); specifications specification status comment html living standardthe definition of 'labels' in that specification.
HTMLVideoElement - Web APIs
htmlvideoelement.msisstereo3d read only determines whether the system considers the
loaded video source to be stereo 3-d or not.
The HTML DOM API - Web APIs
among the things added to document by the html standard are: support for accessing various information provided by the http headers when loading the page, such as the location from which the document was
loaded, cookies, modification date, referring site, and so forth.
HTML Drag and Drop API - Web APIs
identify what is draggable making an element draggable requires adding the draggable attribute and the ondragstart global event handler, as shown in the following code sample: <script> function dragstart_handler(ev) { // add the target element's id to the data transfer object ev.datatransfer.setdata("text/plain", ev.target.id); } window.addeventlistener('domcontent
loaded', () => { // get the element by id const element = document.getelementbyid("p1"); // add the ondragstart event listener element.addeventlistener("dragstart", dragstart_handler); }); </script> <p id="p1" draggable="true">this element is draggable.</p> for more information, see: draggable attribute reference drag operations guide define the drag's data the application is ...
History API - Web APIs
ments // both have the effect of // refreshing the page window.history.go(0) window.history.go() you can determine the number of pages in the history stack by looking at the value of the length property: let numberofentries = window.history.length interfaces history allows manipulation of the browser session history (that is, the pages visited in the tab or frame that the current page is
loaded in).
IDBCursor.continuePrimaryKey() - Web APIs
calling this method more than once before new cursor data has been
loaded - for example, calling continueprimarykey() twice from the same onsuccess handler - results in an invalidstateerror being thrown on the second call because the cursor’s got value flag has been unset.
IDBObjectStore.createIndex() - Web APIs
has been deleted or removed.) in firefox previous to version 41, an invalidstateerror was raised in this case as well, which was misleading; this has now been fixed (see bug 1176165.) example in the following example you can see the idbopendbrequest.onupgradeneeded handler being used to update the database structure if a database with a higher version number is
loaded.
IDBObjectStore.deleteIndex() - Web APIs
example in the following example you can see the idbopendbrequest.onupgradeneeded handler being used to update the database structure if a database with a higher version number is
loaded.
IDBOpenDBRequest - Web APIs
example in the following example you can see the onupgradeneeded handler being used to update the database structure if a database with a higher version number is
loaded.
IntersectionObserver - Web APIs
if (entries[0].intersectionratio <= 0) return; loaditems(10); console.log('
loaded new items'); }); // start observing intersectionobserver.observe(document.queryselector('.scrollerfooter')); specifications specification status comment intersection observerthe definition of 'intersectionobserver' in that specification.
MediaStream.onaddtrack - Web APIs
this event is fired when the browser adds a track to the stream (such as when a rtcpeerconnection is renegotiated or a stream being captured using htmlmediaelement.capturestream() gets a new set of tracks because the media element being captured
loaded a new source.
MediaStream.onremovetrack - Web APIs
this event is fired when the browser removes a track from the stream (such as when a rtcpeerconnection is renegotiated or a stream being captured using htmlmediaelement.capturestream() gets a new set of tracks because the media element being captured
loaded a new source.
MediaStreamAudioSourceNode - Web APIs
); var range = document.queryselector('input'); // getusermedia block - grab stream // put it into a mediastreamaudiosourcenode // also output the visuals into a video element if (navigator.mediadevices) { console.log('getusermedia supported.'); navigator.mediadevices.getusermedia ({audio: true, video: true}) .then(function(stream) { video.srcobject = stream; video.on
loadedmetadata = function(e) { video.play(); video.muted = true; }; // create a mediastreamaudiosourcenode // feed the htmlmediaelement into it var audioctx = new audiocontext(); var source = audioctx.createmediastreamsource(stream); // create a biquadfilter var biquadfilter = audioctx.createbiquadfilter(); biquadf...
MediaStreamTrackAudioSourceNode - Web APIs
); var range = document.queryselector('input'); // getusermedia block - grab stream // put it into a mediastreamaudiosourcenode // also output the visuals into a video element if (navigator.mediadevices) { console.log('getusermedia supported.'); navigator.mediadevices.getusermedia ({audio: true, video: true}) .then(function(stream) { video.srcobject = stream; video.on
loadedmetadata = function(e) { video.play(); video.muted = true; }; // create a mediastreamaudiosourcenode // feed the htmlmediaelement into it var audioctx = new audiocontext(); var source = audioctx.createmediastreamsource(stream); // create a biquadfilter var biquadfilter = audioctx.createbiquadfilter(); biquadf...
MessageChannel - Web APIs
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.
MessagePort - Web APIs
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.
Navigator.sendBeacon() - Web APIs
description this method is for analytics and diagnostics that send data to a server before the document is un
loaded, where sending the data any sooner may miss some possible data collection.
PageTransitionEvent - Web APIs
the pagetransitionevent event object is available inside handler functions for the pageshow and pagehide events, fired when a document is being
loaded or un
loaded.
Payment processing concepts - Web APIs
by then delivering this data (or a promise which resolves to the
loaded data) to the payment handler by passing it into complete(), the payment handler can use the retrieved data and whatever algorithm and other data to support in order to verify that the merchant can use the payment handler.
PerformanceNavigationTiming.domComplete - Web APIs
function print_nav_timing_data() { // use getentriesbytype() to just get the "navigation" events var perfentries = performance.getentriesbytype("navigation"); for (var i=0; i < perfentries.length; i++) { console.log("= navigation entry[" + i + "]"); var p = perfentries[i]; // dom properties console.log("dom content
loaded = " + (p.domcontent
loadedeventend - p.domcontent
loadedeventstart)); console.log("dom complete = " + p.domcomplete); console.log("dom interactive = " + p.interactive); // document load and unload time console.log("document load = " + (p.loadeventend - p.loadeventstart)); console.log("document unload = " + (p.unloadeventend - p.unloadeventstart)); // other properties c...
PerformanceNavigationTiming.domInteractive - Web APIs
function print_nav_timing_data() { // use getentriesbytype() to just get the "navigation" events var perfentries = performance.getentriesbytype("navigation"); for (var i=0; i < perfentries.length; i++) { console.log("= navigation entry[" + i + "]"); var p = perfentries[i]; // dom properties console.log("dom content
loaded = " + (p.domcontent
loadedeventend - p.domcontent
loadedeventstart)); console.log("dom complete = " + p.domcomplete); console.log("dom interactive = " + p.dominteractive); // document load and unload time console.log("document load = " + (p.loadeventend - p.loadeventstart)); console.log("document unload = " + (p.unloadeventend - p.unloadeventstart)); // other properties ...
PerformanceNavigationTiming.loadEventEnd - Web APIs
function print_nav_timing_data() { // use getentriesbytype() to just get the "navigation" events var perfentries = performance.getentriesbytype("navigation"); for (var i=0; i < perfentries.length; i++) { console.log("= navigation entry[" + i + "]"); var p = perfentries[i]; // dom properties console.log("dom content
loaded = " + (p.domcontent
loadedeventend - p.domcontent
loadedeventstart)); console.log("dom complete = " + p.domcomplete); console.log("dom interactive = " + p.dominteractive); // document load and unload time console.log("document load = " + (p.loadeventend - p.loadeventstart)); console.log("document unload = " + (p.unloadeventend - p.unloadeventstart)); // other properties ...
PerformanceNavigationTiming.loadEventStart - Web APIs
function print_nav_timing_data() { // use getentriesbytype() to just get the "navigation" events var perfentries = performance.getentriesbytype("navigation"); for (var i=0; i < perfentries.length; i++) { console.log("= navigation entry[" + i + "]"); var p = perfentries[i]; // dom properties console.log("dom content
loaded = " + (p.domcontent
loadedeventend - p.domcontent
loadedeventstart)); console.log("dom complete = " + p.domcomplete); console.log("dom interactive = " + p.interactive); // document load and unload time console.log("document load = " + (p.loadeventend - p.loadeventstart)); console.log("document unload = " + (p.unloadeventend - p.unloadeventstart)); // other properties c...
PerformanceNavigationTiming.redirectCount - Web APIs
function print_nav_timing_data() { // use getentriesbytype() to just get the "navigation" events var perfentries = performance.getentriesbytype("navigation"); for (var i=0; i < perfentries.length; i++) { console.log("= navigation entry[" + i + "]"); var p = perfentries[i]; // dom properties console.log("dom content
loaded = " + (p.domcontent
loadedeventend - p.domcontent
loadedeventstart)); console.log("dom complete = " + p.domcomplete); console.log("dom interactive = " + p.interactive); // document load and unload time console.log("document load = " + (p.loadeventend - p.loadeventstart)); console.log("document unload = " + (p.unloadeventend - p.unloadeventstart)); // other properties c...
PerformanceNavigationTiming.type - Web APIs
function print_nav_timing_data() { // use getentriesbytype() to just get the "navigation" events var perfentries = performance.getentriesbytype("navigation"); for (var i=0; i < perfentries.length; i++) { console.log("= navigation entry[" + i + "]"); var p = perfentries[i]; // dom properties console.log("dom content
loaded = " + (p.domcontent
loadedeventend - p.domcontent
loadedeventstart)); console.log("dom complete = " + p.domcomplete); console.log("dom interactive = " + p.interactive); // document load and unload time console.log("document load = " + (p.loadeventend - p.loadeventstart)); console.log("document unload = " + (p.unloadeventend - p.unloadeventstart)); // other properties c...
PerformanceNavigationTiming.unloadEventEnd - Web APIs
function print_nav_timing_data() { // use getentriesbytype() to just get the "navigation" events var perfentries = performance.getentriesbytype("navigation"); for (var i=0; i < perfentries.length; i++) { console.log("= navigation entry[" + i + "]"); var p = perfentries[i]; // dom properties console.log("dom content
loaded = " + (p.domcontent
loadedeventend - p.domcontent
loadedeventstart)); console.log("dom complete = " + p.domcomplete); console.log("dom interactive = " + p.interactive); // document load and unload time console.log("document load = " + (p.loadeventend - p.loadeventstart)); console.log("document unload = " + (p.unloadeventend - p.unloadeventstart)); // other properties c...
PerformanceNavigationTiming.unloadEventStart - Web APIs
function print_nav_timing_data() { // use getentriesbytype() to just get the "navigation" events var perfentries = performance.getentriesbytype("navigation"); for (var i=0; i < perfentries.length; i++) { console.log("= navigation entry[" + i + "]"); var p = perfentries[i]; // dom properties console.log("dom content
loaded = " + (p.domcontent
loadedeventend - p.domcontent
loadedeventstart)); console.log("dom complete = " + p.domcomplete); console.log("dom interactive = " + p.interactive); // document load and unload time console.log("document load = " + (p.loadeventend - p.loadeventstart)); console.log("document unload = " + (p.unloadeventend - p.unloadeventstart)); // other properties c...
Using the Permissions API - Web APIs
"denied" the "enable geolocation" button is revealed (this code needs to be here too, in case the permission state is already set to denied for this origin when the page is first
loaded).
Push API - Web APIs
the push api gives web applications the ability to receive messages pushed to them from a server, whether or not the web app is in the foreground, or even currently
loaded, on a user agent.
Resource Timing API - Web APIs
if the resource is
loaded via a secure connection a secureconnectionstart timestamp will be available between the connection start and end events.
SVGElement: error event - Web APIs
bubbles yes cancelable no interface svgevent event handler property onerror examples svgelem.addeventlistener('error', () => { console.log('svg not
loaded properly.'); }) specifications specification status comment scalable vector graphics (svg) 2the definition of 'error' in that specification.
SVGElement: unload event - Web APIs
bubbles no cancelable no interface svgevent event handler property onunload examples svgelem.addeventlistener('unload', () => { console.log('svg un
loaded.'); }) specifications specification status comment scalable vector graphics (svg) 2the definition of 'unload' in that specification.
Using the Screen Capture API - Web APIs
for example, this line in the http headers will enable screen capture api for the document and any embedded <iframe> elements that are
loaded from the same origin: feature-policy: display-capture 'self' if you're performing screen capture within an <iframe>, you can request permission just for that frame, which is clearly more secure than requesting a more general permission: <iframe src="https://mycode.example.net/etc" allow="display-capture"> </iframe> ...
ScriptProcessorNode: audioprocess event - Web APIs
bubbles no cancelable no default action none interface audioprocessingevent event handler property scriptprocessornode.onaudioprocess examples scriptnode.addeventlistener('audioprocess', function(audioprocessingevent) { // the input buffer is a song we
loaded earlier var inputbuffer = audioprocessingevent.inputbuffer; // the output buffer contains the samples that will be modified and played var outputbuffer = audioprocessingevent.outputbuffer; // loop through the output channels (in this case there is only one) for (var channel = 0; channel < outputbuffer.numberofchannels; channel++) { var inputdata = inputbuffer.getchanneldata(channe...
ServiceWorker - Web APIs
a serviceworker object is available in the serviceworkerregistration.active property, and the serviceworkercontainer.controller property — this is a service worker that has been activated and is controlling the page (the service worker has been successfully registered, and the controlled page has been re
loaded.) the serviceworker interface is dispatched a set of lifecycle events — install and activate — and functional events including fetch.
Streams API - Web APIs
this is something browsers do anyway when receiving assets to be shown on webpages — videos buffer and more is gradually available to play, and sometimes you'll see images display gradually as more is
loaded.
TextTrack.mode - Web APIs
when a text track is
loaded in the disabled state, the corresponding webvtt file is not
loaded until the state changes to either showing or hidden.
TimeRanges.end() - Web APIs
example given a video element with the id "myvideo": var v = document.getelementbyid("myvideo"); var buf = v.buffered; var numranges = buf.length; if (buf.length == 1) { // only one range if (buf.start(0) == 0 && buf.end(0) == v.duration) { // the one range starts at the beginning and ends at // the end of the video, so the whole thing is
loaded } } this example looks at the time ranges and looks to see if the entire video has been
loaded.
TimeRanges.length - Web APIs
syntax length = timeranges.length; example given a video element with the id "myvideo": var v = document.getelementbyid("myvideo"); var buf = v.buffered; var numranges = buf.length; if (buf.length == 1) { // only one range if (buf.start(0) == 0 && buf.end(0) == v.duration) { // the one range starts at the beginning and ends at // the end of the video, so the whole thing is
loaded } } this example looks at the time ranges and looks to see if the entire video has been
loaded.
TimeRanges.start() - Web APIs
example given a video element with the id "myvideo": var v = document.getelementbyid("myvideo"); var buf = v.buffered; var numranges = buf.length; if (buf.length == 1) { // only one range if (buf.start(0) == 0 && buf.end(0) == v.duration) { // the one range starts at the beginning and ends at // the end of the video, so the whole thing is
loaded } } this example looks at the time ranges and looks to see if the entire video has been
loaded.
Touch events - Web APIs
function startup() { var el = document.getelementbyid("canvas"); el.addeventlistener("touchstart", handlestart, false); el.addeventlistener("touchend", handleend, false); el.addeventlistener("touchcancel", handlecancel, false); el.addeventlistener("touchmove", handlemove, false); } document.addeventlistener("domcontent
loaded", startup); this simply sets up all the event listeners for our <canvas> element so we can handle the touch events as they occur.
URL.createObjectURL() - Web APIs
browsers will release object urls automatically when the document is un
loaded; however, for optimal performance and memory usage, if there are safe times when you can explicitly unload them, you should do so.
VTTCue - Web APIs
example html <video controls src="https://udn.realityripple.com/samples/c6/f8a3489533.webm"></video> css video { width: 320px; height: 180px; } javascript let video = document.queryselector('video'); video.addeventlistener('
loadedmetadata', () => { const track = video.addtexttrack("captions", "简体ä¸æ–‡subtitles", "zh_cn"); track.mode = "showing"; const cuecn = new vttcue(0, 2.500, 'å—幕会在0至2.5秒间显示'); track.addcue(cuecn); const cueen = new vttcue(2.6, 4, 'subtitles will display between 2.6 and 4 seconds'); track.addcue(cueen); }); result chrome: please open in jsfiddle to view the liv...
Clearing with colors - Web APIs
--> <canvas>your browser does not seem to support html5 canvas.</canvas> body { text-align : center; } canvas { display : block; width : 280px; height : 210px; margin : auto; padding : 0; border : none; background-color : black; } // run everything inside window load event handler, to make sure // dom is fully
loaded and styled before trying to manipulate it, // and to not mess up the global scope.
Detect WebGL - Web APIs
<p>[ here would go the result of webgl feature detection ]</p> <button>press here to detect webglrenderingcontext</button> body { text-align : center; } button { display : block; font-size : inherit; margin : auto; padding : 0.6em; } // run everything inside window load event handler, to make sure // dom is fully
loaded and styled before trying to manipulate it.
Compressed texture formats - Web APIs
note that webgl makes no functionality available to compress or decompress textures: they must already be in a compressed format and can then be directly up
loaded to video memory.
Getting started with WebGL - Web APIs
<body> <canvas id="glcanvas" width="640" height="480"></canvas> </body> preparing the webgl context the main() function in our javascript code, is called when our script is
loaded.
WebGL model view projection - Web APIs
clip space in a webgl program, data is typically up
loaded to the gpu with its own coordinate system and then the vertex shader transforms those points into a special coordinate system known as clip space.
Writing WebSocket client applications - Web APIs
security considerations websockets should not be used in a mixed content environment; that is, you shouldn't open a non-secure websocket connection from a page
loaded using https or vice-versa.
Web Animations API Concepts - Web APIs
each document has a master timeline, document.timeline, which stretches from the moment the page is
loaded to infinity — or until the window is closed.
Window.content - Web APIs
in unprivileged content (webpages), content is normally equivalent to top (except in the case of a webpage
loaded in a sidebar, content still refers to the window of the currently selected tab).
Window.controllers - Web APIs
however, the added controllers must be explicitly removed when the window is un
loaded, as this is not done automatically.
Window.history - Web APIs
the window.history read-only property returns a reference to the history object, which provides an interface for manipulating the browser session history (pages visited in the tab or frame that the current page is
loaded in).
Window.matchMedia() - Web APIs
javascript let mql = window.matchmedia('(max-width: 600px)'); document.queryselector(".mq-value").innertext = mql.matches; the javascript code simply passes the media query to match into matchmedia() to compile it, then sets the <span>'s innertext to the value of the results' matches property, so that it indicates whether or not the document matches the media query at the moment the page was
loaded.
Window.parent - Web APIs
when a window is
loaded in an <iframe>, <object>, or <frame>, its parent is the window with the element embedding the window.
Window.sizeToContent() - Web APIs
in order for it to work, the dom content should be
loaded when this function is called—for example, once the domcontent
loaded event has been thrown.
WorkerGlobalScope.console - Web APIs
if you are calling console.log() from a dedicatedworkerglobalscope or other worker scope that acts on a single
loaded window, that tab's web console will receive the logs.
XMLDocument.load() - Web APIs
examples var xmldoc = document.implementation.createdocument("", "test", null); function document
loaded (e) { alert(new xmlserializer().serializetostring(e.target)); // gives querydata.xml contents as string } xmldoc.addeventlistener("load", document
loaded, false); xmldoc.load('querydata.xml'); see also the load sample in the xml tests directory.
XMLHttpRequest() - Web APIs
this only works in privileged (reviewed) apps (bug 692677); it does not work on arbitrary webpages
loaded in firefox ...
XMLHttpRequest: abort event - Web APIs
m; padding: .2rem; } input { width: 11rem; margin: .5rem; } js const xhrbuttonsuccess = document.queryselector('.xhr.success'); const xhrbuttonerror = document.queryselector('.xhr.error'); const xhrbuttonabort = document.queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.
loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ...
XMLHttpRequest: error event - Web APIs
m; padding: .2rem; } input { width: 11rem; margin: .5rem; } js const xhrbuttonsuccess = document.queryselector('.xhr.success'); const xhrbuttonerror = document.queryselector('.xhr.error'); const xhrbuttonabort = document.queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.
loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ...
XMLHttpRequest: load event - Web APIs
m; padding: .2rem; } input { width: 11rem; margin: .5rem; } js const xhrbuttonsuccess = document.queryselector('.xhr.success'); const xhrbuttonerror = document.queryselector('.xhr.error'); const xhrbuttonabort = document.queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.
loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ...
XMLHttpRequest: loadend event - Web APIs
m; padding: .2rem; } input { width: 11rem; margin: .5rem; } js const xhrbuttonsuccess = document.queryselector('.xhr.success'); const xhrbuttonerror = document.queryselector('.xhr.error'); const xhrbuttonabort = document.queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.
loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ...
XMLHttpRequest: loadstart event - Web APIs
m; padding: .2rem; } input { width: 11rem; margin: .5rem; } js const xhrbuttonsuccess = document.queryselector('.xhr.success'); const xhrbuttonerror = document.queryselector('.xhr.error'); const xhrbuttonabort = document.queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.
loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ...
XMLHttpRequest.multipart - Web APIs
note: when this is set, the onload handler and other event handlers are not reset after the first xmldocument is
loaded, and the onload handler is called after each part of the response is received.
XMLHttpRequest: progress event - Web APIs
m; padding: .2rem; } input { width: 11rem; margin: .5rem; } js const xhrbuttonsuccess = document.queryselector('.xhr.success'); const xhrbuttonerror = document.queryselector('.xhr.error'); const xhrbuttonabort = document.queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.
loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ...
XMLHttpRequest.readyState - Web APIs
instead of unsent, opened, headers_received, loading and done, the names readystate_uninitialized (0), readystate_loading (1), readystate_
loaded (2), readystate_interactive (3) and readystate_complete (4) are used.
msCaching - Web APIs
the mscaching read/write property specifies whether stream data down
loaded using xmlhttprequestis cached to disk or not.
Using the alert role - Accessibility
if the element was already in the original source code when the page
loaded, the screen reader will announce the error immediately after announcing the page title.
ARIA: feed role - Accessibility
each article element has aria-posinset set to a value that represents its position in the feed and an aria-setsize set to a value that represents either the total number of articles that have been
loaded or the total number in the feed, depending on which value is more helpful to users.
ARIA: tab role - Accessibility
window.addeventlistener("domcontent
loaded", () => { const tabs = document.queryselectorall('[role="tab"]'); const tablist = document.queryselector('[role="tablist"]'); // add a click event handler to each tab tabs.foreach(tab => { tab.addeventlistener("click", changetabs); }); // enable arrow navigation between tabs in the tab list let tabfocus = 0; tablist.addeventlistener("keydown", e => { // move right i...
-moz-context-properties - CSS: Cascading Style Sheets
ext-stroke' fill-opacity='0.5'/></svg>"> here we've set the image src to a data uri containing a simple svg image; the <rect> inside has been made to take its fill and stroke values from the fill and stroke set on the <img> element by giving them the context-fill/context-stroke keywords in their values, along with a fallback color for the fill (red) which will be used in the case that the svg is
loaded standalone in a top-level window (where it will have no context element to provide context values).
:-moz-user-disabled - CSS: Cascading Style Sheets
the :-moz-user-disabled css pseudo-class is a mozilla extension that matches elements representing images that were not
loaded because images have been entirely disabled by the user's preferences.
::placeholder - CSS: Cascading Style Sheets
with this implementation, the hint content is available even if information is entered into the input field, and the input appears free of preexisting input when the page is
loaded.
:disabled - CSS: Cascading Style Sheets
<input type="checkbox" id="billing-checkbox" checked> <br> <input type="text" placeholder="name" disabled> <input type="text" placeholder="address" disabled> <input type="text" placeholder="zip code" disabled> </fieldset> </form> css input[type="text"]:disabled { background: #ccc; } javascript // wait for the page to finish loading document.addeventlistener('domcontent
loaded', function () { // attach `change` event listener to checkbox document.getelementbyid('billing-checkbox').onchange = togglebilling; }, false); function togglebilling() { // select the billing text fields var billingitems = document.queryselectorall('#billing input[type="text"]'); // toggle the billing text fields for (var i = 0; i < billingitems.length; i++) { billingitems[i].di...
prefers-reduced-data - CSS: Cascading Style Sheets
in this example the montserrat-regular.woff2 font file will neither be pre
loaded nor down
loaded if the user prefers reduced data, in this case the "system font stack" will serve as the fallback font: html <head> <link rel="preload" href="fonts/montserrat-regular.woff2" as="font" media="(prefers-reduced-data: no-preference)" crossorigin> <link rel="stylesheet" href="style.css"> </head> css @media (prefers-reduced-data: no-preference) { @font-face { font-fa...
Video player styling basics - Developer guides
simple :hover and :focus states are then set for each button that simply alters the opacity of the button: .controls button:hover, .controls button:focus { opacity:0.5; } to obtain appropriate button images, a set of free common control set icons was down
loaded from the web.
Creating a cross-browser video player - Developer guides
ideally, the correct value of the video's duration attribute is available when the
loadedmetadata event is raised, which occurs when the video's metadata has been
loaded: video.addeventlistener('
loadedmetadata', function() { progress.setattribute('max', video.duration); }); unfortunately in some mobile browsers, when
loadedmetadata is raised — if it even is raised — video.duration may not have the correct value, or even any value at all.
Audio and video manipulation - Developer guides
gedata(0, 0, this.width, this.height); var l = frame.data.length / 4; for (var i = 0; i < l; i++) { var grey = (frame.data[i * 4 + 0] + frame.data[i * 4 + 1] + frame.data[i * 4 + 2]) / 3; frame.data[i * 4 + 0] = grey; frame.data[i * 4 + 1] = grey; frame.data[i * 4 + 2] = grey; } this.ctx1.putimagedata(frame, 0, 0); return; } }; once the page has
loaded you can call processor.doload() result this is a pretty simple example showing how to manipulate video frames using a canvas.
HTML5 Parser - Developer guides
performance improvement with speculative parsing unrelated to the requirements of html5 specification, the gecko 2 parser uses speculative parsing, in which it continues parsing a document while scripts are being down
loaded and executed.
Index - Developer guides
11 media buffering, seeking, and time ranges apps, buffer, html5, timeranges, video, buffering, seeking sometimes it's useful to know how much <audio> or <video> has down
loaded or is playable without delay — a good example of this is the buffered progress bar of an audio or video player.
Global attributes - HTML: Hypertext Markup Language
the event handler attributes: onabort, onautocomplete, onautocompleteerror, onblur, oncancel, oncanplay, oncanplaythrough, onchange, onclick, onclose, oncontextmenu, oncuechange, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, onfocus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, on
loadeddata, on
loadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onsort, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumechange, onwaiting.
HTML: Hypertext Markup Language
advanced topics cors enabled image the crossorigin attribute, in combination with an appropriate cors header, allows images defined by the <img> element to be
loaded from foreign origins and used in a <canvas> element as if they were being
loaded from the current origin.
HTTP authentication - HTTP
from firefox 59 onwards, image resources
loaded from different origins to the current document are no longer able to trigger http authentication dialogs (bug 1423146), preventing user credentials being stolen if attackers were able to embed an arbitrary image into a third-party page.
Resource URLs - HTTP
syntax resource urls are composed of two parts: a prefix (resource:), and a url pointing to the resource you want to load: resource://<url> an example: resource://gre/res/svg.css when arrows are found in the resource url's ('->'), it means that the first file
loaded the next one: resource://<file-loader> -> <file-
loaded> please refer to identifying resources on the web for more general details.
Browser detection using the user agent - HTTP
the simplest way to do this is to separate all the code that moves content around based on screen size to a single function that is called when the page is
loaded and at each resize event thereafter.
HTTP conditional requests - HTTP
once this happens, the client can resume a download by sending a ranges header with the missing ranges: the principle is simple, but there is one potential problem: if the down
loaded resource has been modified between both downloads, the obtained ranges will correspond to two different versions of the resource, and the final document will be corrupted.
Using Feature Policy - HTTP
'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.
Accept-Encoding - HTTP
this may be the case with some image formats; the server is over
loaded and cannot afford the computational overhead induced by the compression requirement.
CSP: base-uri - HTTP
'strict-dynamic' the strict-dynamic source expression specifies that the trust explicitly given to a script present in the markup, by accompanying it with a nonce or a hash, shall be propagated to all the scripts
loaded by that root script.
CSP: child-src - HTTP
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>.
CSP: connect-src - HTTP
the http content-security-policy (csp) connect-src directive restricts the urls which can be
loaded using script interfaces.
CSP: default-src - HTTP
'strict-dynamic' the strict-dynamic source expression specifies that the trust explicitly given to a script present in the markup, by accompanying it with a nonce or a hash, shall be propagated to all the scripts
loaded by that root script.
CSP: font-src - HTTP
the http content-security-policy (csp) font-src directive specifies valid sources for fonts
loaded using @font-face.
CSP: form-action - HTTP
'strict-dynamic' the strict-dynamic source expression specifies that the trust explicitly given to a script present in the markup, by accompanying it with a nonce or a hash, shall be propagated to all the scripts
loaded by that root script.
CSP: frame-ancestors - HTTP
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.
CSP: img-src - HTTP
'strict-dynamic' the strict-dynamic source expression specifies that the trust explicitly given to a script present in the markup, by accompanying it with a nonce or a hash, shall be propagated to all the scripts
loaded by that root script.
CSP: navigate-to - HTTP
'strict-dynamic' the strict-dynamic source expression specifies that the trust explicitly given to a script present in the markup, by accompanying it with a nonce or a hash, shall be propagated to all the scripts
loaded by that root script.
CSP: plugin-types - HTTP
the http content-security-policy (csp) plugin-types directive restricts the set of plugins that can be embedded into a document by limiting the types of resources which can be
loaded.
CSP: require-sri-for - HTTP
examples if you set your site to require sri for script and styles using this directive: content-security-policy: require-sri-for script style <script> elements like the following will be
loaded as they use a valid integrity attribute.
CSP: script-src-elem - HTTP
'strict-dynamic' the strict-dynamic source expression specifies that the trust explicitly given to a script present in the markup, by accompanying it with a nonce or a hash, shall be propagated to all the scripts
loaded by that root script.
CSP: style-src - HTTP
s violation cases given this csp header: content-security-policy: style-src https://example.com/ the following stylesheets are blocked and won't load: <link href="https://not-example.com/styles/main.css" rel="stylesheet" type="text/css" /> <style> #inline-style { background: red; } </style> <style> @import url("https://not-example.com/styles/print.css") print; </style> as well as styles
loaded using the link header: link: <https://not-example.com/styles/stylesheet.css>;rel=stylesheet inline style attributes are also blocked: <div style="display:none">foo</div> as well as styles that are applied in javascript by setting the style attribute directly, or by setting csstext: document.queryselector('div').setattribute('style', 'display:none;'); document.queryselector('div').style.csst...
Content-Type - HTTP
length: 68137 content-type: multipart/form-data; boundary=---------------------------974767299852498929531610575 -----------------------------974767299852498929531610575 content-disposition: form-data; name="description" some text -----------------------------974767299852498929531610575 content-disposition: form-data; name="myfile"; filename="foo.txt" content-type: text/plain (content of the up
loaded file foo.txt) -----------------------------974767299852498929531610575-- specifications specification title rfc 7233, section 4.1: content-type in multipart hypertext transfer protocol (http/1.1): range requests rfc 7231, section 3.1.1.5: content-type hypertext transfer protocol (http/1.1): semantics and content ...
Cross-Origin-Embedder-Policy - HTTP
to check if cross origin isolation has been successful, you can test against the crossoriginisolated property available to window and worker contexts: if (crossoriginisolated) { // post sharedarraybuffer } else { // do something else } avoiding coep blockage with cors if you enable coep using require-corp and have a cross origin resource that needs to be
loaded, it needs to support cors and you need to explicitly mark the resource as loadable from another origin to avoid blockage from coep.
Cross-Origin-Resource-Policy - HTTP
due to a bug in firefox, setting cross-origin-resource-policy can prevent some resources (such as pdfs) from being down
loaded in some circumstances.
Feature-Policy: accelerometer - HTTP
'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.
Feature-Policy: ambient-light-sensor - HTTP
'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.
Feature-Policy: autoplay - HTTP
'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.
Feature-Policy: battery - HTTP
'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.
Feature-Policy: camera - HTTP
'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.
Feature-Policy: display-capture - HTTP
'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.
Feature-Policy: document-domain - HTTP
'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.
Feature-Policy: encrypted-media - HTTP
'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.
Feature-Policy: fullscreen - HTTP
'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.
Feature-Policy: geolocation - HTTP
'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.
Feature-Policy: gyroscope - HTTP
'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.
Feature-Policy: layout-animations - HTTP
'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.
Feature-Policy: legacy-image-formats - HTTP
'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.
Feature-Policy: magnetometer - HTTP
'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.
Feature-Policy: microphone - HTTP
'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.
Feature-Policy: midi - HTTP
'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.
Feature-Policy: oversized-images - HTTP
'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.
Feature-Policy: payment - HTTP
'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.
Feature-Policy: picture-in-picture - HTTP
'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.
Feature-Policy: publickey-credentials-get - HTTP
'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.
Feature-Policy: screen-wake-lock - HTTP
'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.
Feature-Policy: sync-xhr - HTTP
'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.
Feature-Policy: unoptimized-images - HTTP
'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.
Feature-Policy: usb - HTTP
'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.
Feature-Policy: vibrate - HTTP
'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.
Feature-Policy: wake-lock - HTTP
'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.
web-share - HTTP
'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.
Feature-Policy: xr-spatial-tracking - HTTP
'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.
Feature-Policy - HTTP
'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.
If-None-Match - HTTP
they are only useful when uploading a resource, usually with put, to check if another resource with the identity has already been up
loaded before.
Save-Data - HTTP
a value of on indicates explicit user opt-in into a reduced data usage mode on the client, and when communicated to origins allows them to deliver alternative content to reduce the data down
loaded such as smaller image and video resources, different markup and styling, disabled polling and automatic updates, and so on.
X-Content-Type-Options - HTTP
this can cause html web pages to be down
loaded instead of being rendered when they are served with a mime type other than text/html.
X-Frame-Options - HTTP
header type response header forbidden header name no syntax there are two possible directives for x-frame-options: x-frame-options: deny x-frame-options: sameorigin directives if you specify deny, not only will attempts to load the page in a frame fail when
loaded from other sites, attempts to do so will fail when
loaded from the same site.
HTTP Public Key Pinning (HPKP) - HTTP
setenv.add-response-header = ( "public-key-pins" => "pin-sha256=\"base64+primary==\"; pin-sha256=\"base64+backup==\"; max-age=5184000; includesubdomains") note: this requires the mod_setenv server.module
loaded which can be included by the following if not already
loaded.
200 OK - HTTP
the successful result of a put or a delete is often not a 200 ok but a 204 no content (or a 201 created when the resource is up
loaded for the first time).
302 Found - HTTP
this is useful when you want to give a response to a put method that is not the up
loaded resource but a confirmation message such as: 'you successfully up
loaded xyz'.
303 See Other - HTTP
the hypertext transfer protocol (http) 303 see other redirect status response code indicates that the redirects don't link to the newly up
loaded resources, but to another page (such as a confirmation page or an upload progress page).
307 Temporary Redirect - HTTP
this is useful when you want to give an answer to a put method that is not the up
loaded resources, but a confirmation message (like "you successfully up
loaded xyz").
Introduction - JavaScript
single-line input in the web console the web console shows you information about the currently
loaded web page, and also includes a javascript interpreter that you can use to execute javascript expressions in the current page.
Regular expressions - JavaScript
creating a regular expression you construct a regular expression in one of two ways: using a regular expression literal, which consists of a pattern enclosed between slashes, as follows: let re = /ab+c/; regular expression literals provide compilation of the regular expression when the script is
loaded.
TypeError: can't access dead object - JavaScript
to avoid these issues, references to dom nodes in foreign document should instead be stored in an object which is specific to that document, and cleaned up when the document is un
loaded, or stored as weak references.
Promise.any() - JavaScript
const perr = new promise((resolve, reject) => { reject('always fails'); }); promise.any([perr]).catch((err) => { console.log(err); }) // expected output: "aggregateerror: no promise in promise.any was resolved" displaying the first image
loaded in this example, we have a function that fetches an image and returns a blob.
WebAssembly.Memory() constructor - JavaScript
the following example (see memory.html on github, and view it live also) fetches and instantiates the
loaded memory.wasm byte code using the webassembly.instantiatestreaming() method, while importing the memory created in the line above.
WebAssembly.Memory.prototype.buffer - JavaScript
examples using buffer the following example (see memory.html on github, and view it live also) fetches and instantiates the
loaded memory.wasm byte code using the webassembly.instantiatestreaming() method, while importing the memory created in the line above.
WebAssembly.Memory - JavaScript
the following example (see memory.html on github, and view it live also) fetches and instantiates the
loaded memory.wasm byte code using the webassembly.instantiatestreaming() method, while importing the memory created in the line above.
WebAssembly.Module.customSections() - JavaScript
the wast2wasm command available as part of the wabt tool has a --debug-names option — specify this during conversion to get a .wasm with a names custom section, for example: wast2wasm simple-name-section.was -o simple-name-section.wasm --debug-names examples using customsections the following example (see the custom-section.html source and live example) compiles the
loaded simple-name-section.wasm byte code.
WebAssembly.Module.exports() - JavaScript
examples using exports the following example (see our index-compile.html demo on github, and view it live also) compiles the
loaded simple.wasm byte code using the webassembly.compilestreaming() method and then sends it to a worker using postmessage().
WebAssembly.Module - JavaScript
examples sending a compiled module to a worker the following example (see our index-compile.html demo on github, and view it live also) compiles the
loaded simple.wasm byte code using the webassembly.compilestreaming() method and then sends the resulting module instance to a worker using postmessage().
WebAssembly.Table.prototype.get() - JavaScript
examples using get the following example (see table.html on github, and view it live also) compiles and instantiates the
loaded table.wasm byte code using the webassembly.instantiatestreaming() method.
WebAssembly.compile() - JavaScript
examples using compile the following example compiles the
loaded simple.wasm byte code using the compile() function and then sends it to a worker using postmessage().
WebAssembly.instantiate() - JavaScript
second overload example the following example (see our index-compile.html demo on github, and view it live also) compiles the
loaded simple.wasm byte code using the webassembly.compilestreaming() method and then sends it to a worker using postmessage().
Strict mode - JavaScript
but strict mode code on the web,
loaded with <script src=""> or <script>...</script>, won't be able to use let/yield as identifiers.
start_url - Web app manifests
type string mandatory no the start_url member is a string that represents the start url of the web application — the prefered url that should be
loaded when the user launches the web application (e.g., when the user taps on the web application's icon from a device's application menu or homescreen).
<mglyph> - MathML
users will see this displayed if the image url is wrong, the image is not in one of the supported formats, or until the image is down
loaded.
Using images in HTML - Web media technologies
mapping the width and height attributes of media container elements to their aspect-ratio this changes how browsers load images so their aspect ratios are calculated by the browser early on and can later be used to correct the display size of an image before it's
loaded.
OpenSearch description format
note: for icons
loaded remotely (that is, from https:// uris as opposed to data: uris), firefox will reject icons larger than 10 kilobytes.
Mobile first - Progressive web apps (PWAs)
then at implementation stage, we present the mobile layout and functionality as the default configuration provided, before additional information is
loaded on top of that, whenever appropriate.
Progressive web apps (PWAs)
most of the features related to a pwa such as geolocation and even service workers are available only once the app has been
loaded using https.
Applying SVG effects to HTML content - SVG: Scalable Vector Graphics
you can rotate the text: <svg height="60" width="200"> <text x="0" y="15" fill="blue" transform="rotate(30 20,50)">example text</text> </svg> using external references svg used for clipping, masking, and filtering can be
loaded from an external source, as long as that source comes from the same origin as the html document to which it's applied.
SVG Conditional Processing Attributes - SVG: Scalable Vector Graphics
externalresourcesrequired requiredextensions requiredfeatures systemlanguage attributes externalresourcesrequired deprecated since svg 2 if set to true, it indicates that the browser must wait for all the external resources necessary to render that element to be
loaded before processing the associated element.
SVG Event Attributes - SVG: Scalable Vector Graphics
roll, onunload document element event attributes oncopy, oncut, onpaste global event attributes oncancel, oncanplay, oncanplaythrough, onchange, onclick, onclose, oncuechange, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, onfocus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, on
loadeddata, on
loadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumechange, onwaiting graphical event attributes onactivate, onfocusin, onf...
begin - SVG: Scalable Vector Graphics
each value can be one of the following: <offset-value> this value defines a clock-value that represents a point in time relative to the beginning of the svg document (usually the load or domcontent
loaded event).
end - SVG: Scalable Vector Graphics
each value can be one of the following: <offset-value> this value defines a clock-value that represents a point in time relative to the beginning of the svg document (usually the load or domcontent
loaded event).
textLength - SVG: Scalable Vector Graphics
by using textlength, you can ensure that your svg text displays at the same width regardless of conditions including web fonts failing to load (or not having
loaded yet).
SVG Attribute reference - SVG: Scalable Vector Graphics
document event attributes onabort, onerror, onresize, onscroll, onunload global event attributes oncancel, oncanplay, oncanplaythrough, onchange, onclick, onclose, oncuechange, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, onfocus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, on
loadeddata, on
loadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumechange, onwaiting graphical event attributes onactivate, onfocusin, onf...
<image> - SVG: Scalable Vector Graphics
svg files displayed with <image> are treated as an image: external resources aren't
loaded, :visited styles aren't applied, and they cannot be interactive.
<script> - SVG: Scalable Vector Graphics
while svg's script element is equivalent to the html <script> element, it has some discrepancies, like it uses the href attribute instead of src and it doesn't support ecmascript modules so far (see browser compatibility below for details) html,body,svg { height:100% } <svg viewbox="0 0 10 10" xmlns="http://www.w3.org/2000/svg"> <script> // <![cdata[ window.addeventlistener('domcontent
loaded', () => { function getcolor () { const r = math.round(math.random() * 255).tostring(16).padstart(2,'0') const g = math.round(math.random() * 255).tostring(16).padstart(2,'0') const b = math.round(math.random() * 255).tostring(16).padstart(2,'0') return `#${r}${g}${b}` } document.queryselector('circle').addeventlistener('click', (e) => { e.target.style.fi...
Linking - SVG: Scalable Vector Graphics
(the problem will be fixed in firefox 2.0.) anyway, the resultant behavior in moz svg is that page2.html will be
loaded into the frame where the svg button was (i.e.
Mixed content - Web security
the mixed content resource that was
loaded via http will show up in red, along with the text "mixed content", which links to this page.
Same-origin policy - Web security
the same-origin policy is a critical security mechanism that restricts how a document or script
loaded from one origin can interact with a resource from another origin.
Securing your site - Web security
http access control the cross-origin resource sharing standard provides a way to specify what content may be
loaded from other domains.
Types of attacks - Web security
for endpoints that require a post request, it's possible to programmatically trigger a <form> submit (perhaps in an invisible <iframe>) when the page is
loaded: <form action="https://bank.example.com/withdraw" method="post"> <input type="hidden" name="account" value="bob"> <input type="hidden" name="amount" value="1000000"> <input type="hidden" name="for" value="mallory"> </form> <script>window.addeventlistener('domcontent
loaded', (e) => { document.queryselector('form').submit(); }</script> there are a few techniques that should be used to pre...
Web security
robots.txt to be written site maps to be written integrity same-origin policy the same-origin policy is a critical security mechanism that restricts how a document or script
loaded from one origin can interact with a resource from another origin.
Web Components
html templates <template> contains an html fragment that is not rendered when a containing document is initially
loaded, but can be displayed at runtime using javascript, mainly used as the basis of custom element structures.
Resources - XSLT: Extensible Stylesheet Language Transformations
xsl results firefox extension (presently awaiting review) - allows one to experiment with xsl, by applying xsl stylesheets (which are manually entered, found via a url or on the file-system) to an xml document (the currently-
loaded document or a manually entered/pasted one).
Index - WebAssembly
2 caching compiled webassembly modules caching, indexeddb, javascript, module, webassembly, compile, wasm caching is useful for improving the performance of an app — we can store compiled webassembly modules on the client so they don't have to be down
loaded and compiled every time.
Using the WebAssembly JavaScript API - WebAssembly
if you have already compiled a module from another language using tools like emscripten, or
loaded and run the code yourself, the next step is to learn more about using the other features of the webassembly javascript api.
WebAssembly
using the webassembly javascript api once you've
loaded a .wasm module, you'll want to use it.