Permalink
Browse files

Add `IS_DOCUMENT_GETELEMENTSBYNAME_BUGGY` test. Make sure `window` re…

…ferences a global object. Make sure to check `style` existence before accessing it in `IS_CSS_TRANSFORMATION_SUPPORTED` test. A test variable created in `WINDOW_EVAL_EVALUATES_IN_GLOBAL_SCOPE` is now in a form of variable declaration, rather than function declaration. Add a test page for `getStyleProperty` with some of the CSS2/3 properties.
  • Loading branch information...
Juriy Zaytsev
Juriy Zaytsev committed May 9, 2009
1 parent 1e17546 commit 2d3b4e195ca1426750349d4036fb42d809c3065c
Showing with 180 additions and 10 deletions.
  1. +42 −10 feature_tests.js
  2. +32 −0 getStyleProperty.js
  3. +10 −0 index.html
  4. +96 −0 style.html
View
@@ -23,14 +23,17 @@ SOFTWARE.
var t = new Date();
+ // make sure `window` resolves to a global object
+ var window = this;
+
var features = { };
var bugs = { };
features.IS_CSS_TRANSFORMATION_SUPPORTED = (features.__IS_CSS_TRANSFORMATION_SUPPORTED = function(){
- var docEl = document.documentElement;
- if (docEl && docEl.style) {
- return (typeof docEl.style.WebkitTransform == 'string'
- || typeof docEl.style.MozTransform == 'string');
+ var docEl = document.documentElement, s;
+ if (docEl && (s = docEl.style)) {
+ return (typeof s.WebkitTransform == 'string'
+ || typeof s.MozTransform == 'string');
}
return null;
})();
@@ -61,8 +64,10 @@ SOFTWARE.
features.ARRAY_PROTOTYPE_SLICE_CAN_CONVERT_NODELIST_TO_ARRAY = (features.__ARRAY_PROTOTYPE_SLICE_CAN_CONVERT_NODELIST_TO_ARRAY = function(){
try {
return (Array.prototype.slice.call(document.forms, 0) instanceof Array);
- } catch(e) { };
- return false;
+ }
+ catch(e) {
+ return false;
+ }
})();
features.WINDOW_EVAL_EVALUATES_IN_GLOBAL_SCOPE = (features.__WINDOW_EVAL_EVALUATES_IN_GLOBAL_SCOPE = function(){
@@ -71,11 +76,16 @@ SOFTWARE.
try {
// catch indirect eval call errors (i.e. in such clients as Blackberry 9530)
- window.eval('function ' + fnId + '(){}');
+ window.eval('var ' + fnId + '=true');
} catch(e) { }
- passed = (fnId in window);
+ passed = (window[fnId] === true);
if (passed) {
- delete window[fnId];
+ try {
+ delete window[fnId];
+ }
+ catch(e) {
+ window[fnId] = void 0;
+ }
}
return passed;
})();
@@ -210,7 +220,7 @@ SOFTWARE.
var value = 'rgba(1,1,1,0.5)',
el = document.createElement('p'),
re = /^rgba/;
- if (el && el.style && re.test) {
+ if (el && el.style && typeof re.test == 'function') {
try {
el.style.color = value;
result = re.test(el.style.color);
@@ -524,6 +534,28 @@ SOFTWARE.
return isBuggy;
})();
+ bugs.IS_DOCUMENT_GETELEMENTSBYNAME_BUGGY = (bugs.__IS_DOCUMENT_GETELEMENTSBYNAME_BUGGY = function(){
+ var isBuggy = null,
+ docEl = document.documentElement;
+ if (docEl &&
+ docEl.appendChild &&
+ docEl.removeChild &&
+ document.getElementsByName &&
+ document.createElement) {
+ var el = document.createElement('div');
+ if (el) {
+ var uid = 'x' + (Math.random() + '').slice(2);
+ el.id = uid;
+ docEl.appendChild(el);
+ isBuggy = document.getElementsByName(uid)[0] === el;
+ docEl.removeChild(el);
+ el = null;
+ }
+ }
+
+ return isBuggy;
+ })();
+
__global.__totalTime = (new Date() - t);
__global.__features = features;
View
@@ -0,0 +1,32 @@
+/**
+ * @method getStyleProperty
+ * @param {String} propName style property to test
+ * @param {HTMLElement} element optional optional element to test
+ * @return {String | undefined}
+ *
+ * @example getStyleProperty('borderRadius');
+ */
+var getStyleProperty = (function(){
+
+ var prefixes = ['Moz', 'Webkit', 'Khtml', 'O', 'Ms'];
+
+ function getStyleProperty(propName, element) {
+ element = element || document.documentElement;
+ var style = element.style,
+ prefixed;
+
+ // test standard property first
+ if (typeof style[propName] == 'string') return propName;
+
+ // capitalize
+ propName = propName.charAt(0).toUpperCase() + propName.slice(1);
+
+ // test vendor specific properties
+ for (var i=0, l=prefixes.length; i<l; i++) {
+ prefixed = prefixes[i] + propName;
+ if (typeof style[prefixed] == 'string') return prefixed;
+ }
+ }
+
+ return getStyleProperty;
+})();
View
@@ -386,6 +386,16 @@ <h2>Bugs:</h2>
<td><a href="#" title="show test code" class="show-test-code">show</a></td>
</tr>
<tr style="display:none"><td colspan="5" class="test-code"><pre></pre></td></tr>
+
+ <tr>
+ <td>IS_DOCUMENT_GETELEMENTSBYNAME_BUGGY</td>
+ <td></td>
+ <td>IE6+</td>
+ <td></td>
+ <td><a href="#" title="show test code" class="show-test-code">show</a></td>
+ </tr>
+ <tr style="display:none"><td colspan="5" class="test-code"><pre></pre></td></tr>
+
</tbody>
</table>
View
@@ -0,0 +1,96 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+ "http://www.w3.org/TR/html4/strict.dtd">
+<html lang="en-US">
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+ <meta http-equiv="Content-Style-Type" content="text/css">
+
+ <title>Style tests</title>
+
+ <style type="text/css">
+ p { margin: 0 0 0.5em 0; }
+ span { padding: 0.1em 0.5em; }
+ span.string { background: green; color: #fff; }
+ span.undefined { background: red; color: #fff; }
+ .hl { background: #ffc; }
+ pre { margin-top: 4em;background-color: #eef; border: 1px solid #aaf; padding: 1em 0.5em; }
+ </style>
+
+ <script src="getStyleProperty.js" type="text/javascript"></script>
+ </head>
+ <body>
+ <script type="text/javascript">
+ (function(){
+ var properties;
+
+ var b = document.body;
+ function write(s) {
+ b.appendChild(document.createTextNode(s));
+ b.appendChild(document.createElement('br'));
+ }
+
+ function test(){
+ for (var i=0, l=properties.length; i<l; i++) {
+ var propName = getStyleProperty(properties[i]);
+ var result = typeof propName;
+ var str = [
+ '<p>',
+ properties[i],
+ ': <span class="',
+ result,
+ '">',
+ result,
+ '<\/span>',
+ (result == 'undefined' ? '' : ' found: <span class="hl">' + propName + '<\/span>'),
+ '<\/p>'
+ ].join('');
+ document.writeln(str);
+ }
+ }
+
+ properties = ['opacity', 'minWidth', 'minHeight', 'maxWidth', 'maxHeight'];
+
+ document.writeln('<h2>CSS2:<\/h2>');
+ test();
+
+ properties = [
+ 'borderRadius',
+ 'borderImage',
+ 'backgroundOrigin',
+ 'backgroundClip',
+ 'backgroundSize',
+ 'boxShadow',
+ 'boxSizing',
+ 'textOverflow',
+ 'textShadow',
+ 'textStroke',
+ 'textJustify',
+ 'textFillColor',
+ 'layoutGrid',
+ 'appearance',
+ 'resize',
+ 'outlineOffset',
+ 'wordWrap',
+ 'overflowX',
+ 'overflowY'
+ ];
+
+ document.writeln('<h2>CSS3:<\/h2>');
+ test();
+
+ properties = [
+ 'transform',
+ 'transition'
+ ];
+ document.write('<h2>CSS Transforms/Transitions<\/h2>');
+ test();
+
+ document.write(
+ '<pre>' +
+ String(getStyleProperty).replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/&/g, '&amp;') +
+ '<\/pre>');
+ })();
+ </script>
+ <p style="font-size: 0.8m;">by <a href="http://thinkweb2.com/projects/prototype/">kangax</a></p>
+ </body>
+</html>

0 comments on commit 2d3b4e1

Please sign in to comment.