Added LTR text direction support to languageDirAttributeIsUsed. #72

quailjs · Jan 4, 2014 · d2c4677 · d2c4677
1 parent b23554e
commit d2c4677
Show file tree

Hide file tree

Showing 5 changed files with 73 additions and 5 deletions.
diff --git a/src/js/core.js b/src/js/core.js
@@ -57,9 +57,12 @@ var quail = {
   focusElements : 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, *[tabindex], *[contenteditable]',
 
   /**
-   * Characters that are right-to-left only.
+   * Regex to find right-to-left or left-to-right characters
    */
-  rtlCharacters : /[\u0600-\u06FF]|[\u0750-\u077F]|[\u0590-\u05FF]|[\uFE70-\uFEFF]/mg,
+  textDirection : {
+    rtl : /[\u0600-\u06FF]|[\u0750-\u077F]|[\u0590-\u05FF]|[\uFE70-\uFEFF]/mg,
+    ltr : /[\u0041-\u007A]|[\u00C0-\u02AF]|[\u0388-\u058F]/mg
+  },
 
   /**
    * Main run function for quail. It bundles up some accessibility tests,

diff --git a/src/js/custom/languageDirAttributeIsUsed.js b/src/js/custom/languageDirAttributeIsUsed.js
@@ -1,12 +1,19 @@
 quail.languageDirAttributeIsUsed = function() {
+	var currentDirection = (quail.html.attr('dir')) ? quail.html.attr('dir').toLowerCase() : 'ltr';
+	var oppositeDirection = (currentDirection === 'ltr') ? 'rtl' : 'ltr';
 	quail.html.find(quail.textSelector).each(function() {
-		var matches = $(this).text().match(quail.rtlCharacters);
+		currentDirection = ($(this).attr('dir')) ? $(this).attr('dir').toLowerCase() : currentDirection;
+		if(typeof quail.textDirection[currentDirection] === 'undefined') {
+			currentDirection = 'ltr';
+		}
+		oppositeDirection = (currentDirection === 'ltr') ? 'rtl' : 'ltr';
+		var matches = $(this).text().match(quail.textDirection[currentDirection]);
 		if(!matches) {
 			return;
 		}
 		matches = matches.length;
-		$(this).find('[dir=rtl]').each(function() {
-			var childMatches = $(this).text().match(quail.rtlCharacters);
+		$(this).find('[dir=' + oppositeDirection + ']').each(function() {
+			var childMatches = $(this).text().match(quail.textDirection[currentDirection]);
 			if(childMatches) {
 				matches = matches - childMatches.length;
 			}

diff --git a/test/quail.html b/test/quail.html
@@ -391,8 +391,10 @@
             "testfiles/common/labelMustNotBeEmpty-pass-2.html",
             "testfiles/common/labelMustNotBeEmpty-pass.html",
             "testfiles/common/languageDirAttributeIsUsed-pass.html",
+            "testfiles/common/languageDirAttributeIsUsed-pass-2.html",
             "testfiles/common/languageDirAttributeIsUsed-fail.html",
             "testfiles/common/languageDirAttributeIsUsed-fail-2.html",
+            "testfiles/common/languageDirAttributeIsUsed-fail-3.html",
             "testfiles/common/legendDescribesListOfChoices-fail-2.html",
             "testfiles/common/legendDescribesListOfChoices-fail.html",
             "testfiles/common/legendTextNotEmpty-fail.html",

diff --git a/test/testfiles/common/languageDirAttributeIsUsed-fail-3.html b/test/testfiles/common/languageDirAttributeIsUsed-fail-3.html
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!doctype html>
+<html>
+
+    <head>
+        <title>languageDirAttributeIsUsed-fail-3</title>
+        <link rel="stylesheet" href="../../../lib/qunit/qunit/qunit.css" media="screen">
+    </head>
+
+    <body>
+        <div id="quail-scope" dir="rtl">
+            <p>
+                וואַכטל זענען זייער "some english text" קיוט איך טראַכטן.
+            </p>
+        </div>
+        <script id="qunit-jquery" src="../../../lib/jquery/jquery.js"></script>
+        <script id="qunit-quail" src="../../../dist/quail.jquery.js"></script>
+        <script id="qunit-composite" src="../../composite.js"></script>
+        <script id="qunit-qunit" src="../../../lib/qunit/qunit/qunit.js"></script>
+        <script id="qunit-script">
+            test('languageDirAttributeIsUsed', function() {
+            	  quailTest.runTest( 'languageDirAttributeIsUsed' );
+            	  equal(true, quailTest.confirmIsTag('p'), 'No errors were found');
+            });
+        </script>
+    </body>
+
+</html>
diff --git a/test/testfiles/common/languageDirAttributeIsUsed-pass-2.html b/test/testfiles/common/languageDirAttributeIsUsed-pass-2.html
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!doctype html>
+<html>
+
+    <head>
+        <title>languageDirAttributeIsUsed-pass-2</title>
+        <link rel="stylesheet" href="../../../lib/qunit/qunit/qunit.css" media="screen">
+    </head>
+
+    <body>
+        <div id="quail-scope" dir="rtl">
+            <p>
+                וואַכטל זענען זייער "<span lang="en" dir="ltr">some english text</span>" קיוט איך טראַכטן.
+            </p>
+        </div>
+        <script id="qunit-jquery" src="../../../lib/jquery/jquery.js"></script>
+        <script id="qunit-quail" src="../../../dist/quail.jquery.js"></script>
+        <script id="qunit-composite" src="../../composite.js"></script>
+        <script id="qunit-qunit" src="../../../lib/qunit/qunit/qunit.js"></script>
+        <script id="qunit-script">
+            test('languageDirAttributeIsUsed', function() {
+            	  quailTest.runTest( 'languageDirAttributeIsUsed' );
+            	  equal(true, quailTest.confirmIsEmpty(), 'No errors were found');
+            });
+        </script>
+    </body>
+
+</html>