Shared Polymer-based behaviors and modules for implementing and consuming web components.
d2l-polymer-behaviors can be installed from Bower:
bower install d2l-polymer-behaviorsInclude the webcomponents.js "lite" polyfill (for browsers who don't natively support web components), then import the component or scripts as needed.
<head>
<script src="https://s.brightspace.com/lib/webcomponentsjs/0.7.21/webcomponents-lite.min.js"></script>
<link rel="import" href="../d2l-polymer-behaviors/d2l-dom-focus.html">
</head>D2L.Dom
// returns null or the closest ancestor that fulfills the specified predicate fxn
D2L.Dom.findComposedAncestor(node, predicate);
// gets the composed children (including shadow children & distributed children)
D2L.Dom.getComposedChildren(element);
// gets the composed parent (including shadow host & insertion points)
D2L.Dom.getComposedParent(node);
// returns true/false whether the specified ancestorNode is an ancestor of node
D2L.Dom.isComposedAncestor(ancestorNode, node);D2L.Dom.Focus
// get first focusable child or descendant
D2L.Dom.Focus.getFirstFocusableDescendant(element);
// get last focusable child or descendant
D2L.Dom.Focus.getLastFocusableDescendant(element);
// get the next focusable child, sibling, etc.
D2L.Dom.Focus.getNextFocusable(element);
// get the previous focusable child, sibling, etc.
D2L.Dom.Focus.getPreviousFocusable(element);
// get the nearest focusable ancestor
D2L.Dom.Focus.getPreviousFocusableAncestor(element);
// check is focusable (tabindex or white-listed elements)
D2L.Dom.Focus.isFocusable(element);D2L.Dom.Visibility
// checks DOM visibility (includes inline & computed style of element and ancestors)
// ... does not check opacity, elements hidden due to overflow or scrolled out of view
D2L.Dom.Visibility.isVisible(element);D2L.Id
// gets a unique indexed id (for lifetime of page)
D2L.Id.getUniqueId();In production, it's recommended to use a build tool like Vulcanize to combine all your web components into a single import file. More from the Polymer Docs: Optimize for Production...
See the VUI Best Practices & Style Guide for information on VUI naming conventions, plus information about the EditorConfig rules used in this repo.