Why do I get the error Y Not Defined Error in Squarespace

Question

I am using a Javascript code to inject into a squarespace website but when I do, I get the error "uncaught referenceerror y is not defined". I'm trying to use Squarespace's Forms to write to salesforce but I do not know if YUI is maiintained on Squarespace 7.1.

<script type="text/javascript">Y.namespace('Template').Salesforce = Class.create({


initialize: function (config) {
this.config = config;
},

submit: function () {
var formData = this.getFormData(this.config.sqsFormSubmit);
var phoneNumber = '';

if (formData['phone'] && formData['phone'].length >= 4) {
  phoneNumber = formData['phone'].join('-');
}
var description = '';

for (key in formData) {
  var value = formData[key];

  if (Array.isArray(value)) {
    value = value.join(' ');
  }

  description += key + ': ' + value + '\n';
}

var params = {
  first_name: formData['name'][0],
  last_name: formData['name'][1],
  email: formData['email_address'],
  phone: phoneNumber,
  company: formData['company'],
  lead_source: formData['sqf_lead_source'] || 'web',
  description: description,
  oid: this.config.oid
};

});</script>

Answer 1

You can access 'Y' in that manner. However, your code is likely running before 'Y' is available. Wrap your code within a window 'load' event listener, like so:

<script>
window.addEventListener("load", function() {
  console.log(Y); // Your code here.
});
</script>

If you have further issues targeting the form, you may have to utilize setTimeout or MutationObserver in order to ensure that necessary elements are available.