Merge pull request #3419 from WebsiteDeveloper/Issue-3407

Added Code to HtmlUtils to return info when in closing tag

Author: RaymondLim

src/editor/CSSInlineEditor.js

@@ -44,7 +44,7 @@ define(function (require, exports, module) {
         var tagInfo = HTMLUtils.getTagInfo(editor, pos),
             selectorName = "";
 
-        if (tagInfo.position.tokenType === HTMLUtils.TAG_NAME) {
+        if (tagInfo.position.tokenType === HTMLUtils.TAG_NAME || tagInfo.position.tokenType === HTMLUtils.CLOSING_TAG) {
             // Type selector
             selectorName = tagInfo.tagName;
         } else if (tagInfo.position.tokenType === HTMLUtils.ATTR_NAME ||

src/language/HTMLUtils.js

@@ -32,6 +32,7 @@ define(function (require, exports, module) {
 
     //constants
     var TAG_NAME = "tagName",
+        CLOSING_TAG = "closingTag",
         ATTR_NAME = "attr.name",
         ATTR_VALUE = "attr.value";
 
@@ -399,12 +400,16 @@ define(function (require, exports, module) {
                 return createTagInfo();
             }
 
-            // Check to see if this is the closing of a tag (either the start or end)
-            if (ctx.token.string === ">" || ctx.token.string === "/>" ||
-                    (ctx.token.string.charAt(0) === "<" && ctx.token.string.charAt(1) === "/")) {
+            // Check to see if this is the closing of a start tag or a self closing tag
+            if (ctx.token.string === ">" || ctx.token.string === "/>") {
                 return createTagInfo();
             }
 
+            // Check to see if this is a closing tag
+            if (ctx.token.string.charAt(0) === "<" && ctx.token.string.charAt(1) === "/") {
+                return createTagInfo(CLOSING_TAG, offset - 2, ctx.token.string.slice(2));
+            }
+            
             // Make sure the cursor is not after an equal sign or a quote before we report the context as a tag.
             if (ctx.token.string !== "=" && ctx.token.string.match(/^["']/) === null) {
                 if (!tokenType) {
@@ -504,14 +509,15 @@ define(function (require, exports, module) {
 
 
     // Define public API
-    exports.TAG_NAME = TAG_NAME;
-    exports.ATTR_NAME = ATTR_NAME;
-    exports.ATTR_VALUE = ATTR_VALUE;
+    exports.TAG_NAME         = TAG_NAME;
+    exports.CLOSING_TAG      = CLOSING_TAG;
+    exports.ATTR_NAME        = ATTR_NAME;
+    exports.ATTR_VALUE       = ATTR_VALUE;
 
-    exports.getTagInfo = getTagInfo;
+    exports.getTagInfo       = getTagInfo;
     exports.getTagAttributes = getTagAttributes;
     //The createTagInfo is really only for the unit tests so they can make the same structure to 
     //compare results with
-    exports.createTagInfo = createTagInfo;
+    exports.createTagInfo   = createTagInfo;
     exports.findStyleBlocks = findStyleBlocks;
 });

test/spec/CodeHintUtils-test.js

@@ -244,7 +244,7 @@ define(function (require, exports, module) {
                     "</body></ht", "ml>");
 
                 var tag = HTMLUtils.getTagInfo(myEditor, pos);
-                expect(tag).toEqual(HTMLUtils.createTagInfo());
+                expect(tag).toEqual(HTMLUtils.createTagInfo(HTMLUtils.CLOSING_TAG, 2, "html"));
             });
 
             it("should not find attributes in an empty editor", function () {

test/spec/InlineEditorProviders-test-files/test1.html

@@ -8,6 +8,6 @@
     <div{{0}} class="{{1}}foo" id="myDiv{{2}}">{{3}}</div>
     <!--<div{{4}}>-->
     <div id="anotherDiv{{6}}"></div>
-    <div{{8}} {{7}}class="foo"></div>
+    <div{{8}} {{7}}class="foo"></{{9}}div>
 </body>
 </html>

test/spec/InlineEditorProviders-test.js

@@ -252,7 +252,7 @@ define(function (require, exports, module) {
             });
 
 
-            it("should open a type selector", function () {
+            it("should open a type selector on opening tag", function () {
                 initInlineTest("test1.html", 0);
 
                 runs(function () {
@@ -263,6 +263,18 @@ define(function (require, exports, module) {
                     expect(inlinePos).toEqual(this.infos["test1.css"].offsets[0]);
                 });
             });
+            
+            it("should open a type selector on closing tag", function () {
+                initInlineTest("test1.html", 9);
+                
+                runs(function () {
+                    var inlineWidget = EditorManager.getCurrentFullEditor().getInlineWidgets()[0];
+                    var inlinePos = inlineWidget.editors[0].getCursorPos();
+                    
+                    // verify cursor position in inline editor
+                    expect(inlinePos).toEqual(this.infos["test1.css"].offsets[0]);
+                });
+            });
 
             it("should open a class selector", function () {
                 initInlineTest("test1.html", 1);