Skip to content

Loading…

Panel: panelclose event does not work #7260

Closed
wants to merge 1 commit into from

5 participants

@cgack

panelclose is not bound to document after _openPanel

Fixes gh-7058

@gabrielschulhof gabrielschulhof added this to the 1.4.3 milestone
@arschmitz
jQuery Foundation member

This cant be removed in this way or the panel will open every time a panel closes. The problem here is we are removing all handlers instead of just the one we are attaching. Also we should see if there is a reason not to use one here instead of on or why we are using on and off and not _on and _off which makes sure we only get our own handlers and that they are removed properly on destroy.

@cgack

@arschmitz switched to using _off and _on as we discussed

@arschmitz
jQuery Foundation member

@cgack please see http://api.jqueryui.com/jQuery.widget/#method-_on for proper usage of _on right now this is not working. This makes me worry also about that we are not testing this properly because all tests pass yet if you go to the responsive panels page in the demos on your fork and open the left panel then run $("#add-form").panel("open"); in the console you will se this results in an error but on master it works as intended. We should add a test to prevent regressions.

@arschmitz arschmitz commented on an outdated diff
js/widgets/panel.js
@@ -365,8 +365,10 @@ $.widget( "mobile.panel", {
self._trigger( "beforeopen" );
if ( self._page().jqmData( "panel" ) === "open" ) {
- self.document.on( "panelclose", function() {
- _openPanel();
+ self._on( self.document, {
+ "panelclose": function() {
+ _openPanel();
+ }
@arschmitz jQuery Foundation member

this should be "panelclose": "_openPanel"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@arschmitz
jQuery Foundation member

Its strange this passed all the tests i can't see how this would work in its current form.

@cgack

It must have been magic. I'll update the branch with the change

@coveralls

Coverage Status

Coverage increased (+0.02%) when pulling d836518 on cgack:7058-panelclose-event into fec1e85 on jquery:master.

@cgack

@arschmitz I updated this PR with a new commit for you to review whenever

@arschmitz arschmitz commented on an outdated diff
tests/unit/panel/index.html
@@ -118,5 +128,6 @@ <h1 id="demo-links">Panels</h1>
<a href="#" data-nstest-rel="back">Back</a>
</div>
+
@arschmitz jQuery Foundation member

remove extra line here

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@arschmitz
jQuery Foundation member

@cgack other then that one line this is good to go. Can you fix that and rebase please. When your done ping me on irc and I will land this.

@coveralls

Coverage Status

Coverage increased (+0.68%) when pulling f93385d on cgack:7058-panelclose-event into fec1e85 on jquery:master.

@cgack

@arschmitz fixed the one line and rebased into a single commit. fire at will.

@coveralls

Coverage Status

Coverage decreased (-6.49%) when pulling 4c2ed33 on cgack:7058-panelclose-event into 66efe74 on jquery:master.

@arschmitz
jQuery Foundation member

@cgack sorry this is my fault but when we say squash we really normally mean fixup otherwise you get a massive and not very useful commit message cgack@4c2ed33 can you just clean this up. Also you forgot Closes gh-7260 to close this pr Thanks!

@cgack cgack added a commit to cgack/jquery-mobile that referenced this pull request
@cgack cgack Panel: panelclose event does not work
Fixes gh-7058
Closes gh-7260
3728bc8
@cgack

ha! @arschmitz I thought it was a little crazy to have all that noise in there - Updated with a new cleaner message - hopefully this works

@arschmitz
jQuery Foundation member

@cgack can you make the commit message what you did instead of the problem you fixed.

@cgack

@arschmitz sure! how's it look now?

@arschmitz
jQuery Foundation member

:+1:

@coveralls

Coverage Status

Coverage decreased (-6.55%) when pulling 3728bc8 on cgack:7058-panelclose-event into 66efe74 on jquery:master.

@coveralls

Coverage Status

Coverage decreased (-6.68%) when pulling 1f763bc on cgack:7058-panelclose-event into 66efe74 on jquery:master.

@arschmitz arschmitz closed this in 3df9b3b
@arschmitz arschmitz added a commit that referenced this pull request
@cgack cgack Panel: use self._off for panelclose instead of document.off
Fixes gh-7058
Closes gh-7260

(cherry picked from commit 3df9b3b)
c8ca19d
@agcolom agcolom added a commit to agcolom/jquery-mobile that referenced this pull request
@cgack cgack Panel: use self._off for panelclose instead of document.off
Fixes gh-7058
Closes gh-7260
f0f181d
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Jun 14, 2014
  1. @cgack
Showing with 45 additions and 3 deletions.
  1. +3 −3 js/widgets/panel.js
  2. +10 −0 tests/unit/panel/index.html
  3. +32 −0 tests/unit/panel/panel_core.js
View
6 js/widgets/panel.js
@@ -308,7 +308,7 @@ $.widget( "mobile.panel", {
o = self.options,
_openPanel = function() {
- self.document.off( "panelclose" );
+ self._off( self.document , "panelclose" );
self._page().jqmData( "panel", "open" );
if ( $.support.cssTransform3d && !!o.animate && o.display !== "overlay" ) {
@@ -365,8 +365,8 @@ $.widget( "mobile.panel", {
self._trigger( "beforeopen" );
if ( self._page().jqmData( "panel" ) === "open" ) {
- self.document.on( "panelclose", function() {
- _openPanel();
+ self._on( self.document, {
+ "panelclose": "_openPanel"
});
} else {
_openPanel();
View
10 tests/unit/panel/index.html
@@ -100,6 +100,16 @@ <h1 id="demo-links">Panels</h1>
<a href="#panel-test-id-change">Open Panel</a>
<a href="#panel-test-external">Open Panel</a>
</div>
+
+ <div data-nstest-role="panel" id="panel-panelclose-event">
+ <h1>Panel!</h1>
+ </div>
+ <div data-nstest-role="panel" id="panel-openfirst" data-position="left">
+ <h1>first panel</h1>
+ </div>
+ <div data-nstest-role="panel" id="panel-opensecond" data-position="right">
+ <h1>second panel</h1>
+ </div>
</div>
<div data-nstest-role="page" id="page2"></div>
<div id="external-panel-getWrapper-test"></div>
View
32 tests/unit/panel/panel_core.js
@@ -197,6 +197,38 @@
$panel.panel();
});
+ asyncTest( "panelclose not called on document", function() {
+ expect( 2 );
+
+ $( document ).on( "panelopen", "#panel-panelclose-event", function() {
+ $(this).panel("close");
+ });
+
+ $( document ).on( "panelclose", "#panel-panelclose-event", function() {
+ ok( true, "document panelclose event emitted" );
+ });
+
+ $( document.body ).on( "panelclose", "#panel-panelclose-event", function() {
+ ok( true, "document.body panelclose event emitted" );
+ start();
+ });
+
+ $( "#panel-panelclose-event" ).panel("open");
+
+ });
+
+ asyncTest( "should be able to open a second panel", function() {
+ expect ( 1 );
+
+ $( document ).on( "panelopen", "#panel-opensecond", function() {
+ ok( true, "second panel opened" );
+ start();
+ });
+
+ $( "#panel-openfirst" ).panel( "open" );
+ $( "#panel-opensecond" ).panel( "open" );
+ });
+
module( "dismissable panel", {
setup: function(){
$.Event.prototype.originalEvent = {
Something went wrong with that request. Please try again.