Failing test case for triple click bug (#14)

edg2s · Nov 10, 2020 · 70e42f0 · 70e42f0
1 parent 813e848
commit 70e42f0
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 6 deletions.
diff --git a/demo.js b/demo.js
@@ -107,12 +107,22 @@ $( function () {
 		var range = document.createRange(),
 			testNode = $( '.testNode' )[ 0 ];
 
-		range.setStart( testNode.firstChild, 1 );
-		if ( +$( e.target ).data( 'range' ) === 1 ) {
-			range.setEnd( testNode.firstChild.nextSibling, 0 );
-		} else {
-			range.setEnd( testNode.firstChild.nextSibling.firstChild.nextSibling, 3 );
+		switch ( +$( e.target ).data( 'range' ) ) {
+			case 1:
+				range.setStart( testNode.firstChild, 1 );
+				range.setEnd( testNode.firstChild.nextSibling, 0 );
+				break;
+			case 2:
+				range.setStart( testNode.firstChild, 1 );
+				range.setEnd( testNode.firstChild.nextSibling.firstChild.nextSibling, 3 );
+				break;
+			case 3:
+				range.setStart( testNode, 0 );
+				range.setEnd( testNode, 2 );
+				break;
 		}
+		selection.removeAllRanges();
+		selection.addRange( range );
 		render( range );
 
 	} );

diff --git a/index.html b/index.html
@@ -28,10 +28,18 @@ <h2>Fixed</h2>
 
 		<div class="col">
 			<p>
-				In some browsers, rectangles are only broken if the range is not added to the document's selection. These buttons create a problematic range programmatically and render it:<br />
+				Some programmatically created selections can also be problematic:
+			</p>
+			<p>
 				<input type="button" value="Firefox/Safari bug" class="testRange" data-range="1" />
 				<input type="button" value="Chrome 55 bug" class="testRange" data-range="2" />
 			</p>
+			<p>
+				This selection can be created by triple clicking in Firefox, but will also break in Chrome if set programmatically:
+			</p>
+			<p>
+				<input type="button" value="Firefox triple click bug" class="testRange" data-range="3" />
+			</p>
 		</div>
 
 		<table class="features">