Reference

Table of contents

Introduction

This document describes the complete list of features supported by the Widget engine.

Encoding Scheme

All files (e.g., .html, .css, .js) are to be encoded in UTF-8. This is needed for supporting multilanguages. Widgets may not be displayed correctly especially when widgets contain non-ASCII characters when encodings other than UTF-8 are used.

config.xml

config.xml is used to define all necessary properties required by a Web widget. It is mandatory to have a config.xml for each Web widget. This section describes the complete list of supported elements with their usages when defining properties.

< tizen:app-widget > element

Used to define the basic information about a Web widget.

Occurrences:

Expected children:

<tizen:widget-label />
<tizen:widget-content />

Attributes:


< tizen:widget-label > element

Used to define the name of the Web widget.

Occurrences:

Attributes:


< tizen:widget-content > element

Used to define the starting page of the Web widget.

Occurrences:

Expected children:

<tizen:widget-size />

Attributes:


< tizen:widget-size > element

Used to define the size of the Web widget.

The available value is 2 x 2.

Occurrences:

Attributes:


< tizen:widget-metadata > element

It defines a (key, value) pair that can be read by a Web widget via widget_service API. Its main use is to allow developers to define a constant to be read by a Web widget.

Occurrences:

Attributes:


HTML

This section describes the complete list of supported HTML tags and attributes by the Web widget engine. Please note that only the tags and attributes that are mentioned explicitly in this document are supported. In addition, the Widget engine supports only HTML5 documents, and it assumes all input documents are HTML5 documents even if !DOCTYPE is not explicitly specified.

Supported Tag Description
html Supported
head Supported
link Used to specify a CSS style sheet only. Does not support external network URLs.
meta Used to specify a character set only.
style Supported
body Supported
p Supported
div Supported
span Supported
br Supported
img Does not support external network URLs. Supported images are of type .png, .jpg, and .bmp.
script Does not support external network URLs.
DOCTYPE Used to specify that a widget is in HTML5 format.

Global Attributes

The following attributes are supported by all HTML elements.

W3C Reference

https://www.w3.org/TR/html5/dom.html#global-attributes

Attributes

Attribute Allowed Value Syntax
class <string> <element class="classname">
dir ltr | rtl <element dir="ltr">
id <string> <element id="id">
style* <css_styles> <element style="css_styles">

*<css_styles> must conform the widget engine's CSS rules.


html tag

The html tag represents the root of an HTML document.

W3C Reference

https://www.w3.org/TR/html5/semantics.html#the-root-element


head tag

The head tag represents a collection of metadata for the Document.

W3C Reference

https://www.w3.org/TR/html5/document-metadata.html#the-head-element


link tag

The link tag defines a link between a document and an external resource.
The link tag is used to link to external style sheets.

W3C Reference

https://www.w3.org/TR/html5/document-metadata.html#the-link-element

Attributes

Attribute Allowed Value Syntax
rel stylesheet <link rel="stylesheet">
href <URL>* <link href="local_path">
type text/css <link type="text/css">

*<URL> must be a local path.


meta tag

The meta tag represents various kinds of metadata that cannot be expressed using the title, base, link, style, and script elements.

W3C Reference

https://www.w3.org/TR/html5/document-metadata.html#the-meta-element

Attributes

Attribute Allowed Value Syntax
charset UTF-8 <meta charset="UTF-8">


style tag

The style tag allows authors to embed style information in their documents.

W3C Reference

https://www.w3.org/TR/html5/document-metadata.html#the-style-element

Attributes

Attribute Allowed Value Syntax
type text/css <style type="text/css">


body tag

The body tag represents the content of the document.

W3C Reference

https://www.w3.org/TR/html5/sections.html#the-body-element


p tag

The p tag represents a paragraph.

W3C Reference

https://www.w3.org/TR/html5/grouping-content.html#the-p-element


div tag

The div tag has no special meaning at all. It represents its children.

W3C Reference

https://www.w3.org/TR/html5/grouping-content.html#the-div-element


span tag

Description

The span tag doesn't mean anything on its own, but can be useful when used together with the global attributes, e.g. class or id. It represents its children.

W3C Reference

https://www.w3.org/TR/html5/text-level-semantics.html#the-span-element


br tag

The br tag represents a line break.

W3C Reference

https://www.w3.org/TR/html5/text-level-semantics.html#the-br-element


img tag

An img tag represents an image.

W3C Reference

https://www.w3.org/TR/html5/embedded-content-0.html#the-img-element

Attributes

Attribute Allowed Value Syntax
src <URL>* <img src="local_path">
height pixels <img height="pixels">
width pixels <img width="pixels">

*<URL> must be a local path. Supported images are of type .png, .jpg, and .bmp.


script tag

The script tag allows authors to include dynamic script and data blocks in their documents. The tag does not represent content for the user.

W3C Reference

https://www.w3.org/TR/html5/scripting-1.html#the-script-element

Attributes

Attribute Allowed Value Syntax
src <URL>* <script src="local_path">
type text/javascript <script type="text/javascript">
charset UTF-8 <script charset="UTF-8">

*<URL> must be a local path.


DOCTYPE

The DOCTYPE declaration must be the very first thing in your HTML document, before the tag. The Web widget engine only supports HTML5. Other versions of HTMLs and HTML modes (such as quirks mode) are not supported.

W3C Reference

https://www.w3.org/TR/html5/syntax.html#the-doctype

Attributes

Attribute Allowed Value Syntax
html <!DOCTYPE html>

Attribute is explicitly left as blank.


DOM

NonElementParentNode

W3C Reference

https://www.w3.org/TR/domcore/#interface-nonelementparentnode

Methods

Method Declaration Description
getElementById node . getElementById(elementId) Returns the first element within node's descendants whose ID is elementId.


ParentNode

W3C Reference

https://www.w3.org/TR/domcore/#interface-parentnode

Attributes

Attribute Type Description
children collection = node . children Returns the child elements.
firstElementChild element = node . firstElementChild Returns the first child that is an element, and null otherwise.
lastElementChild element = node . lastElementChild Returns the last child that is an element, and null otherwise.
childElementCount unsigned long childElementCount Returns the number of children of the context object that are elements.


NonDocumentTypeChildNode

W3C Reference

https://www.w3.org/TR/domcore/#interface-nondocumenttypechildnode

Attributes

Attribute Type Description
previousElementSibling element = node . previousElementSibling Returns the first preceding sibling that is an element, and null otherwise.
nextElementSibling element = node . nextElementSibling Returns the first following sibling that is an element, and null otherwise.


ChildNode

W3C Reference

https://www.w3.org/TR/domcore/#childnode

Methods

Method Declaration Description
remove node . remove() Returns the number of nodes in the collection.


NodeList

W3C Reference

https://www.w3.org/TR/domcore/#nodelist

Methods

Method Declaration Description
item element = collection . item(index) element = collection[index] Returns the node with index index number from the collection. The nodes are sorted in tree order.

Attributes

Attribute Type Description
length collection . length Returns the number of elements in the collection.


HTMLCollection

W3C Reference

https://www.w3.org/TR/domcore/#htmlcollection

Attributes

Attribute Type Description
length collection . length Returns the number of elements in the collection.

Methods

Method Declaration Description
item element = collection . item(index) element = collection[index] Returns the element with index index number from the collection. The elements are sorted in tree order.
namedItem element = collection . namedItem(name)
element = collection[name] 		Returns the first element with ID or name name from the collection.


Node

W3C Reference

https://www.w3.org/TR/domcore/#interface-node

Attributes

Attribute Type Description
nodeType node . nodeType Returns the type of node.
nodeName node . nodeName Returns a string appropriate for the type of node.
parentNode node . parentNode Returns the parent.
childNodes node . childNodes Returns the children.
firstChild node . firstChild Returns the first child.
lastChild node . lastChild Returns the last child.
previousSibling node . previousSibling Returns the previous sibling.
nextSibling node . nextSibling Returns the next sibling.
nodeValue node . nodeValue If node is Text, Comment or ProcessingInstruction, returns the context object's data.
Otherwise returns Null.
textContent node . textContent If node is Element, returns the concatenation of data of all the Text node descendants of the context object, in tree order.
If node is Text or Comment, returns the context object's data.
Otherwise returns Null.

Methods

Method Declaration Description
hasChildNodes node . hasChildNodes() Returns whether node has children.
cloneNode node . cloneNode([deep = false]) Returns a copy of node. If deep is true, the copy also includes the node's descendants.
isEqualNode node . isEqualNode(other) Returns whether node and other have the same properties.
compareDocumentPosition node . compareDocumentPosition(other) Returns a bitmask indicating the position of other relative to node.
contains node . contains(other) Returns true if other is an inclusive descendant of node, and false otherwise.
insertBefore insertBefore(node, child) Inserts Node before child.
appendChild appendChild(node) Adds node to the end of child list.
replaceChild replaceChild(node, child) Replaces child to Node.
removeChild removeChild(child) Removes child.


Document

W3C Reference

https://www.w3.org/TR/domcore/#document

Attributes

Attribute Type Description
compatMode document . compatMode Returns the string "CSS1Compat".
characterSet document . characterSet Returns document's encoding type "UTF8".
contentType document . contentType Returns document's content type "text/html".
doctype document . doctype Returns the doctype or null if there is none.
documentElement document . documentElement Returns the document element.

Methods

Method Declaration Description
getElementsByTagName collection = document . getElementsByTagName(localName) If localName is "*" returns an HTMLCollection of all descendant elements.Otherwise, returns an HTMLCollection of all descendant elements whose local name is localName.
getElementsByClassName collection = document . getElementsByClassName(classes)
collection = element . getElementsByClassName(classes) 		Returns an HTMLCollection of the elements in the object on which the method was invoked (a document or an element) that have all the classes given by classes.
createElement element = document . createElement(localName) Returns an element in the HTML namespace with localName as local name.
createTextNode text = document . createTextNode(data) Returns a Text node whose data is data.
createComment comment = document . createComment(data) Returns a Comment node whose data is data.


DocumentType

W3C Reference

https://www.w3.org/TR/domcore/#interface-documenttype

Attributes

Attribute Type Description
name node . name Returns the name.


Element

W3C Reference

https://www.w3.org/TR/domcore/#element

Attributes

Attribute Type Description
localName element . localName Return the value of the attribute in element's attribute list whose namespace is namespace and local name is localName, if it has one, and null otherwise.
tagName element . tagName If namespace prefix is not null, returns the concatenation of namespace prefix, ":", and local name. Otherwise it returns the local name.
id element . id Reflects the "id" content attribute.
className element . className Reflects the "class" content attribute.
classList element . classList Returns the associated DOMTokenList object representing the context object's classes.
attributes element . attributes Returns a NamedNodeMap.

Methods

Method Declaration Description
getAttribute element . getAttribute(name) Returns the value of the first attribute in the context object's attribute list whose name is name, and null otherwise.
setAttribute element . setAttribute(name, value) Changes the attribute whose name is name from context object to value.
removeAttribute element . removeAttribute(name) Removes the first attribute from the context object whose name is name, if any.
hasAttribute element . hasAttribute(name) Returns true if the context object has an attribute whose name is name, and false otherwise.
getElementsByTagName element . getElementsByTagName(localName) Returns the list of elements with local name localName for the context object.
getElementsByClassName element . getElementsByClassName(classNames) Returns the list of elements with class names classNames for the context object.


Attr

W3C Reference

https://www.w3.org/TR/domcore/#attr

Attributes

Attribute Type Description
name element . name Return the name.
value element . value Return the value.
specified element . specified Return true.


CharacterData

W3C Reference

https://www.w3.org/TR/domcore/#characterdata

Attributes

Attribute Type Description
data node . data Returns data, and on setting, must replace data with node context object offset 0, count length attribute value, and data new value.
length node . length Returns the number of code units in data.


Text

W3C Reference

https://www.w3.org/TR/domcore/#text

Attributes

Attribute Type Description
wholeText text . wholeText Returns a concatenation of the data of the contiguous Text nodes of the context object, in tree order.


Comment

W3C Reference

https://www.w3.org/TR/domcore/#interface-comment


DOMTokenList

W3C Reference

https://www.w3.org/TR/domcore/#interface-domtokenlist

Attributes

Attribute Type Description
length tokenlist . length Returns the number of tokens.

Methods

Method Declaration Description
item tokenlist . item(index)
tokenlist[index] 		Returns the token with the index index number.
contains tokenlist . contains(token) Returns true if token is present, and false otherwise.
add tokenlist . add(tokens...) Adds all arguments passed, except those already present.
remove tokenlist . remove(tokens...) Removes arguments passed, if they are present.
toggle tokenlist . toggle(token [, force]) If force is not specified, "toggles" token, removing it if it is present and adding it if it is not. If force is true, adds token (same as add()). If force is false, removes token (same as remove()).
Returns true if token is now present, and false otherwise.


Window

W3C Reference

https://www.w3.org/TR/html5/browsers.html#the-window-object
https://www.w3.org/TR/cssom-view-1

Attributes

Attribute Type Description
window window . window Returns window.
document window . document Returns the document associated with window.
innerHeight window . innerHeight Returns the inner height of a window's content area.
innerWidth window . innerWidth Returns the inner width of a window's content area.

Named Access on the Window Object

https://html.spec.whatwg.org/multipage/browsers.html#named-access-on-the-window-object
Named access on the Window object returns the indicated element. Its syntax is:

window[id]

where id is a non-empty ID of an HTML element in the current document.


WindowTimers

W3C Reference

https://www.w3.org/TR/html5/webappapis.html#timers

Methods

Method Declaration Description
setTimeout handle = window . setTimeout( handler [, timeout [, arguments... ] ] ) Calls a function or evaluates an expression after a specified number of milliseconds.
clearTimeout window . clearTimeout( handle ) Clears a timer set with setTimeout().
setInterval handle = window . setInterval( handler [, timeout [, arguments... ] ] ) Calls a function or evaluates an expression at specified intervals (in milliseconds).
clearInterval window . clearInterval( handle ) Clears a timer set with setInterval().


Event

Global Attributes

Attributes that are common to all elements in the HTML language.

W3C Reference

https://www.w3.org/TR/html5/webappapis.html#event-handler-attributes

Event-Handler Attribute
Attribute Description
onclick The onclick event occurs when the user clicks on an element
onload The onload event occurs when an object has been loaded


DOM Event

Event

The Event interface is used to provide contextual information about an event to the handler processing the event. An object which implements the Event interface is generally passed as the first parameter to an event handler.

W3C Reference

https://www.w3.org/TR/domcore/#interface-event

Constants

Constant Description
CAPTURING_PHASE The current event phase is the capturing phase.
AT_TARGET The event is currently being evaluated at the target EventTarget.
BUBBLING_PHASE The current event phase is the bubbling phase.
NONE Events not currently dispatched are in this phase.

Attributes

Attribute Description
bubbles Used to indicate whether or not an event is a bubbling event
cancelable Used to indicate whether or not an event can have its default action prevented
currentTarget Used to indicate the EventTarget whose EventListeners are currently being processed
eventPhase Used to indicate which phase of event flow is currently being evaluated.
target Used to indicate the EventTarget to which the event was originally dispatched.
timeStamp Returns the number of milliseconds (after midnight January 1, 1970), when the event occurred
type Name of the event type (case-insensitive).
defaultPrevented Checks whether the preventDefault() method was called for the event

Methods

Method Description
preventDefault If an event is cancelable, the preventDefault method is used to signify that the event is to be canceled
stopPropagation Prevents further propagation of the current event in the bubbling phase
stopImmediatePropagation Prevents other listeners of the same event from being called

Properties

Property Description
EventInit::bubbles Initializes an Event object with bubbles
EventInit::cancelable Initializes an Event object with cancelable

EventTarget

The EventTarget interface is implemented by all Nodes in an implementation which supports the DOM Event Model. Therefore, this interface can be obtained by using binding-specific casting methods on an instance of the Node interface. The interface allows registration and removal of EventListeners on an EventTarget and dispatch of events to that EventTarget.

W3C Reference

https://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-EventTarget

Methods

Method Description
addEventListener Attaches an event handler to the specified element
removeEventListener Removes an event handler that has been attached with the addEventListener() method
dispatchEvent Allows the dispatch of events into the implementations event model

EventListener

The EventListener interface is the primary method for handling events. Users implement the EventListener interface and register their listener on an EventTarget using the AddEventListener method. The users should also remove their EventListener from its EventTarget after they have completed using the listener.

W3C Reference

https://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-interface

ProgressEvent

Description

ProgressEvent is dispatched on XMLHttpRequest object. Events using the ProgressEvent interface indicate some kind of progression.

W3C Reference

https://www.w3.org/TR/progress-events

Attributes

Attribute Description
lengthComputable Progress has started
loaded In progress
total Progress failed

Properties

Property Description
ProgressEventInit::lengthComputable Initialize a ProgressEvent object with lengthComputable
ProgressEventInit::loaded Initialize a ProgressEvent object with loaded
ProgressEventInit::total Initialize a ProgressEvent object with total


CSS

Margin

The margin properties specify the width of the margin area of a box.
Basically, all CSS values have initial and inherit keywords in common.

W3C Reference

https://www.w3.org/TR/CSS2/box.html#margin-properties
https://www.w3.org/TR/CSS2/syndata.html#length-units

Properties

Property Allowed Value Description
margin <margin-width>{1,4} The margin shorthand property sets all the margin properties in one declaration
margin-bottom <length> | <percentage> | auto Sets the bottom margin of an element
margin-left <length> | <percentage> | auto Sets the left margin of an element
margin-right <length> | <percentage> | auto Sets the right margin of an element
margin-top <length> | <percentage> | auto Sets the top margin of an element

<margin-width> may take one of the following values: <length>, <percentage>, auto


Padding

The padding properties specify the width of the padding area of a box.

W3C Reference

https://www.w3.org/TR/CSS2/box.html#padding-properties

Properties

Property Allowed Value Description
padding <padding-width>{1,4} The padding shorthand property sets all the padding properties in one declaration
padding-bottom <length> | <percentage> Sets the bottom padding for an element
padding-left <length> | <percentage> Sets the left padding for an element
padding-right <length> | <percentage> Sets the right padding for an element
padding-top <length> | <percentage> Sets the top padding for an element

<padding-width> may take one of the following values: <length>, <percentage>


Border

The border can either be a predefined style (solid line) or it can be an image. In the former case, various properties define the style (<border-style>), color (<border-color>), and thickness (<border-width>) of the border.

W3C Reference

https://www.w3.org/TR/css3-border
https://www.w3.org/TR/CSS2/box.html#border-properties

Properties

Property Allowed Value Description
border <border-width>   <border-style>   <border-color> Sets all the border properties (shorthand).
border-top <border-width>   <border-style>   <border-color> Sets all the top border properties (shorthand).
border-right <border-width>   <border-style>   <border-color> Sets all the right border properties (shorthand).
border-bottom <border-width>   <border-style>   <border-color> Sets all the bottom border properties (shorthand).
border-left <border-width>   <border-style>   <border-color> Sets all the left border properties (shorthand).
border-color <border-color>{1,4} Sets the color of the four borders (shorthand).
border-top-color <color> | transparent Sets the color of the top border.
border-right-color <color> | transparent Sets the color of the right border.
border-bottom-color <color> | transparent Sets the color of the bottom border.
border-left-color <color> | transparent Sets the color of the left border.
border-style <border-style>{1,4} Sets the style of the four borders (shorthand).
border-top-style none | solid Sets the style of the top border.
border-right-style none | solid Sets the style of the right border.
border-bottom-style none | solid Sets the style of the bottom border.
border-left-style none | solid Sets the style of the left border.
border-width <border-width> Sets the width of the four borders (shorthand).
border-top-width medium | thin | thick | <length> Sets the width of the top border.
border-right-width medium | thin | thick | <length> Sets the width of the left border.
border-bottom-width medium | thin | thick | <length> Sets the width of the bottom border.
border-left-width medium | thin | thick | <length> Sets the width of the left border.
border-image-source <image> | none The path to the image is to be used as a border
border-image-slice <number> && fill? How to slice the border image.
<number> value can take only one value and initial value is 0 (not 100%).
border-image-width <length> | <number> Width of the border image.
<number> value represents multiples of the corresponding border-top-width.

<border-width> may take one of the following values: thin, medium, thick, <length>
<border-color> may take one of the following values: <color>, transparent
<border-style> may take one of the following values: none, solid


Display

The display property specifies the type of box used for an HTML element

W3C Reference

https://www.w3.org/TR/CSS2/visufx.html#visibility
https://www.w3.org/TR/CSS2/visuren.html#display-prop

Properties

Property Allowed Value Description
display block | inline | inline-block | none Displays elements as inline elements
visibility visible | hidden Specifies whether or not an element should be visible


Positioning

Each element in the document tree generates zero or more boxes according to the box model. The layout of these boxes is governed by box dimensions, type, positioning scheme, relationships between in the document tree and external information.

W3C Reference

https://www.w3.org/TR/CSS2/visuren.html#positioning-scheme
https://www.w3.org/TR/CSS2/visuren.html#layers
https://www.w3.org/TR/CSS2/visuren.html#propdef-direction
https://www.w3.org/TR/CSS2/visudet.html
https://www.w3.org/TR/CSS2/visufx.html

Properties

Property Allowed Value Description
position static | absolute | relative The position property specifies the type of positioning method used for an element.
top <length> | <percentage> | auto Sets the top edge of an element to a unit above/below the top edge of its nearest positioned ancestor.
right <length> | <percentage> | auto Sets the right edge of an element to a unit above/below the right edge of its nearest positioned ancestor.
bottom <length> | <percentage> | auto Sets the bottom edge of an element to a unit above/below the bottom edge of its nearest positioned ancestor.
left <length> | <percentage> | auto Sets the left edge of an element to a unit above/below the left edge of its nearest positioned ancestor.
z-index auto | <integer> Specifies the stack order of an element.
direction* ltr Specifies the text direction/writing direction.
width <length> | <percentage> | auto Sets the width of an element.
height <length> | <percentage> | auto Sets the height of an element.
vertical-align baseline | sub | super | top | text-top | middle | bottom | text-bottom | <length> | <percentage> Sets the vertical alignment of an element.
line-height normal | <number> | <length> | <percentage> Sets the line height.
overflow visible | hidden Specifies what happens if content overflows an element's box.

*CSS direction property only accepts "ltr" as a value. To support right-to-left text, the dir attribute in an HTML element should be used, e.g., <html dir="rtl">


Color

CSS uses color-related properties and values to color the text, backgrounds, borders, and other parts of elements in a document.

W3C Reference

https://www.w3.org/TR/css3-color

Property

Property Allowed Value Description
color <color> Sets the color of text
HSL color value is not supported
opacity alpha value (0.0 ~ 1.0) Sets the opacity level for an element


Background

The background property sets all the background properties.

W3C Reference

https://www.w3.org/TR/css3-background https://www.w3.org/TR/CSS2/colors.html#background

Properties

Property Allowed Value Description
background <background-color>   <background-image>   <background-repeat> A shorthand property for setting all the background properties in one declaration
background-color <color> | transparent Specifies the background color of an element.
background-image <uri> | none Specifies one or more background images for an element.
Multiple layering is not supported.
background-repeat repeat | repeat-x | repeat-y | no-repeat Sets how a background image will be repeated
background-size <length> | <percentage> | auto | cover | contain Specifies the size of the background image(s).


Font

A font provides a resource containing the visual representation of characters.

W3C Reference

https://www.w3.org/TR/CSS2/fonts.html

Properties

Property Allowed Value Description
font-style normal | italic | oblique Specifies the font style for text.
font-weight normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 Specifies the weight of a font.
font-size medium | xx-small | x-small | small | large | x-large | xx-large | smaller | larger | <length> | <percentage> Specifies the font size of text.


Text

This CSS3 module defines properties for text manipulation and specifies their processing model. It covers line breaking, justification and alignment, white space handling, and text transformation.

W3C Reference

https://www.w3.org/TR/CSS2/text.html

Property

Property Allowed Value Description
text-align left | right | center Specifies the horizontal alignment of text in an element
text-decoration none | underline | line-through Specifies the decoration added to the text


Transform

The transform property applies a 2D transformation to an element. This property allows you to rotate, scale, move and skew. A transformable element is an element whose layout is governed by the CSS box model which is either a block-level or atomic inline-level element.

W3C Reference

https://www.w3.org/TR/css3-transforms

Properties

Property Allowed Value Description
transform none | matrix | translate | translateX | translateY | scale | scaleX | scaleY | rotate | skew | skewX | skewY Applies a 2D transformation to an element.
transform-origin <percentage> | <length> | top | right | bottom | left | center Changes the position of transformed elements


Selector

In CSS, selectors are patterns used to select the element(s) you want to style.

W3C Reference

https://www.w3.org/TR/CSS2/selector.html

Selectors

Type Pattern Example Description
Universal Selector * * Selects all elements.
Type Selector element p Selects all <p> elements
The 'OR' condition is allowed (for example, element, element)
Dynamic Pseudo Selector element:active p:active Selects the active element
Support only :active pseudo-class
Class Selector element.class div.intro Selects all <div> elements with class="intro"
A subset matching of "class" values is not allowed (for example, div.class1.class2)
ID Selector element#id div#firstname Selects an <div> element with id="firstname"


Other DOM APIs

XMLHttpRequest

An XMLHttpRequest object is an API for fetching resources.

W3C Reference

https://www.w3.org/TR/XMLHttpRequest/#interface-xmlhttprequest

Event handlers

W3C Reference

https://www.w3.org/TR/XMLHttpRequest/#event-handlers

XMLHttpRequestEventTarget Object

The following are the event handlers supported by an XMLHttpRequestEventTarget object as attributes.

Event handler Description
onloadstart The request starts.
onprogress Transmitting data.
onabort The request has been aborted. For instance, by invoking the abort() method.
onerror The request has failed.
onload The request has successfully completed.
ontimeout The author specified timeout has passed before the request completed.
onloadend The request has completed (either in success or failure).
XMLHttpRequest Object

The following are the event handlers supported by an XMLHttpRequestEventTarget object as attributes.

Event handler Description
onreadystatechange The readyState attribute changes value, except when it changes to UNSENT.

States

W3C Reference

https://www.w3.org/TR/XMLHttpRequest/#states

Attributes
Attribute Type Description
readyState client . readyState Returns the current state.
States
States Description Numeric Value
UNSENT The object has been constructed. 0
OPENED The open() method has been successfully invoked. 1
HEADERS_RECEIVED All redirects (if any) have been followed and all HTTP headers of the final response have been received. 2
LOADING The response entity body is being received. 3
DONE The data transfer has been completed or something went wrong during the transfer (for example, infinite redirects). 4

Request

W3C Reference

https://www.w3.org/TR/XMLHttpRequest/#request

Attributes
Attribute Type Description
timeout client . timeout Can be set to a time in milliseconds.
Methods
Method Declaration Description
open client . open(method, url [, async = true [, username = null [, password = null]]]) Sets the request method, request URL, and synchronous flag.
Supported request method : GET, POST
send client . send([data = null]) Initiates the request. The optional 'data' argument allows only UTF-8 encoded string type. The argument is ignored if request method is GET.
abort client . abort() Cancels any network activity.

Response

W3C Reference

https://www.w3.org/TR/XMLHttpRequest/#response

Attributes
Attribute Type Description
status client . status Returns the HTTP status code.
responseText client . responseText Returns the text response entity body. The allowed character set for response text is UTF-8.

Multithreading

The number of concurrent XHR objects are managed by a threadpool, and its default value is two.


Page Visibility

W3C Reference

https://www.w3.org/TR/page-visibility/

Attributes
Attribute Type Description
hidden boolean Returns true if the Document contained by the top level browsing context (root window in the browser's viewport) [HTML5] is not visible at all.
visibilityState VisibilityState Returns one of the following DOMStrings: hidden, visible
Event handlers
Event handler Description
visibilitychange Fire when the content of a tab has become visible or has been hidden.


Timing Control for Script-based Animations

W3C Reference

https://www.w3.org/TR/animation-timing/

Methods
Method Declaration Description
requestAnimationFrame window . requestAnimationFrame(callback) Used to signal to the user agent that a script-based animation needs to be resampled.
cancelAnimationFrame window . cancelAnimationFrame(handle) Used to cancel a previously made request to schedule an animation frame update.


Web Device API

The following describes Web device APIs supported by Widget Engine. Supported intefaces and methods are generally the same as the interfaces and methods supported by Tizen API, respectively. If there are exceptions, they are explicitly mentioned below.

Base

API Description
Filesystem This API provides access to the file system of a device.

Application Framework

API Description
Application This API provides information about running and installed applications and controls them.
Unsupported methods
- ApplicationManager: Application getCurrentApplication()
- Application: void exit()
- Application: void hide()
- Application: RequestedApplicationControl getRequestedAppControl()
Message Port This API provides the functionality for communication with other applications.

System

API Description
Sensor This API provides interfaces and methods for getting sensor data from the various device sensors.
System Information This API provides information about the device's display, network, storage and other capabilities.
Unsupported feature: Getting 'LOCALE' value using addPropertyValueChangeListener() is not supported. Because when 'LOCALE' is changed, web widget will be restarted so it is not possible to get 'LOCALE' at runtime.
SAP The Samsung Accessory Protocol (SAP) APIs offers services that enable mobile devices to establish connections and exchange data with web widget applications.

The SAP(Samsung Accessory Protocol) is a Samsung Extension API.