Missing App Functionalities

You may encounter some cases where an app functionality you requested does not work the way you intended. In this situation, you have a variety of ways to rectify the issue and bring parity between the app and what you want to build.

Let’s have a look at some of these ways to troubleshoot missing app functionalities:

1. Be Descriptive and Technical: When it comes to such issues, some technical details go a long way to solving your issues efficiently.

While Emergent can self-diagnose and solve 99% of common errors independently, some issues may need your intervention to avoid wastage of credits. This is the guide that enables you.

2. Utilize Console Debugging Tools: Every browser comes with debugging tools integrated - using this option will increase your chances at a quick issue resolution by a lot. (More on this later.)
3. Take Screenshots, Copy Errors: For errors where a toast notification (In-App Notification in your app preview) pops up with an error message, or a red “Uncaught Runtime Error” shows up, copy the error text and share it with the agent in chat.
   
   This allows the agent to understanding your issues and provide solutions more effectively.

Category A - Missing Functionalities

In some cases, you may observe that a requested functionality has been partially implemented or implemented in a way you wish to change. Let’s look at the most effective prompt template you can use in your own builds:

Effective Prompt Template:

I need to add [FEATURE NAME] functionality:

Current state: [What exists now / What's missing]
Required functionality: [What should happen]
Integration details: [API keys, services, libraries needed]
Expected user flow: [Step by step what user does]

Dependencies: [Any API keys, accounts, or setup I need]

Do note, many of these details will be asked by the agent itself as clarifying questions. All you have to do is refer to your chat and consult the prior messages.

Category B - Unexpected Errors or Bugs

Bugs and Unexpected Errors are a part of coding and may come up from time to time. (Although the frequency of this on Emergent is lesser than when manual coding.)

Here is the right way to approach fixing these errors:

Effective Prompt Template:

testIssue: [Brief description of what's broken]
Location: [Where the issue occurs - file, component, API endpoint]

Expected behavior: [What should happen]
Current behavior: [What actually happens]

Error message: [Exact error from console/logs, bring that up by clicking
fn + F12]
Browser console errors: [Any frontend errors]
Backend logs: [Any backend errors]

Steps to reproduce:
1. [First step]
2. [Second step]
3. [Error occurs]

What I've tried: [If anything - optional; mention the previous step 
before it breaks if possible too!]

Okay, this one’s a loaded prompt. Let’s break this up into simple to understand sections.

1. Test Issue and Location: What functionality is broken? Which part of your app is breaking?
2. Expected/Current Behaviour: What did you think would happen - and what actually happens?
3. Error Messages: This information is visible in the browser debug tool. You can open this pane by right-clicking the screen and clicking Inspect; or just press Fn + F12.
   
   Once you’ve opened that, you’ll see the code that makes the frontend tick. What we need to see is the Console tab and the Network Tab. (Here’s a video to help you locate these)
4. Steps to Reproduce: This explains the steps you took before reaching the error in question. What buttons did you click? What active links did you click? This will help Emergent zero in on the issue.

Category C - Third - Party Integrations

As you get more comfortable building on Emergent, you will likely take on more ambitious projects that use third party APIs or other integrations that need careful setups.

Emergent guides you while setting up these integrations, but If you run into any issues mid - build or otherwise, here’s a good troubleshooting prompt you can use:

Effective Prompt Template:

I need to integrate [SERVICE NAME]:

Purpose: [What this integration does]
Documentation: [Link to docs if you have it - optional]
API Keys: [Do you have them or need guidance?]

Specific requirements:
- [Requirement 1]
- [Requirement 2]
- [Requirement 3]

Let’s clarify this prompt with a handy example: Setting up an email service

Here’s the prompt as you’d share it with the agent:

I need to integrate email sending with SendGrid:

Purpose: Send transactional emails (welcome, password reset, notifications)
API Keys: I don't have SendGrid keys yet - need guidance on setup

Specific requirements:
- Welcome email when user signs up
- Password reset emails
- Email templates with HTML styling
- Test mode for development

Please call integration_playbook_expert for SendGrid setup guidance.