358424 - hyperlinks do not work

Status: RESOLVED FIXED

(Testopia :: User Interface, defect)

Description

[Tyler Peterson]

User-Agent:       Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.0.7) Gecko/20060911 SUSE/1.5.0.7-1.5 Firefox/1.5.0.7
Build Identifier: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.0.7) Gecko/20060911 SUSE/1.5.0.7-1.5 Firefox/1.5.0.7

In plan and case documents you can create hyperlinks, but you can not follow them.

Reproducible: Always

Steps to Reproduce:
1.Create some text
2.turn it into a link
3.click on the link

Actual Results:  
cursor moves to location clicked

Expected Results:  
follow link to target

Perhaps this could be fixed by having a view mode for the document that comes up by default on created entities.  In this mode the links are active by default.  Double clicking on the document could switch the node into edit mode. Once in edit mode, you should be able to preview your changes before commit, but this is not crucial because most of it is wysiwyg, except for actually following the links.  It is therefore permissible that the document remain in edit mode until a commit or refresh once double clicked on.

Comment 1

[Greg Hendricks]

This is a bug in the Dojo toolkit.

Comment 2

[Tyler Peterson]

(In reply to comment #1)
> This is a bug in the Dojo toolkit.

I believe the toolkit is functioning as designed in this case. The behavior described is acceptable for the edit mode of a document.  Following a link when clicked on in edit mode is arguably a misfeature.

Comment 3

[Tyler Peterson]

Attachment: Patch to view test-case documents in normal mode, double click for edit.

This patch implements my suggestion for the test case view.  Case documents begin in a "normal" mode where hyperlinks are active (i.e. implement navigation when clicked). Double clicking on any of the documents causes that document to switch into a dojo editor.  The double clicked document remains in edit mode until the page is reloaded.

I was only focusing on getting the feature to work, so I won't be surprised if some refactoring is used on this patch before commit.  This patch DOES fix the problem AS IS, however, so it can be directly applied.

Similar changes should be made everywhere else we edit html documents so that the links created in them can be active.  

Also, it would be good if the commit button didn't appear next to documents in normal mode, since there won't be any changes to commit.  I didn't get around to this in this patch. 

This double-click-to-change idiom would also be useful in other parts of the page, instead of having one static view and one changeable view.

Comment 4

[Greg Hendricks]

Comment on attachment 248450 [details] [diff] [review]
Patch to view test-case documents in normal mode, double click for edit.

>Index: template/en/default/testopia/case/form.html.tmpl
>===================================================================
>--- template/en/default/testopia/case/form.html.tmpl	(revision 2480)
>+++ template/en/default/testopia/case/form.html.tmpl	(working copy)
>@@ -17,6 +17,7 @@
>   #
>   # Contributor(s): Ed Fuentetaja <[e-mail]>
>   #                 Greg Hendricks <[e-mail]>
>+  #                 Tyler Peterson <[e-mail]>
>   #%]
> 
> [%# INTERFACE:
>@@ -26,7 +27,56 @@
> [% IF case.canedit %]
> <script type="text/javascript">
>     dojo.require("dojo.widget.Editor2");  
>+    dojo.require("dojo.widget.*");  
>     dojo.require("dojo.widget.Editor2Plugin.DialogCommands");  
>+
>+    var setupDiv, dojoSetupEd, tcsetup;
>+    var breakdownDiv, dojoBreakdownEd, tcbreakdown;
>+    var actionDiv, dojoActionEd, tcaction;
>+    var effectDiv, dojoEffectEd, tceffect;
>+    var theCaseForm;
>+
>+    function handleLoad() {
>+	setupDiv     = document.getElementById('setupDiv');
>+	breakdownDiv = document.getElementById('breakdownDiv');
>+	actionDiv    = document.getElementById('actionDiv');
>+	effectDiv    = document.getElementById('effectDiv');
>+	tcsetup     = document.getElementById('tcsetup');
>+	tcbreakdown = document.getElementById('tcbreakdown');
>+	tcaction    = document.getElementById('tcaction');
>+	tceffect    = document.getElementById('tceffect');
>+
>+	theCaseForm = document.getElementById('TestCaseForm');
>+	theCaseForm.onsubmit = insertDocuments;
>+    }
>+
>+    function showDojoSetupView() {
>+	dojoSetupEd = dojo.widget.createWidget("Editor2", {},setupDiv);
>+    }
>+    function showDojoBreakdownView() {
>+	dojoBreakdownEd = dojo.widget.createWidget("Editor2", {},breakdownDiv);
>+    }
>+    function showDojoActionView() {
>+	dojoActionEd = dojo.widget.createWidget("Editor2", {},actionDiv);
>+    }
>+    function showDojoEffectView() {
>+	dojoEffectEd = dojo.widget.createWidget("Editor2", {},effectDiv);
>+    }
>+
>+    function insertDocuments() {
>+	if (dojoSetupEd) {
>+	    tcsetup.value = dojoSetupEd.getEditorContent();
>+	}
>+	if (dojoBreakdownEd) {
>+	    tcbreakdown.value = dojoBreakdownEd.getEditorContent();
>+	}
>+	if (dojoActionEd) {
>+	    tcaction.value = dojoActionEd.getEditorContent();
>+	}
>+	if (dojoEffectEd) {
>+	    tceffect.value = dojoEffectEd.getEditorContent();
>+	}
>+    }
> </script>
> [% END %]

This whole section should go into a generic file such as util.js since there are other places that use the Editor such as Testplan. We should add this functionality there as well.

> <a name="attributes"></a>
>@@ -186,31 +236,27 @@
>   </p>
> 
> [%# action, effect %]
>-  <h3>Set Up</h3>
>-  <textarea cols="122" rows="15" style="border: 1px solid #000000;" height="300" dontBeEvil="1"
>-            id="tcsetup" name="tcsetup" dojoType="Editor2" focusOnLoad="false">
>-[% case.text.setup FILTER xss %]</textarea>     
>+  <h3 ondblclick="showDojoSetupView()">Set Up</h3>
>+  <input id="tcsetup" name="tcsetup" type="hidden" value="[% case.text.setup FILTER xml %]"></input>
>+  <div id="setupDiv" ondblclick="showDojoSetupView()">[% case.text.setup FILTER xss %]</div>
>   <p align="right">
>     <input type="SUBMIT" name="action" id="action" class="tr_button" value="[% action FILTER html %]">
>   </p>
>-    <h3>Break Down</h3>
>-  <textarea cols="122" rows="15" style="border: 1px solid #000000;" height="300"
>-            id="tcbreakdown" name="tcbreakdown" dojoType="Editor2" focusOnLoad="false">
>-[% case.text.breakdown FILTER xss %]</textarea>     
>+  <h3 ondblclick="showDojoBreakdownView()">Break Down</h3>
>+  <input id="tcbreakdown" name="tcbreakdown" type="hidden" value="[% case.text.breakdown FILTER xml %]"></input>
>+  <div id="breakdownDiv" ondblclick="showDojoBreakdownView()">[% case.text.breakdown FILTER xss %]</div>
>   <p align="right">
>     <input type="SUBMIT" name="action" id="action" class="tr_button" value="[% action FILTER html %]">
>   </p>
>-  <h3>Action</h3>
>-  <textarea cols="122" rows="15" style="border: 1px solid #000000;" height="300"
>-            id="tcaction" name="tcaction" dojoType="Editor2" focusOnLoad="false">
>-[% case.text.action FILTER xss %]</textarea>     
>+  <h3 ondblclick="showDojoActionView()">Action</h3>
>+  <input id="tcaction" name="tcaction" type="hidden" value="[% case.text.action FILTER xml %]"></input>
>+  <div id="actionDiv" ondblclick="showDojoActionView()">[% case.text.action FILTER xss %]</div>
>   <p align="right">
>     <input type="SUBMIT" name="action" id="action" class="tr_button" value="[% action FILTER html %]">
>   </p>
>-  <h3>Expected Results</h3>
>-  <textarea cols="122" rows="15" style="border: 1px solid #000000;" height="300"
>-            id="tceffect" name="tceffect" dojoType="Editor2" focusOnLoad="false">
>-[% case.text.effect FILTER xss %]</textarea>     
>+  <h3 ondblclick="showDojoEffectView()">Expected Results</h3>
>+  <input id="tceffect" name="tceffect" type="hidden" value="[% case.text.effect FILTER xml %]"></input>
>+  <div id="effectDiv" ondblclick="showDojoEffectView()">[% case.text.effect FILTER xss %]</div>     
>   <p align="right">
>     <input type="SUBMIT" name="action" id="action" class="tr_button" value="[% action FILTER html %]">
>   </p>

This presents a problem because these fields (indeed all of case/form.html.tmpl) is not only used to edit a case on tr_show_case but also in creating a new case. This breaks tr_new_case.cgi. I think there is a simple solution though, just have it load them automatically if we are adding a new case instead of waiting for double click.


>Index: template/en/default/testopia/case/show.html.tmpl
>===================================================================
>--- template/en/default/testopia/case/show.html.tmpl	(revision 2480)
>+++ template/en/default/testopia/case/show.html.tmpl	(working copy)
>@@ -17,6 +17,7 @@
>   #
>   # Contributor(s): Ed Fuentetaja <[e-mail]>
>   #                 Greg Hendricks <[e-mail]>
>+  #                 Tyler Peterson <[e-mail]>
>   #%]
> 
> [%# INTERFACE:
>@@ -30,6 +31,9 @@
> [% PROCESS global/variables.none.tmpl %]
> [% PROCESS testopia/blocks.html.tmpl %]
> [% SET title = "Test Case $case.id: $case.summary" %]
>+[% IF case.canedit %]
>+[% SET onload = "handleLoad()" %]
>+[% END %]
> 

use dojo.addOnLoad here instead. 
see http://www.dev411.com/blog/2006/07/13/dojo-dojo-addonload-vs-body-onload-and-window-onload

Comment 5

[Tyler Peterson]

Attachment: Refactored to a DocumentManager class.

Refactored last patch and added to test plan view.  Also added some ui cues.  Tested adding/editing plans/cases. Appears to work.

Comment 6

[Greg Hendricks]

    RCS file: /cvsroot/mozilla/webtools/testopia/testopia/js/DocumentManager.js,v
    done
    Checking in testopia/js/DocumentManager.js;
    /cvsroot/mozilla/webtools/testopia/testopia/js/DocumentManager.js,v  <--  DocumentManager.js
    initial revision: 1.1
    done
    Checking in template/en/default/testopia/case/form.html.tmpl;
    /cvsroot/mozilla/webtools/testopia/template/en/default/testopia/case/form.html.tmpl,v  <--  form.html.tmpl
    new revision: 1.12; previous revision: 1.11
    done
    rlog: /cvsroot/mozilla/webtools/testopia/template/en/default/testopia/plan/form.html.tmpl,v  <--  form.html.tmpl
    new revision: 1.7; previous revision: 1.6
    done