workarea-paypal 3.0.4 → 3.0.5

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 11b3db0ccfcaf33684bf21632d8a5ad2db9092f21993f68495b357b80962e1e3
-  data.tar.gz: 2fb729f7458c8d9925dfdf9f8728ccbd90eeccd0e8dada3384a76e5d47a697f9
+  metadata.gz: 92bdac05441fd966fa90acc4cb18badd013d583b0cc69b98a36a79144e5e5fac
+  data.tar.gz: 519be45e1b7a3e27167df514ae49fe1ac32eaf5250156c9ed88b6c15e7c1bf7d
 SHA512:
-  metadata.gz: c3fd4c2e52cf635eb6460b02041cef631026b31f9358a16c6b7ec55b00a92ff3f89c8eeec4ea4d14d48041c31e680d07ad26cd0c2e68383bc94ee287087d1d12
-  data.tar.gz: a35ed6dfce864733502fe2eab4a688776d1b35e6c189bd54f2a42d5ab75369cd03f588514c3bf97e9805d66b6d61d9ce31e520bd8169e3eec8246abf5cbc68f1
+  metadata.gz: a6d388830f585b699138e407415190f6d8d21489d22666010d2a1a3e3c2499320c0b26b9b3c1cfb7082e0e23ea53cd11d49eba8662852e34deaefb1b7624d731
+  data.tar.gz: ff569d2f2291693dfbb839c84b678ccb662b8f69286c3194233550ccc7731e2b13f854d42184e635ec1a2303e5c31352f307a2a518ed5b78f706666afa099840

data/CHANGELOG.md

@@ -1,3 +1,37 @@
+Workarea Paypal 3.0.5 (2020-08-14)
+--------------------------------------------------------------------------------
+
+*   Address Race Condition When Using PayPal's SDK
+
+    It's possible that our modules that use the PayPal SDK will be
+    initialized prior to `window.paypal` being available on the page, now
+    that the JS is loaded in asynchronously, causing unnecessary loss in
+    functionality. Additionally, there doesn't seem to be a way to bind to
+    any kind of event given off by the SDK on `window` that would allow us
+    to know whether the SDK is truly loaded or not. To address this, when
+    the `window.paypal` object is not available yet, and there's a
+    `<script>` tag on the page loading the PayPal SDK (indicating that we
+    are indeed expecting the SDK to be there), the PayPal modules will
+    re-try initializing every 5 seconds until `window.paypal` is available.
+
+    PAYPAL-7
+
+    Tom Scott
+
+*   Load JavaScript From PayPal Asynchronously
+
+    Using the `async` attribute in the `<script>` tag that loads PayPal's
+    JavaScript code, Workarea can now prevent it blocking the page in case
+    of a failure, and improve load time performance to boot.
+
+    PAYPAL-7
+
+    Fixes #10
+
+    Tom Scott
+
+
+
 Workarea Paypal 3.0.4 (2020-06-17)
 --------------------------------------------------------------------------------
 

data/Gemfile

@@ -3,4 +3,4 @@ git_source(:github) { |repo| "https://github.com/#{repo}.git" }
 
 gemspec
 
-gem 'workarea'
+gem 'workarea', github: 'workarea-commerce/workarea', branch: 'v3.5-stable'

data/app/assets/javascripts/workarea/storefront/paypal/modules/paypal.js

@@ -0,0 +1,63 @@
+/**
+ *
+ * Reliably ensure that the PayPal SDK is either loaded or will
+ * be loading.
+ *
+ * @namespace WORKAREA.paypal
+ */
+WORKAREA.registerModule('paypal', (function () {
+    'use strict';
+
+    var handlers = [],
+        attempts = 0,
+        paypalLoaded = null,
+
+        /**
+         * Define a function that will be called when the paypal SDK has
+         * loaded.
+         *
+         * @method
+         * @name ready
+         * @param function handler - A function to be called when PayPal
+         *                           is available.
+         * @memberof WORKAREA.paypal
+         */
+        ready = function(handler) {
+            if (paypalLoaded) {
+                handler();
+            } else {
+                handlers.push(handler);
+            }
+        },
+
+        /**
+         * Continuously check for whether the Paypal SDK has loaded
+         * every 5 seconds, and call function handlers defined in
+         * `ready()` when the `window.paypal` object is available. This
+         * will only occur if the `<script>` tag containing the PayPal
+         * SDK is detected to be on the page.
+         *
+         * @method
+         * @name init
+         * @memberof WORKAREA.paypal
+         */
+        init = function() {
+            var $sdk = $('script[data-partner-attribution-id]'),
+                paypalExpectedToLoad = !_.isEmpty($sdk);
+
+            attempts += 1;
+            paypalLoaded = window.paypal !== undefined;
+
+            if (!paypalLoaded && paypalExpectedToLoad && attempts <= 20) {
+                window.setTimeout(init, 2000);
+            } else if (paypalLoaded) {
+                _.each(handlers, function(handler) { handler(); });
+                handlers = [];
+            }
+        };
+
+    return {
+        ready: ready,
+        init: init
+    };
+}()));

data/app/assets/javascripts/workarea/storefront/paypal/modules/paypal_buttons.js

@@ -56,13 +56,14 @@ WORKAREA.registerModule('paypalButtons', (function () {
          * @name init
          * @memberof WORKAREA.paypalButtons
          */
-        init = function ($scope) {
-            var $buttonContainer = $('#paypal-button-container', $scope);
+        init = function($scope) {
+            WORKAREA.paypal.ready(function() {
+                var $buttonContainer = $('#paypal-button-container', $scope);
 
-            if (window.paypal === undefined) { return; }
-            if (_.isEmpty($buttonContainer)) { return; }
+                if (_.isEmpty($buttonContainer)) { return; }
 
-            setup($buttonContainer);
+                setup($buttonContainer);
+            });
         };
 
     return {

data/app/assets/javascripts/workarea/storefront/paypal/modules/paypal_hosted_fields.js

@@ -81,13 +81,14 @@ WORKAREA.registerModule('paypalHostedFields', (function () {
          * @memberof WORKAREA.paypalHostedFields
          */
         init = function ($scope) {
-            var $placeholder = $('[data-paypal-hosted-fields]', $scope);
+            WORKAREA.paypal.ready(function () {
+                var $placeholder = $('[data-paypal-hosted-fields]', $scope);
 
-            if (_.isEmpty($placeholder)) {  return;  }
-            if (window.paypal === undefined) { return; }
-            if (!paypal.HostedFields.isEligible()) { return; }
+                if (_.isEmpty($placeholder)) {  return;  }
+                if (!paypal.HostedFields.isEligible()) { return; }
 
-            setup($placeholder, $scope);
+                setup($placeholder, $scope);
+            });
         };
 
     return {

data/app/helpers/workarea/storefront/paypal_helper.rb

@@ -27,6 +27,7 @@ module Workarea
 
         javascript_include_tag(
           "https://www.paypal.com/sdk/js?#{params.to_query}",
+          async: true,
           data: {
             partner_attribution_id: 'Workarea_SP', # Do not change this
             client_token: @paypal_client_token

data/config/initializers/append_points.rb

@@ -25,6 +25,7 @@ Workarea::Plugin.append_javascripts(
 
 Workarea::Plugin.append_javascripts(
   'storefront.modules',
+  'workarea/storefront/paypal/modules/paypal',
   'workarea/storefront/paypal/modules/update_checkout_submit_text',
   'workarea/storefront/paypal/modules/paypal_buttons',
   'workarea/storefront/paypal/modules/paypal_hosted_fields'

data/lib/workarea/paypal/version.rb

@@ -1,5 +1,5 @@
 module Workarea
   module Paypal
-    VERSION = '3.0.4'.freeze
+    VERSION = '3.0.5'.freeze
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: workarea-paypal
 version: !ruby/object:Gem::Version
-  version: 3.0.4
+  version: 3.0.5
 platform: ruby
 authors:
 - bcrouse
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-06-17 00:00:00.000000000 Z
+date: 2020-08-14 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: workarea
@@ -76,6 +76,7 @@ files:
 - app/assets/images/workarea/admin/payment_icons/paypal.svg
 - app/assets/images/workarea/storefront/payment_icons/paypal.svg
 - app/assets/javascripts/workarea/storefront/paypal/config.js.erb
+- app/assets/javascripts/workarea/storefront/paypal/modules/paypal.js
 - app/assets/javascripts/workarea/storefront/paypal/modules/paypal_buttons.js
 - app/assets/javascripts/workarea/storefront/paypal/modules/paypal_hosted_fields.js
 - app/assets/javascripts/workarea/storefront/paypal/modules/update_checkout_submit_text.js