google wallet inapp payments: Uncaught ReferenceEr

Question

we've been using google wallet inapp-payments since google io 2012.

Recently we see this error:

Uncaught ReferenceError: goog is not defined

The code is very simple:

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load('payments', '1.0', {

    'packages': ['production_config']

  })

Then we use the jquery document.ready callback to call goog.payments.inapp.buy, but it seems that the goog object is not created by then. This seems to be a race condition. purchase function simply calls goog.payments.inapp.buy

 $(document).ready(function() {
      purchase('Item1'); //function to call goog.payments.inapp.buy
       });

It is also confusing because this page https://sandbox.google.com/checkout/customer/gadget/inapp/demo.html shows the call to buy is:

google.payments.inapp.buy

while this page https://developers.google.com/in-app-payments/docs/tutorial#3 shows the call to buy is:

goog.payments.inapp.buy

Answer 1

After some additional searching (also because of the process of writing the question) a solution has been found:

See https://developers.google.com/in-app-payments/docs/tutorial#3

Important: If the API library hasn't loaded, the call to buy() will fail. You can avoid this problem by specifying the button onClick handler in step 3, using the Google Loader callback option. For details on using optional settings with google.load(), see the Google Loader Developer's Guide.

It is important to use the callback of the google.load call in order to avoid race conditions.

google.load('payments', '1.0', {
  'packages': ['production_config']

  ,"callback": function() {
          // wait for goog object to exist before using it.
          //goog.payments.inapp.buy(...);
   }
  }