Learn about our newest features and enhancements!
Web Forms: How to Test Web Forms
Jessica Mocha 11/15/2022 8:07:00 PM



Testing your new web form is an essential task prior to releasing to your donors and constituents. This is a great opportunity to review the end user experience, auto responder content, receipt/confirmation pages and to verify any web form analytics associated with 3rd party integrations. Testing within CharityEngine® is an easy task to undergo with the following steps outlined below. The following steps can be used to test all web forms including but not limited to donation forms, events forms, pledge forms, and contact forms. 

Note:
If you are making changes to an active form, CharityEngine® suggests a copy be made of the form to test any changes before making the changes to the live form.

Important Note - if using iFrames: Multiple browsers, including Chrome for desktop, Chrome for Android, Firefox, and Microsoft Edge, have updated, and will likely continue to update, their security settings to make websites safer.  Some of the settings that have been rolled out in recent years, including changing the default HTTP Referrer-Policy to the more secure strict-origin-when-cross-origin setting, are negatively impacting certain legacy web design and development patterns, in particular the practice of including third-party content or services on your website using an iFrame. Please see our article for more details regarding iFrames here.

Preparing for Web Form Testing

As you begin your testing efforts, consider some overarching elements in your testing approach: 

  • Review to ensure your web form is presenting to donors as expected including data entry fields, success pages, decline pages.
  • Should your form result in an auto response email, such as a thank you to the donation, ensure you receive with the expected content, images, correct link with click through to the correct site. This should also include verifying any carbon copy or internal notifications are properly sending. 
  • As you complete the web form, review the transaction details within CharityEngine® to ensure all data is correctly presenting including any initiative assignment, tag/group attributions, auto assignment of opt in list, and/or custom field presentment.
  • If you are embedding your web form, it is also important to test your new form directly from your website, if applicable. 
  • Important Note: CharityEngine® does not support iFrames with web forms. This may create usability issues with your forms. 

Temporary Deactivation of Payment Processing (Payment Gateway)

In order to being your testing, you will want to modify payment processing to temporarily deactivate live payment processing. This will ensure the ability to test a transaction for a full end to end testing experience. (See FAQs below to access test account numbers) 

To temporarily deactivate payment processing, navigate to Online > Web Forms > Search & Manage > Locate Web Form for testing > navigate to the Advanced tab > Payments tab > General tab
  • From here, unclick Enable Payment Processing check box >click Save
  • Once the box is unchecked, all other payment configurations will disappear.




How to Begin Testing Your Web Form

Now that payment processing has been turned off, you will be able to view your form online, just as your donors would. You can access your web form in two ways:

  • From the General tab, click on the Link or
  • From the Save drop down, click on View Online



You can now proceed to make a donation, register for an event, sign up for a newsletter, etc. As you continue, test successful transactions and failed transactions to verify all settings are configured as expected. Also verify any autoresponder email content. Finally, also review transactions by navigating to Dentations > Transactions > Search & Manage. Because the payments have been deactivated, payments will not be live transactions, but the test transactions will allow you to see exactly what the donor will see.

Note: After you have tested the form, you will need to enable payment processing again to ensure your donors will be able to make live and successful financial donations using their credit card or ACH.  



Completing Your Testing Activities

Once you are satisfied with your web form, there are a few remaining steps to take prior to making your web form public:
  1. Bulk deletion of test transactions - if you need to delete any test transactions, please continue through to this article.
  2. Live Credit Card/ACH transactions - if you completed any transactions using live credit cards and/or ACH accounts, CharityEngine® recommends you do not delete these transactions as they are a financial record. Best practice should be to complete a refund of the transaction following the steps outlined in our refunds article.
  3. Important: Ensure your payment gateway has been reactivated repeating the steps outlined above. Navigate to Online > Web Forms > Search & Manage > Locate Web Form for testing > navigate to the Advanced tab > Payments tab > General tab. From here, unclick Enable Payment Processing check box >click Save.

Troubleshooting Your Web Form

  • On my Event web form, my tickets will not display.
    • Most frequently this is related to 
      • Navigate to Events & Volunteers > Events > Search & Manage > locate your event and navigate to ActionManage. Ensure event dates are reflective of your event and/or testing time frame. If dated in the past or future, tickets will not be available for display on your web form.
  • When testing your web form from your, if the page appears to either present a plain white screen or appears to be refreshing the web form and transactions are not successfully populating. 

    Frequently Asked Questions

    Q. What credit card numbers can be used to test the payment gateway? 
    A. If your merchant account has been established with First Data, you can leverage the site to access Fiserv recommended test credit cards fiserv.developer

    Q. Once my web form is live, how do I monitor web form performance?
    A. There are a variety of ways to monitor the success of your web form performance, including:
    • To see a summary of transactions, navigate to Reports & Analytics > Transactions > Transaction Summary > Advanced Filter > Form (enter web form id)
    • To view performance comparison of various web forms, navigate to Reports & Analytics > Transactions > Form Performance
    Q. Can I use iFrame on my organization's website to embed my web form?
    A. CharityEngine® web forms are not supported by iFrames and are strongly discouraged from usage. Browsers have begun to deprecate iFrame integration due to their risk to website security, usability issues and also SEO issues related to indexing which can impact search results.  

     



    Related Articles

    Powered by Powered By CharityEngine