Creating Custom Chrome Extensions with Chat GPT & QuickBooks Online
During this video I team up with @HectorGarciaCPA to record a video walking you through the process of creating your own Chrome Extensions with ChatGPT and QuickBooks Online.
We start off showing you the end result and then go through step by step sharing the different prompts we wrote to build out the necessary files and even troubleshoot along the way. The prompts are summarized below with timestamps.
Step by Step Chapter List:
0:00 - Introduction
1:00 - My QuickBooks Online Reconciliation Widget
Let's Get Started Creating:
2:50 - Intro to Video with Hector Garcia (Thank You Hector!)
4:00 - We explain what we are trying to build
Prompt 1:
4:50 - Using ChatGPT4 and telling it we want a Chrome Extension
5:30 - Run a manual test to capture the correct URL
Prompt 2:
6:30 - Script to teach it how to search and replace a number within the URL
8:30 - Inspecting Page and using the Console to search for errors
Prompt 3:
9:15 - Ask ChatGPT to explain the error and how to fix it.
Prompt 4:
10:40 - Can you ask me for the amount first?
This now gives us a popup window that asks you for the specific amount.
Prompt 5:
12:00 - I want a context right click menu option to trigger my search
We ask it to build it as a chrome extension so it will build all the files that we need to compile it and load it on the computer.
12:45 - Reviewing the code it suggested and creating the files using Visual Studio Code. We walk through the steps how to create and save them in a specific folder.
16:00 - Load your new extension and refresh your webpage before testing everything.
We also start troubleshooting the extension
Prompt 6:
18:00 - Can you check if the comma caused an issue? Can you fix the code for us please?
Now we have to update our bad code with the corrected code. Finally you need to update the extension in Chrome before testing again.
EVERYTHING WORKS!
Next we decide to expand the functionality and ask it to search for all remaining numbers left on the page
Prompt 7:
20:00 - Now find each amount on the page and open each on a separate tab. We also inspect the page to find the elements we need to provide.
Prompt 8:
25:45 - What happened to background.js file? Can you give me that code again?
Prompt 9:
26:45 - Chrome gave me the following error "Could not load manifest" This was because we need to provide it the root URL for it to work correctly
Prompt 10:
29:30 - We need a way to trigger the extension. We want a right click context menu option called "..."
Prompt 11:
34:15 - Can you please provide me a debug log to help me find errors
We continue to have issues and
Prompt 12:
36:15 - The new tabs are not being created. Let's do something else. Give me a popup with all of the amounts that you found and then an "OK"/"Cancel" button to trigger opening the new tabs.
Prompt 13:
The popup window showed amounts, but it also showed blanks. We only want the amounts, filter out the blanks.
Prompt 14:
41:50 - The URL looked like this... but it should look like this ...
Prompt 15:
43:55 - Can you add checkboxes to the popup so I can select the ones that I want to review.
Prompt 16:
45:00 - The popup worked but it did not do anything.
Prompt 17:
46:55 - The URL got messed up again.
In this update we had to just revise a portion of the code
48:50 - EVERYTHING WORKS PERFECTLY!!
If you are looking for more support beyond this video, here are a couple ways to connect with us:
________________________
QB Community FB Group: / qbcommunitylive
Book 1-on-1 time with me: https://parkway.business/
Need to buy QuickBooks Online Payroll: https://pxlme.me/buypayroll
Looking for Time Tracking Solution: https://pxlme.me/qbtime
Want to Try QuickBooks Online - Use this link: https://pxlme.me/buyqbo
Important Disclaimer:
This content is for information purposes only and should not be considered legal, accounting or tax advice, or a substitute for obtaining such advice specific to your business. Additional information and exceptions may apply. Applicable laws may vary by state or locality. No assurance is given that the information is comprehensive in its coverage or that it is suitable in dealing with a customer’s particular situation. Parkway.Business Inc does not have any responsibility for updating or revising any information presented herein. Accordingly, the information provided should not be relied upon as a substitute for independent research. Parkway.Business Inc. does not warrant that the material contained herein will continue to be accurate, nor that it is completely free of errors when published. Readers and viewers should verify statements before relying on them.