Merge lp:~allenap/launchpad/me-too-ajax-bug-361097 into lp:launchpad

[Gavin Panella]

[Gavin Panella (allenap)]

This branch AJAXifies the "me-too" (aka "this bug affects me") part of
the bugs page.

File by file:

lib/canonical/launchpad/javascript/bugs/bugtask-index.js

  Added a function setup_me_too that uses a new widget,
  MeTooChoiceSource, to do its business.

  MeTooChoiceSource extends from ChoiceSource to add a few frills,
  like showing and hiding a flame icon (displayed if the user is
  affected by the bug), making the widget display inline (by default
  it displays as a block), and of course, to do an API call to set the
  affected status.

lib/lp/bugs/browser/bugtask.py
lib/lp/bugs/browser/tests/test_bugtask.py

  New property current_user_affected_js_status returns one of "null",
  "true" or "false", i.e. valid Javascript indicating the affected
  status of the user. The tests also cover the existing
  current_user_affected_status.

lib/lp/bugs/stories/bugs/xx-bug-affects-me-too.txt

  Quite extensive reworking of this pagetest.

lib/lp/bugs/templates/bugtasks-and-nominations-table.pt

  Rip out the old static markup and Javascript code, replace it with
  markup to support the static (no Javascript) and dynamic (Javascript
  enabled) scenarios, and call out to setup_me_too.

  There is a span with a "static" class that contains all the markup
  when Javascript is disabled. There is a span with a "dynamic" class
  that is hidden first of all. The visibility of these spans is
  swapped by MeTooChoiceSource at run time. This means that the
  framework markup can stay in the template.

lib/lp/bugs/windmill/tests/test_bugs/test_bug_me_too.py

  The beginnings of a Windmill test. This took so long and extracted
  so much virtual blood from me that I'm going to complete it in a
  later branch. Testing the overlays and stuff is extremely painful
  and fiddly.

TODO:

  There are no unit tests for MeTooChoiceSource. I will do these in a
  later branch, and will land them at the same time as this branch.

  Finish the Windmill test.

[Michael Nelson (michael.nelson)]

As per our IRC conversation, ui=me* - my only remaining question was regarding there being two icons for the one action once a user marks the bug as affecting them, which you were going to ask Martin about.

<noodles775> allenap: Looks great and works really well. I've got a few questions with the wording though (but I'm no expert there).
<noodles775> Was the wording discussed, or what were your thoughts when you chose the wording?
<noodles775> (on the actual overlay I mean)
<allenap> noodles775: I'll be with you soon; on the phone.
<allenap> noodles775: I didn't talk to anyone about the wording. I looked at the various me_too movies in https://devpad.canonical.com/~beuno/ui_movies/.
<allenap> noodles775: I was also limited a little by ChoiceSource where the displayed value in the overlay is the same as the displayed value in the <... class="value"> area.
<allenap> noodles775: But I think I should see if I can change it to display "Does this bug affect you?" if the user has not voted in either direction.
<noodles775> The link? Yes that would be nice.
<allenap> noodles775: Okay, I've pushed a fix for that.
<noodles775> allenap: so am I right that the issue you had is that you cannot have the values of the choices displaying as 'affects me too', and hence you had to change the heading/intro of the overlay to 'Does this bug affect you?'?
<allenap> noodles775: Yes, that's right, unless I add some hackery to munge the displayed value (which might not be that hard actually...)
<adeuring1> gmb. thanks
<allenap> noodles775: I might modify ChangeSource to allow alternate display values.
<noodles775> allenap: is it possible to update the ChoiceSource/widget to all...
<noodles775> allenap: :)
<noodles775> Yes, I think it might be worthwhile doing that, as it seems strange asking 'Does this bug affect you?' after the user has just clicked on the link.
<allenap> noodles775: Okay, I'll do that. But it seems like you're overall happy with it. Shall I aim for https://devpad.canonical.com/~beuno/ui_movies/me_too.swf?
<noodles775> allenap: Indeed - it looks and feels great to use! And yes, I'd recommend going for exactly what me_too.swf shows.
<allenap> noodles775: Okay, I'll bother you again later for a final sign off then. Thank you!
<noodles775> allenap: If it's not possible or too difficult to update ChangeSource, I wonder how it would feel without the heading in the overlay, but just the two options "This bug affects me too"/...
<allenap> noodles775: I'll give that a go too.
<allenap> noodles775: Hi there. Continuing on from the UI review earlier, I have a fix for showing different ChoiceSource/ChoiceList text. Abel's already reviewed it and it has landed, so if you pull your lazr-js dep and my branch again (bzr+ssh://bazaar.launchpad.net/~allenap/launchpad/me-too-ajax-bug-361097) you can see the final thing. Not urgent though, whenever you have mo.
<noodles775_> allenap: Great updates on the 'This bug doesn't affect me' feature!
<allenap> noodles775_: Cool, thanks :)
<noodles775_> allenap: is there an mp for it?
<noodles775_> allenap: some small thoughts that I had while using it (not so important, but might be easy):
<allenap> noodles775_: Not yet, bu...

review: Approve (ui)

[Martin Albisetti (beuno)]

Hi Gavin,

This branch gets us a step closer to AJAX-zen, thanks for working on it.

As discussed on IRC, it feels more natural to me to phrase the options in the pop-up as a question, along the lines of: "Does this bug affect you?" "Yes, it affects me/No, it doesn't affect me".

The second issue, which is more of an open-ended question, is if the edit icon should be on the right instead of on the left, since you're editing that object (think about titles, for example). I'm inclined to prefer it on the right, but I will leave it to you to make that call.

review: Approve (ui)

=== modified file 'lib/canonical/launchpad/javascript/bugs/bugtask-index.js'
--- lib/canonical/launchpad/javascript/bugs/bugtask-index.js	2009-07-29 11:13:40 +0000
+++ lib/canonical/launchpad/javascript/bugs/bugtask-index.js	2009-07-31 13:10:26 +0000
@@ -1308,6 +1308,116 @@
     }
 };
 
+/**
+ * Set up the "me too" selection.
+ *
+ * Called once, on load, to initialize the page. Call this function if
+ * the "me too" information is displayed on a bug page and the user is
+ * logged in.
+ *
+ * @method setup_me_too
+ */
+bugs.setup_me_too = function(user_is_affected) {
+    var me_too_content = Y.get('#affectsmetoo');
+    var me_too_edit = new MeTooChoiceSource({
+        contentBox: me_too_content,
+        value: user_is_affected,
+        title: 'This bug:',
+        items: [
+            {name: 'Affects me too', value: true,
+             source_name: 'This bug affects me too',
+             disabled: false},
+            {name: 'Does not affect me', value: false,
+             source_name: "This bug doesn't affect me",
+             disabled: false}
+        ],
+        elementToFlash: me_too_content,
+        backgroundColor: '#FFFFFF'
+    });
+    me_too_edit.render();
+};
+
+/**
+ * This class is a derivative of ChoiceSource that handles the
+ * specifics of editing "me too" option.
+ *
+ * @class MeTooChoiceSource
+ * @extends ChoiceSource
+ * @constructor
+ */
+function MeTooChoiceSource() {
+    MeTooChoiceSource.superclass.constructor.apply(this, arguments);
+}
+
+Y.mix(MeTooChoiceSource, {
+    NAME: 'metoocs',
+    NS: 'metoocs'
+});
+
+Y.extend(MeTooChoiceSource, Y.ChoiceSource, {
+    initializer: function() {
+        var widget = this;
+        this.error_handler = new LP.client.ErrorHandler();
+        this.error_handler.clearProgressUI = function() {
+            widget._uiClearWaiting();
+        };
+        this.error_handler.showError = function(error_msg) {
+            widget.showError(error_msg);
+        };
+    },
+
+    showError: function(err) {
+        display_error(null, err);
+    },
+
+    syncUI: function() {
+        MeTooChoiceSource.superclass.syncUI.apply(this, arguments);
+        // Show the flame icon if the user is affected by this bug.
+        var content_box = this.get('contentBox');
+        var flame = content_box.query('.dynamic img[src=/@@/flame-icon]');
+        if (this.get('value')) {
+            flame.removeClass('unseen');
+        } else {
+            flame.addClass('unseen');
+        }
+    },
+
+    render: function() {
+        MeTooChoiceSource.superclass.render.apply(this, arguments);
+        // Force the ChoiceSource to be rendered inline.
+        this.get('boundingBox').setStyle('display', 'inline');
+        // Hide the static content and show the dynamic content.
+        this.get('contentBox').query('.static').addClass('unseen');
+        this.get('contentBox').query('.dynamic').removeClass('unseen');
+    },
+
+    _saveData: function() {
+        // Set the widget to the 'waiting' state.
+        this._uiSetWaiting();
+
+        var value = this.getInput();
+        var client =  new LP.client.Launchpad();
+        var widget = this;
+
+        var config = {
+            on: {
+                success: function(entry) {
+                    widget._uiClearWaiting();
+                    MeTooChoiceSource.superclass._saveData.call(
+                        widget, value);
+                },
+                failure: this.error_handler.getFailureHandler()
+            },
+            parameters: {
+                affected: value
+            }
+        };
+
+        client.named_post(
+            LP.client.cache.bug.self_link, 'markUserAffected', config);
+    }
+});
+
 /*
  * Check if the current user can unsubscribe the person
  * being subscribed.
@@ -1402,6 +1512,6 @@
     }
 }
 }, '0.1', {requires: ['base', 'oop', 'node', 'event', 'io-base', 'substitute',
-                      'widget-position-ext', 'lazr.formoverlay', 'lazr.anim', 
+                      'widget-position-ext', 'lazr.formoverlay', 'lazr.anim',
                       'lazr.base', 'lazr.overlay', 'lazr.choiceedit',
                       'lp.picker', 'lp.client.plugins', 'lp.subscriber']});

=== modified file 'lib/lp/bugs/browser/bugtask.py'
--- lib/lp/bugs/browser/bugtask.py	2009-07-17 18:46:25 +0000
+++ lib/lp/bugs/browser/bugtask.py	2009-07-23 10:34:08 +0000
@@ -2915,13 +2915,15 @@
         return self.context.isUserAffected(self.user)
 
     @property
-    def affects_form_value(self):
-        """The value to use in the inline me too form."""
-        affected = self.context.isUserAffected(self.user)
-        if affected is None or affected == False:
-            return 'YES'
+    def current_user_affected_js_status(self):
+        """A javascript literal indicating if the user is affected."""
+        affected = self.current_user_affected_status
+        if affected is None:
+            return 'null'
+        elif affected:
+            return 'true'
         else:
-            return 'NO'
+            return 'false'
 
 
 class BugTaskTableRowView(LaunchpadView):

=== modified file 'lib/lp/bugs/browser/tests/test_bugtask.py'
--- lib/lp/bugs/browser/tests/test_bugtask.py	2009-06-25 00:40:31 +0000
+++ lib/lp/bugs/browser/tests/test_bugtask.py	2009-07-23 10:34:08 +0000
@@ -1,23 +1,63 @@
 # Copyright 2009 Canonical Ltd.  This software is licensed under the
 # GNU Affero General Public License version 3 (see the file LICENSE).
 
+__metaclass__ = type
+
+
 import unittest
 
 from zope.testing.doctest import DocTestSuite
 
-from lp.bugs.browser import bugtask
+from canonical.launchpad.ftests import login
 from canonical.launchpad.testing.systemdocs import (
     LayeredDocFileSuite, setUp, tearDown)
 from canonical.testing import LaunchpadFunctionalLayer
 
+from lp.bugs.browser import bugtask
+from lp.bugs.browser.bugtask import BugTasksAndNominationsView
+from lp.testing import TestCaseWithFactory
+
+
+class TestBugTasksAndNominationsView(TestCaseWithFactory):
+
+    layer = LaunchpadFunctionalLayer
+
+    def setUp(self):
+        super(TestBugTasksAndNominationsView, self).setUp()
+        login('[e-mail]')
+        self.bug = self.factory.makeBug()
+        self.view = BugTasksAndNominationsView(self.bug, None)
+
+    def test_current_user_affected_status(self):
+        self.failUnlessEqual(
+            None, self.view.current_user_affected_status)
+        self.view.context.markUserAffected(self.view.user, True)
+        self.failUnlessEqual(
+            True, self.view.current_user_affected_status)
+        self.view.context.markUserAffected(self.view.user, False)
+        self.failUnlessEqual(
+            False, self.view.current_user_affected_status)
+
+    def test_current_user_affected_js_status(self):
+        self.failUnlessEqual(
+            'null', self.view.current_user_affected_js_status)
+        self.view.context.markUserAffected(self.view.user, True)
+        self.failUnlessEqual(
+            'true', self.view.current_user_affected_js_status)
+        self.view.context.markUserAffected(self.view.user, False)
+        self.failUnlessEqual(
+            'false', self.view.current_user_affected_js_status)
+
 
 def test_suite():
     suite = unittest.TestSuite()
+    suite.addTest(unittest.makeSuite(TestBugTasksAndNominationsView))
     suite.addTest(DocTestSuite(bugtask))
     suite.addTest(LayeredDocFileSuite(
         'bugtask-target-link-titles.txt', setUp=setUp, tearDown=tearDown,
         layer=LaunchpadFunctionalLayer))
     return suite
 
+
 if __name__ == '__main__':
     unittest.TextTestRunner().run(test_suite())

=== modified file 'lib/lp/bugs/stories/bugs/xx-bug-affects-me-too.txt'
--- lib/lp/bugs/stories/bugs/xx-bug-affects-me-too.txt	2009-06-12 16:36:02 +0000
+++ lib/lp/bugs/stories/bugs/xx-bug-affects-me-too.txt	2009-07-31 13:49:53 +0000
@@ -1,7 +1,7 @@
 = Marking a bug as affecting the user =
 
-Users can mark bugs as affecting them. Let's create a sample bug to try
-this on.
+Users can mark bugs as affecting them. Let's create a sample bug to
+try this out.
 
    >>> login(ANONYMOUS)
    >>> from canonical.launchpad.webapp import canonical_url
@@ -9,15 +9,27 @@
    >>> test_bug_url = canonical_url(test_bug)
    >>> logout()
 
-The user goes to the bug's index page, and clicks the edit action link
-near 'This bug affects me too'.
+The user goes to the bug's index page, and finds a statement that the
+bug is not marked as affecting them.
 
    >>> user_browser.open(test_bug_url)
    >>> print extract_text(find_tag_by_id(
-   ...     user_browser.contents, 'affectsmetooform'))
-   This bug doesn't affect me...
-
-   >>> user_browser.getLink('change').click()
+   ...     user_browser.contents, 'affectsmetoo').find(
+   ...         None, 'static'))
+   This bug doesn't affect me
+
+Next to the statement is a link containing an edit icon.
+
+   >>> edit_link = find_tag_by_id(
+   ...     user_browser.contents, 'affectsmetoo').a
+   >>> print edit_link['href']
+   +affectsmetoo
+   >>> print edit_link.img['src']
+   /@@/edit
+
+The user is affected by this bug, so clicks the link.
+
+   >>> user_browser.getLink(url='+affectsmetoo').click()
    >>> print user_browser.url
    http://bugs.launchpad.dev/.../+bug/.../+affectsmetoo
    >>> user_browser.getControl(name='field.affects').value
@@ -28,22 +40,26 @@
    >>> user_browser.getControl('Change').click()
 
 The bug page loads again, and now the text is changed, to make it
-clear to the user that they can change the selection.
+clear to the user that they have marked this bug as affecting them.
 
-   >>> print extract_text(find_tags_by_class(
-   ...     user_browser.contents, 'menu-link-affectsmetoo')[0])
-   change
+   >>> print extract_text(find_tag_by_id(
+   ...     user_browser.contents, 'affectsmetoo').find(
+   ...         None, 'static'))
+   This bug affects me too
 
 Next to it, we also see the 'hot bug' icon, to indicate that the user
 has marked the bug as affecting them.
 
    >>> print find_tag_by_id(
-   ...     user_browser.contents, 'affectsmetooform').img['src']
+   ...     user_browser.contents, 'affectsmetoo').img['src']
    /@@/flame-icon
 
-   >>> user_browser.getLink('change').click()
-
-The user is changing his selection to 'No' and submits the form.
+On second thoughts, the user realises that this bug does not affect
+them, so they click on the edit link once more.
+
+   >>> user_browser.getLink(url='+affectsmetoo').click()
+
+The user changes his selection to 'No' and submits the form.
 
    >>> user_browser.getControl(name='field.affects').value = ['NO']
    >>> user_browser.getControl('Change').click()
@@ -51,18 +67,43 @@
 Back at the bug page, the text changes once again.
 
    >>> print extract_text(find_tag_by_id(
-   ...     user_browser.contents, 'affectsmetooform'))
-   This bug doesn't affect me...
-
-== One-click interaction ==
-
-If the user's browser provides javascript, they don't need to go to
-another page to change their selection. Instead, an in-page form is
-submitted when they click the action link.
-
-   >>> me_too_form = user_browser.getForm(id='affectsmetooform')
-   >>> user_browser.getControl(name='field.affects').value
-   'YES'
-   >>> me_too_form.submit()
-   >>> user_browser.getControl(name='field.affects').value
-   'NO'
+   ...     user_browser.contents, 'affectsmetoo').find(
+   ...         None, 'static'))
+   This bug doesn't affect me
+
+
+== Static and dynamic support ==
+
+A bug page contains markup to support both static (no Javascript) and
+dynamic (Javascript enabled) scenarios.
+
+   >>> def class_filter(css_class):
+   ...     def test(node):
+   ...         return css_class in node.get('class', '').split()
+   ...     return test
+
+   >>> static_content = find_tag_by_id(
+   ...     user_browser.contents, 'affectsmetoo').find(
+   ...         class_filter('static'))
+
+   >>> static_content is not None
+   True
+
+   >>> dynamic_content = find_tag_by_id(
+   ...     user_browser.contents, 'affectsmetoo').find(
+   ...         class_filter('dynamic'))
+
+   >>> dynamic_content is not None
+   True
+
+The dynamic content is hidden by the presence of the "unseen" CSS
+class.
+
+   >>> print static_content.get('class')
+   static
+
+   >>> print dynamic_content.get('class')
+   dynamic unseen
+
+It is the responsibilty of Javascript running in the page to unhide
+the dynamic content and hide the static content.

=== modified file 'lib/lp/bugs/templates/bugtasks-and-nominations-table.pt'
--- lib/lp/bugs/templates/bugtasks-and-nominations-table.pt	2009-07-17 17:59:07 +0000
+++ lib/lp/bugs/templates/bugtasks-and-nominations-table.pt	2009-07-31 14:47:35 +0000
@@ -38,11 +38,9 @@
 
 </table>
 
-<div
-  class="actions"
-  tal:define="current_bugtask view/current_bugtask"
-
-        tal:condition="view/displayAlsoAffectsLinks">
+<div class="actions"
+     tal:define="current_bugtask view/current_bugtask"
+     tal:condition="view/displayAlsoAffectsLinks">
     <tal:also-affects-links define="context_menu context/menu:context">
       <tal:addupstream
         define="link context_menu/addupstream"
@@ -56,56 +54,50 @@
         define="link context_menu/nominate"
         condition="link/enabled"
         replace="structure link/render" />
-      <form
-        id="affectsmetooform"
-        name="affectsmetooform"
-        method="post"
-        enctype="multipart/form-data"
-        accept-charset="UTF-8"
-        tal:define="link context_menu/affectsmetoo"
-        tal:condition="link/enabled"
-        tal:attributes="action link/url"
-        style="display: inline">
-        <input
-          name="field.affects"
-          type="hidden"
-          tal:attributes="value view/affects_form_value" />
-        <input
-          type="hidden"
-          name="field.actions.change"
-          value="" />
-        <tal:affected condition="view/current_user_affected_status">
-          <img width="14" height="14" src="/@@/flame-icon" alt="" />
-          This bug affects me too
-        </tal:affected>
-        <tal:affected condition="not: view/current_user_affected_status">
-          This bug doesn't affect me
-        </tal:affected>
-        (<tal:affectsmetoo
-        define="link context_menu/affectsmetoo"
-        condition="link/enabled"
-        replace="structure link/render" />)
-        <tal:nothing condition="nothing">
-          The following is a trick to allow users to mark
-          themselves as affected by a bug with only one click.
-          If Javascript is available, we submit the form and
-          immediately go back to the same page, saving them the
-          need to go to a new page.
-        </tal:nothing>
-        <script type="text/javascript">
-            function sendMeTooForm(e) {
-                $('affectsmetooform').submit();
-                e.preventDefault();
-            }
-            function connectMeTooLink() {
-                var me_too_link = getFirstElementByTagAndClassName(
-                'a', 'menu-link-affectsmetoo');
-                connect(me_too_link, 'onclick', sendMeTooForm);
-            }
-            registerLaunchpadFunction(connectMeTooLink);
+      <span id="affectsmetoo" style="display: inline"
+            tal:condition="link/enabled"
+            tal:define="link context_menu/affectsmetoo;
+                        affected view/current_user_affected_status">
+
+        <tal:comment condition="nothing">
+          This .static section is shown in browsers with javascript
+          enabled, and before setup_me_too is run.
+        </tal:comment>
+        <span class="static">
+          <tal:affected condition="affected">
+            <img width="14" height="14" src="/@@/flame-icon" alt="" />
+            This bug affects me too
+          </tal:affected>
+          <tal:not-affected condition="not:affected">
+            This bug doesn't affect me
+          </tal:not-affected>
+          <a href="+affectsmetoo">
+            <img class="editicon" src="/@@/edit" alt="Edit" />
+          </a>
+        </span>
+
+        <tal:comment condition="nothing">
+          This .dynamic section is used by setup_me_too to display
+          controls and information in the correct places.
+        </tal:comment>
+        <span class="dynamic unseen">
+          <img class="editicon" src="/@@/edit" alt="Edit" />
+          <a href="+affectsmetoo" class="js-action"
+             ><span class="value">Does this bug affect you?</span></a>
+          <img src="/@@/flame-icon" alt=""/>
+        </span>
+
+        <script type="text/javascript" tal:content="string:
+          YUI().use('event', 'bugs.bugtask_index', function(Y) {
+              Y.on('load', function(e) {
+                  Y.bugs.setup_me_too(${view/current_user_affected_js_status});
+              }, window);
+          });
+          ">
         </script>
-      </form>
+
+      </span>
     </tal:also-affects-links>
-
 </div>
+
 </tal:root>

=== added file 'lib/lp/bugs/windmill/tests/test_bugs/test_bug_me_too.py'
--- lib/lp/bugs/windmill/tests/test_bugs/test_bug_me_too.py	1970-01-01 00:00:00 +0000
+++ lib/lp/bugs/windmill/tests/test_bugs/test_bug_me_too.py	2009-07-30 15:33:35 +0000
@@ -0,0 +1,65 @@
+# Copyright 2009 Canonical Ltd.  This software is licensed under the
+# GNU Affero General Public License version 3 (see the file LICENSE).
+
+from canonical.launchpad.windmill.testing import lpuser
+
+from windmill.authoring import WindmillTestClient
+
+
+def test_me_too():
+    """Test the "this bug affects me too" options on bug pages.
+
+    This test ensures that, with Javascript enabled, the "me too"
+    status can be edited in-page.
+    """
+    client = WindmillTestClient('Bug "me too" test')
+    lpuser.SAMPLE_PERSON.ensure_login(client)
+
+    # Open bug 11 and wait for it to finish loading.
+    client.open(url=u'http://bugs.launchpad.dev:8085/jokosher/+bug/11/+index')
+    client.waits.forPageLoad(timeout=u'20000')
+
+    # Wait for setup_me_too to sort out the "me too" elements.
+    client.waits.forElement(
+        xpath=(u"//span[@id='affectsmetoo' and "
+               u"@class='yui-metoocs-content']"))
+
+    # Currently this bug does not affect the logged-in user.
+    client.asserts.assertText(
+        xpath=u"//span[@id='affectsmetoo']/span[@class='value']",
+        validator=u"This bug doesn't affect me")
+
+    # There is an edit icon next to the text which can be clicked to
+    # edit the "me too" status. However, we won't click it with
+    # Windmill because the widget actually responds to mouse-down, and
+    # Windmill seems to do something funny instead.
+    client.mouseDown(
+        xpath=u"//span[@id='affectsmetoo']//img[@class='editicon']")
+    client.mouseUp(
+        xpath=u"//span[@id='affectsmetoo']//img[@class='editicon']")
+
+    # Wait for the modal dialog to appear.
+    client.waits.forElement(id=u'yui-pretty-overlay-modal')
+
+    # There's a close button if we change our mind.
+    client.click(
+        xpath=(u"//div[@id='yui-pretty-overlay-modal']//"
+               u"a[@class='close-button']"))
+
+    # Wait for the modal dialog to disappear. Unfortunately the test
+    # below doesn't work, nor does testing clientWidth, or anything I
+    # could think of, so it's commented out for now because chasing
+    # this is not a good use of time.
+
+    # client.asserts.assertElemJS(
+    #     id=u'yui-pretty-overlay-modal',
+    #     js=(u'getComputedStyle(element, '
+    #         u'"visibility").visibility == "hidden"'))
+
+    # However, we want to mark this bug as affecting the logged-in
+    # user. We can also click on the content box of the "me too"
+    # widget; we are not forced to use the edit icon.
+    client.click(xpath=u"//span[@id='affectsmetoo']")
+    client.waits.forElement(id=u'yui-pretty-overlay-modal')
+
+    # Do more here...