ariahistogramtests.html revision 4c307472e86c080e30ac5eb2ce60ab4f6fc10b28
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style>
/*Supplemental: CSS for the YUI distribution*/
#custom-doc { width: 95%; min-width: 950px; }
#pagetitle {background-image: url(/assets/bg_hd.gif);}
#mychart {
padding:10px 10px 10px 10px;
}
</style>
<link rel="stylesheet" type="text/css" href="/build/cssfonts/fonts-min.css">
</head>
<body class="yui3-skin-sam">
<h3>Aria Histogram Tests</h3>
<div id="mychart"></div>
<script type="text/javascript" src="/build/yui/yui-min.js"></script>
<script>
YUI({
allowRollup: false,
filter: (window.location.search.match(/[?&]filter=([^&]+)/) || [])[1] || 'min'
}).use('charts', 'test', 'console', function (Y)
{
Y.namespace("example.test");
var suite = new Y.Test.Suite("Y.Charts.AriaHistogram"),
myDataValues = [
{category:"5/1/2010", values:2000, expenses:3700, revenue:2200},
{category:"5/2/2010", values:50, expenses:9100, revenue:100},
{category:"5/3/2010", values:400, expenses:1100, revenue:1500},
{category:"5/4/2010", values:200, expenses:1900, revenue:2800},
{category:"5/5/2010", values:5000, expenses:5000, revenue:2650}
],
pieDataValues = [
{category:"5/1/2010", revenue:2200},
{category:"5/2/2010", revenue:100},
{category:"5/3/2010", revenue:1500},
{category:"5/4/2010", revenue:2800},
{category:"5/5/2010", revenue:2650}
],
defaultAriaDescription = "Use the up and down keys to navigate between series. Use the left and right keys to navigate through items in a series.",
defaultPieAriaDescription = "Use the left and right keys to navigate through items.",
seriesKeys = ["values", "revenue"],
width = 400,
height = 300;
function AriaTests(cfg, testConfig)
{
AriaTests.superclass.constructor.apply(this);
this.attrConfig = cfg;
this.name = testConfig.type + " Aria Tests";
this.defaultAriaDescription = testConfig.defaultAriaDescription;;
}
Y.extend(AriaTests, Y.Test.Case, {
defaultAriaLabel: "Chart Application",
changedAriaLabel: "This is a new ariaLabel value.",
setUp: function() {
var mychart = new Y.Chart(this.attrConfig);
this.chart = mychart;
},
tearDown: function() {
this.chart.destroy();
},
"test:getAriaLabel()": function()
{
Y.Assert.isTrue(this.chart.get("ariaLabel") == this.defaultAriaLabel);
},
"test:setAriaLabel()": function()
{
var chart = this.chart;
chart.set("ariaLabel", this.changedAriaLabel);
Y.Assert.isTrue(chart.get("ariaLabel") == this.changedAriaLabel);
},
"test:getAriaDescription()": function()
{
Y.Assert.isTrue(this.chart.get("ariaDescription") == this.defaultAriaDescription);
},
"test:setAriaDescription()": function()
{
var chart = this.chart;
chart.set("ariaDescription", this.changedAriaLabel);
Y.Assert.isTrue(chart.get("ariaDescription") == this.changedAriaLabel);
}
});
Y.AriaTests = AriaTests;
var columnTests = new Y.AriaTests({
dataProvider: myDataValues,
render: "#mychart",
type: "column",
width: width,
height: height
}, {
type: "Column",
defaultAriaDescription: defaultAriaDescription
}),
stackedColumnTests = new Y.AriaTests({
dataProvider: myDataValues,
render: "#mychart",
type: "column",
stacked: true,
width: width,
height: height
}, {
type: "StackedColumn",
defaultAriaDescription: defaultAriaDescription
}),
barTests = new Y.AriaTests({
dataProvider: myDataValues,
render: "#mychart",
type: "bar",
width: width,
height: height
}, {
type: "Bar",
defaultAriaDescription: defaultAriaDescription
}),
stackedBarTests = new Y.AriaTests({
dataProvider: myDataValues,
render: "#mychart",
type: "bar",
stacked: true,
width: width,
height: height
}, {
type: "StackedBar",
defaultAriaDescription: defaultAriaDescription
});
suite.add(columnTests);
suite.add(stackedColumnTests);
suite.add(barTests);
suite.add(stackedBarTests);
//create the console
var r = new Y.Console({
newestOnTop : false,
style: 'block' // to anchor in the example content
});
r.render('#testLogger');
//run the tests
Y.Test.Runner.setName("Y.Charts.AriaHistogram");
Y.Test.Runner.add(suite);
Y.Test.Runner.run();
});
</script>
</body>
</html>