Waypoint update broke things!

[iamntz]

It seems that a5912c6 broke the waypoint.js

Here is the fix:

--- a/assets/dev/js/frontend/handlers/counter.js
+++ b/assets/dev/js/frontend/handlers/counter.js
@@ -1,6 +1,6 @@
 module.exports = function( $scoop, $ ) {
        $scoop.find( '.elementor-counter-number' ).waypoint( function() {
-               var $number = $( this );
+               var $number = $( this.element );

                $number.numerator( {
                        duration: $number.data( 'duration' )
diff --git a/assets/dev/js/frontend/handlers/progress.js b/assets/dev/js/frontend/handlers/progress.js
index fefc705..6902fd0 100644
--- a/assets/dev/js/frontend/handlers/progress.js
+++ b/assets/dev/js/frontend/handlers/progress.js
@@ -1,6 +1,6 @@
 module.exports = function( $scoop, $ ) {
        $scoop.find( '.elementor-progress-bar' ).waypoint( function() {
-               var $progressbar = $( this );
+               var $progressbar = $( this.element );

                $progressbar.css( 'width', $progressbar.data( 'max' ) + '%' );
        }, { offset: '90%' } );

[joshmarom]

Hi @iamntz. Thank you for your contribution. Could you please elaborate on what exactly was broken?
We can't really see what's wrong...

[iamntz]

Sure thing. Waypoint.js used to have the element as the context (i.e. this was the element itself).

But they changed and now the context is the Waypoint instance, so this will be Waypoint instance:

When we're inside the handler function the this keyword is a reference to the Waypoint instance. We can use this object to access all the properties and methods in the API. One of the most useful properties is element, the waypoint's DOM element.

the this? section

[kobizz]

Ok. First of all, the counter widget is working properly.

Regarding your concern, please note that the use of this as a Waypoint instance, only applies to the handler method, as explained in their official docs.

[iamntz]

I forgot to mention, this is a problem only on the release/1.0.0 branch. On develop works as expected.

You are really expecting that a 2 version upgrade to not breaking anything? 💃

[kobizz]

Tested in release/1.0.0 and everything is just fine.

[iamntz]

You should check better though.

var $number = $( this );
// [...]
$number.data( 'duration' )

is not valid using latest version of waypoint.js...

[agusmu]

I tried to test it on my Elementor 1.0.0 and I can see that counter widget doesn't work on frontend only, but somehow it works on live editor mode... So, the bug happens on frontend only.

Applying the fix from @iamntz above makes counter widget works again on frontend.

[KingYes]

Thanks!
We fixed this by this PR: #1007