+++ /dev/null
-<html>
- <head>
- <title>_Templated tests</title>
- <script type="text/javascript" src="../../dojo/dojo.js"
- djConfig="parseOnLoad: true, isDebug: true"></script>
- <script type="text/javascript">
- dojo.require("doh.runner");
-
- dojo.require("dijit._Widget");
- dojo.require("dijit._Templated");
-
- function getOuterHTML(/*DomNode*/ node){
- var wrapper = dojo.doc.createElement("div");
- wrapper.appendChild(node);
- return wrapper.innerHTML.toLowerCase(); // IE prints <BUTTON> rather than <button>; normalize it.
- }
-
- dojo.addOnLoad(function(){
- // Template with no variables (should be cached as a DOM tree)
- dojo.declare("SimpleTemplate", [dijit._Widget, dijit._Templated], {
- attributeMap: {},
- id: "test1",
- templateString: "<button><span>hello > world</span></button>"
- });
-
- // Template with variables
- dojo.declare("VariableTemplate", [dijit._Widget, dijit._Templated], {
- attributeMap: {},
- id: "test2",
- num: 5,
- text: "hello ><\"' world",
-
- templateString: "<button><span num=\"${num}\">${text}</span></button>"
- });
-
- // Template that starts with special node (has to be constructed inside a <tbody>)
- dojo.declare("TableRowTemplate", [dijit._Widget, dijit._Templated], {
- attributeMap: {},
- id: "test3",
- text: "bar",
- templateString: "<tr><td>${text}</td></tr>"
- });
-
- // Illegal subsitition variable name
- dojo.declare("IllegalSubstitution", [dijit._Widget, dijit._Templated], {
- templateString: "<tr><td>${fake}</td></tr>"
- });
-
- // dojoAttachPoint
- dojo.declare("AttachPoint", [dijit._Widget, dijit._Templated], {
- attributeMap: {foo: "", style: "", bar: "buttonNode"},
- templateString: "<div style='border: 1px solid red'>" +
- "<button dojoAttachPoint='buttonNode,focusNode'>hi</button>" +
- '<span><input dojoAttachPoint="inputNode" value="input"></span>' +
- "<span dojoAttachPoint='containerNode'></span>" +
- "</div>"
- });
-
- // dojoAttachEvent
- dojo.declare("AttachEvent", [dijit._Widget, dijit._Templated], {
- click: function(){ this.clickCalled=true; },
- onfocus: function(){ this.focusCalled=true; },
- focus2: function(){ this.focus2Called=true; },
- templateString: "<table style='border: 1px solid blue'><tr>" +
- "<td><button dojoAttachPoint='left' dojoAttachEvent='onclick: click, onfocus'>left</button></td>" +
- "<td><button dojoAttachPoint='right' dojoAttachEvent='onclick: click, onfocus: focus2'>right</button></td>" +
- "</tr></table>"
- });
-
- // TODO:
- // TemplatePath
-
- var testW;
- doh.register("dijit.tests._Templated.html",
- [
- function simple(t){
- var widget=new SimpleTemplate();
- var wrapper=dojo.byId("simpleWrapper");
- wrapper.appendChild(widget.domNode);
- t.is('<button widgetid=\"test1\"><span>hello > world</span></button>', wrapper.innerHTML.toLowerCase());
- },
- function variables(t){
- var widget=new VariableTemplate();
- var wrapper=dojo.byId("variables1Wrapper");
- wrapper.appendChild(widget.domNode);
- t.is('<button widgetid=\"test2\"><span num="5">hello ><"\' world</span></button>', wrapper.innerHTML.toLowerCase());
- },
-
- function variables2(t){
- var widget = new VariableTemplate({id: "myid", num: -5, text: ""});
- var wrapper=dojo.byId("variables2Wrapper");
- wrapper.appendChild(widget.domNode);
- t.is('<button widgetid=\"myid\"><span num="-5"></span></button>', wrapper.innerHTML.toLowerCase());
- },
- function table(t){
- var widget=new TableRowTemplate({text: "hello"});
- var wrapper = dojo.byId("trWrapper");
- wrapper.appendChild(widget.domNode);
- var actual = wrapper.innerHTML.toLowerCase().replace(/\r/g, "").replace(/\n/g, "");
- t.is('<tr widgetid="test3"><td>hello</td></tr>', actual);
- },
- function illegal(t){
- var hadException=false;
- try{
- var widget=new IllegalSubstitution();
- }catch(e){
- console.log(e);
- hadException=true;
- }
- t.t(hadException);
- },
- function attachPoint(t){
- var widget=new AttachPoint();
- var wrapper = dojo.byId("attachPointWrapper");
- wrapper.appendChild(widget.domNode);
- t.is(widget.containerNode.tagName.toLowerCase(), "span");
- t.is(widget.buttonNode.tagName.toLowerCase(), "button");
- t.is(widget.focusNode.tagName.toLowerCase(), "button");
- t.is(widget.inputNode.tagName.toLowerCase(), "input");
- },
- function attributeMap(t){
- var widget=new AttachPoint({foo:"value1", bar:"value2", style:"color: blue"});
- var wrapper = dojo.byId("attributeMapWrapper");
- wrapper.appendChild(widget.domNode);
- t.is("value1", widget.domNode.getAttribute("foo"));
- t.is("value2", widget.buttonNode.getAttribute("bar"));
- // TODO: this is() check is unreliable, IE returns a string like
- // border-right: red 1px solid; border-top: red 1px solid; border-left: red 1px solid; color: blue; border-bottom: red 1px solid
- // t.is("border: 1px solid red; color: blue;", widget.domNode.style.cssText.toLowerCase());
- },
- function attachEvent(t){
- var deferred = new doh.Deferred();
- var widget=new AttachEvent();
- var wrapper = dojo.byId("attachEventWrapper");
- wrapper.appendChild(widget.domNode);
- widget.left.focus();
- widget.right.focus();
- setTimeout(function(){
- t.t(widget.focusCalled);
- t.t(widget.focus2Called);
- deferred.callback(true);
- }, 0);
- return deferred;
- }
- ]
- );
- doh.run();
- });
- </script>
- <style type="text/css">
- @import "../themes/tundra/tundra.css";
- </style>
- </head>
- <body>
- <h1>_Templated test</h1>
- <div id="simpleWrapper"></div>
- <div id="variables1Wrapper"></div>
- <div id="variables2Wrapper"></div>
- <table><tbody id="trWrapper"></tbody></table>
- <div id="attachPointWrapper"></div>
- <div id="attributeMapWrapper"></div>
- <div id="attachEventWrapper"></div>
- </body>
-</html>
projects / eow / blobdiff