Fix for montagejsgh-166 PhotoFx: Exception at launch

Replaced using DOM range methods with manually removing and adding the condition child elements. Also added a simple test case for nested conditions to ensure that the page loads. (cherry picked from commit 20c9b4d)
gijs · Feb 17, 2012 · d006b74 · d006b74
1 parent fe33b24
commit d006b74
Show file tree

Hide file tree

Showing 4 changed files with 152 additions and 11 deletions.
diff --git a/test/ui/condition-spec.js b/test/ui/condition-spec.js
@@ -0,0 +1,55 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
+ </copyright> */
+var Montage = require("montage").Montage,
+    TestPageLoader = require("support/testpageloader").TestPageLoader;
+
+var conditionTestPage = TestPageLoader.queueTest("ui/condition", {src: "ui/condition/condition-test-page.html", firstDraw: false}, function() {
+    describe("ui/condition-spec", function() {
+        it("should load", function() {
+            expect(conditionTestPage.loaded).toBeTruthy();
+        });
+
+        describe("condition with false condition and removal strategy hide", function() {
+            it("upon initial load content should have a class of montage-invisible", function() {
+                var conditionDiv = conditionTestPage.iframe.contentDocument.getElementsByClassName("fetchHide")[0];
+                expect(conditionDiv.classList.contains("montage-invisible")).toBeTruthy();
+            });
+            it("should remove montage-invisible class when condition becomes true", function() {
+                conditionTestPage.test.hideValue = true;
+                conditionTestPage.waitForDraw();
+
+                runs(function(){
+                    var conditionDiv = conditionTestPage.iframe.contentDocument.getElementsByClassName("fetchHide")[0];
+                    expect(conditionDiv.classList.contains("montage-invisible")).toBeFalsy();
+                });
+            });
+        });
+
+        describe("condition with false condition and removal strategy remove", function() {
+            it("upon initial load its contents should be empty", function() {
+                var conditionDiv = conditionTestPage.iframe.contentDocument.getElementsByClassName("fetchRemove")[0];
+                expect(conditionDiv.innerHTML).toBe("<div></div>");
+            });
+            it("should add its contents to the DOM when condition becomes true", function() {
+                conditionTestPage.test.removeValue = true;
+                conditionTestPage.waitForDraw();
+
+                runs(function(){
+                    var conditionDiv = conditionTestPage.iframe.contentDocument.getElementsByClassName("fetchRemove")[0];
+                    expect(conditionDiv.innerHTML).toBe("<div><div><span>Foo</span></div></div>");
+                });
+            });
+        });
+    });
+});
+
+var nestedConditionTestPage = TestPageLoader.queueTest("ui/nested-condition", {src: "ui/condition/nested-condition-test-page.html", firstDraw: false}, function() {
+    describe("ui/nested-condition-spec", function() {
+        it("should load", function() {
+            expect(nestedConditionTestPage.loaded).toBeTruthy();
+        });
+    });
+});
diff --git a/test/ui/condition/nested-condition-test-page.html b/test/ui/condition/nested-condition-test-page.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<!-- <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
+ </copyright> -->
+<html>
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <script type="text/javascript" src="../../../montage.js" data-package="../../"></script>
+    <script type="text/montage-serialization">
+    {
+        "test": {
+            "module": "ui/condition/test",
+            "name": "Test"
+        },
+        "outerCondition": {
+            "module": "montage/ui/condition.reel",
+            "name": "Condition",
+            "properties": {
+                "element": {"#": "outerCondition"}
+            },
+            "bindings": {
+                "condition": {
+                    "boundObject": {"@": "test"},
+                    "boundObjectPropertyPath": "outerConditionValue",
+                    "oneway": false
+                }
+            }
+        },
+        "innerCondition": {
+            "module": "montage/ui/condition.reel",
+            "name": "Condition",
+            "properties": {
+                "element": {"#": "innerCondition"}
+            },
+            "bindings": {
+                "condition": {
+                    "boundObject": {"@": "test"},
+                    "boundObjectPropertyPath": "innerConditionValue",
+                    "oneway": false
+                }
+            }
+        },
+        "application": {
+            "module": "montage/ui/application",
+            "name": "Application",
+            "properties": {
+                "delegate" : {"@": "test"}
+            }
+        }
+    }
+    </script>
+
+</head>
+<body>
+
+    <div id="outerCondition">
+        Hey
+        <div id="innerCondition">Sample</div>
+    </div>
+
+</body>
+</html>
diff --git a/test/ui/condition/test.js b/test/ui/condition/test.js
@@ -0,0 +1,27 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
+ </copyright> */
+var Montage = require("montage").Montage,
+    Component = require("montage/ui/component").Component;
+
+exports.Test = Montage.create(Montage, {
+
+    hideValue: {
+        value: false
+    },
+
+    removeValue: {
+        value: false
+    },
+
+    outerCondition: {
+        value: true
+    },
+
+    innerCondition: {
+        value: true
+    }
+
+});
diff --git a/ui/condition.reel/condition.js b/ui/condition.reel/condition.js
@@ -150,19 +150,14 @@ exports.Condition = Montage.create(Component, /** @lends module:"montage/ui/cond
     prepareForDraw: {
         enumerable: false,
         value: function() {
-
+            var i, childList, childElement;
             if (!this.content) {
                 this.content = document.createElement("div");
-
-                var conditionContentRange = document.createRange();
-                conditionContentRange.selectNodeContents(this._element);
-
-                // TODO not wrap the range if it is a range of a single element
-                // we want to only deal with single elements when appending and removing;
-                // this keeps us from having to keep track of the range or risk losing
-                // a reference to the elements when they're extracted
-                conditionContentRange.surroundContents(this.content);
-                conditionContentRange.deleteContents(); //remove the contents that are part of the original structure
+                childList = Array.prototype.slice.call(this._element.childNodes, 0);
+                for (i = 0; (childElement = childList[i]); i++) {
+                    childElement.parentElement.removeChild(childElement);
+                    this.content.appendChild(childElement);
+                }
             }
 
             var slotRoot = document.createElement("div");