How to use the browser console to QA a campaign

The QA (Quality Assurance) process enables you to choose the method(s) used to perform the QA of your campaign, which is a mandatory step before the launch.

Using the browser console is an expert mode to perform your QA, but you can also use the QA Assistant to QA your campaign on desktop. The QA assistant is also the best alternative to QA your campaign on mobile

In any case, you must activate the QA mode in the step QA & Overview of the campaign flow. 

Then go on your website (preferably in private browsing mode).

Step 1: Open the browser console 

Please follow the following steps:

  1. Activate the QA mode
  2. Open a private browser window.
  3. Enter the URL of the page you have targeted and want to check.
  4. Right-click and select Inspect or F12 to open the Developer’s tool:

The console is displayed.

13.png

Step 2: Discover the live displayed campaigns/ variations in the console

Use the ABTasty.results and the ABTasty.getTestsOnPage() commands to find out which campaign and which variation you are assigned to.

To find out if you are assigned to a campaign or variation, take these steps:

  1. From your browser console, copy and paste the following commands:
      • ABTasty.getTestsOnPage()
        displays the list of campaigns you are assigned to. Expand the list by clicking on the chevron and you will see each campaign with its ID and conditions.

        14.png

      • ABTasty.results
        displays the list of campaigns in progress on the website you are not assigned to. 
  2. If you are assigned to a campaign, the status of the campaign is "accepted":
    it means that all targeting conditions are all met, the campaign status will show “accepted”. In the example below, you would be exposed to Variation 1.
    15.png
  3. If you aren't assigned to the campaign, the main results displayed in the console are as follows: 
    • QA rejected: the campaign is currently running on a restricted audience for QA purposes and you’re not meeting the matching conditions.

Example 1: expand the line “QA Parameters” - you can see that the “cookie_scope” condition is not met, as the success status is “false”.

16.png

Example 2: the condition “ip_scope” condition is not met: the success status is “false”.

Screenshot_2022-07-04_at_12.05.15.png

    • URL_rejected: the issue stems from URL-based targeting. Either you aren't on the correct URL (this can be related to the HTTPS or the URL settings), or the condition isn’t met.

18.png

    • Targeting rejected: the targeting conditions, other than the URL, aren't met.

19.png

    • Trigger or Segment rejected: the active page doesn’t meet the Segment condition, this condition is on “false” success status. In the following example, the “device-desktop” condition is not valid.

20.png

    • Missing_data: the reason depends on the website. This can happen on AJAX-coded pages, for instance. 

If the command returns the following errors, AB Tasty is not defined. This means that the AB Tasty Tag is not present on the page. 

21.png

Please check with your technical team about the implementation of the tag on the page.

Step 2: Check events tracking

Once you are sure you are assigned to the campaign, you can check all the events are well set-up and fired. 

To check that your trackings have been deposited correctly in a standard campaign, apply the following steps, here an example for a click tracking on a CTA.

  1. Open your Chrome browser’s JavaScript console and open the page that contains the tracked CTA.
  2. Go to the Network tab.
  3. Check the Preserve log box for the data to be saved if you change pages.
  4. Filter using the ariane.abtasty command.
  5. Via the web page, click the tracked CTA.
  6. Click the most recent Hit.
  7. In the Headers tab, go to the Request Payload section.

Expand the “h” chevron and the following chevrons until you see the name of the CTA and the ID of the related test.
22.png

👍

If click tracking wasn't deposited correctly, the hit related to click tracking will not appear in the console when you click the CTA button. This can be due to a bad choice of selector during click tracking configuration in the Visual Editor.

Other QA actions with the browser console

Check a redirect test

Click tracking works differently in the case of a campaign using the redirect option because the page isn’t displayed in the Visual Editor.

To QA the click trackings of a Redirect campaign, follow the same steps as for a standard campaign.

When you perform checks in the console using the ABTasty.results function, it is normal for targeting to be rejected, as the page displayed is not targeted.

To find out which campaign you are being redirected from, type the ABTasty.redirectedFrom command directly into the console. The campaign name will be displayed.

Check the Social Proof widget

The Social Proof widget enables you to display a message for your visitors, specifying the number of views or purchases for a specific product or page within a pre-set time period.

To collect the number of transactions for a specific product and display it via the Social Proof widget, you must implement the Item Hit and Transaction Tag.

Once the Social Proof widget is implemented and configured on your website though a campaign, you can run the QA process of this campaign. This way, you can ensure that the widget properly displays the number of views or the number of transactions (according to your configuration) for a specific product on the right product page.

For more information on the configuration of the Social Proof widget, refer to the Social Proof widget article.

Check the widget display via the console

To check that the number of views or transactions for a specific product displays correctly, take these steps:

  1. Go to the product page where you implemented the Social Proof widget
  2. Check if the pop-in is displayed on the page:
    If the pop-in is not displayed, it means that the widget is not working properly (the widget has not been saved, the test has not been launched, targeting has not been properly configured, etc.). The following steps are valid only if the pop-in appears on the web page

    If the window.ABTastyProductKey variable has not been previously defined, the following error message is displayed in the console: AB Tasty product key is not defined. This means that the widget cannot be displayed (for the number of transactions only). Refer to the Prerequisites for using the Social Proof widget article for more information.

  3.  Open your browser console
  4. Go to the Network tab
  5. In the search bar, enter Social
  6. Refresh the web page
  7. In the Name tab, click the pv?key= (for page views) or i?key= (for items) key
    23.png
  8. Click the Response tab: you can see the data for each time slot
    24.png
  9. Make sure the data displayed in the console is coherent

👍

To view the data, you can also click the Preview tab.

The Response and Preview tabs display the following information:

  • A part of the URL of the product page where the widget has been configured (for the number of views) and the product SKU (for the number of transactions)
  • The count of pages viewed or transactions by time slot (within the last hour, within the last 3, 7, 12, 24 72, and 168 hours)

If the widget displays and the number of views or transactions matches the data appearing in the console, this means the Social Proof widget is working properly.

For instance, if you want to display the number of views for a specific product within the last 24 hours, you must check that the number displayed in the pop-in is the same as the number that matches the count_24hours line in the console.

If the widget is properly displayed after running the QA process, some issues may remain. For instance, there may be an issue with the collection of product-related transactions.

Was this article helpful?

/