Noibu is built for developers. Once a Product Manager or eCommerce manager identifies a high-priority revenue-impacting issue, the developer takes over to investigate the issue's root cause and implement a fix. The Noibu console is a playground for developers, but to focus your efforts, we've assembled a list of developer workflows that benefit from the Noibu toolbox, as well as a breakdown of the tools available to developers.
Developer Workflows
Noibu can be a powerful tool in many valuable debugging processes, including:
- Replicating Issues: Use the Noibu toolbox to identify the conditions under which an issue typically occurs, and match these conditions through an emulator. This gives you the best chance of reproducing the issue.
- Recording Replication Sessions: Use Noibu's Sessions table to record issue replication attempts and examine them later. This gives you insight into how the shopper's experience aligns with an issue's appearance in the session timeline.
- Linking Backlog Tickets to Noibu Issues: Work backwards from a known issue ticket on Jira or another task management tool to find a matching issue in Noibu, and sync your debugging efforts on both fronts.
- Cross Referencing Errors on Multiple Domains: Examine how the same issue appears differently across two or more domains due to code changes and regular upkeep.
- Using the Noibu toolbox to investigate and resolve issues
We also recommend developers review Noibu's How-to-Solve learning path to build an efficient workflow for resolving issues.
Tools for Developers
Each issue has a Developer tab that collects resources for developers to investigate and resolve revenue-impacting errors. However, there are resources for developers scattered throughout the Noibu console. We recommend developers build workflows that incorporate as many of the following tools as possible:
- Stacktrace: Peek under the hood to see the line(s) of code that trigger a JavaScript error. Here, you can also generate a human-readable explanation of the problem and its impact, and review a solution inspiration–a code snippet that suggests how the issue might be fixed.
- HTTP Error Details: Review an HTTP error's details, including header, payload, and response information. Having Noibu store payloads and responses eliminates the need for developers to set up “log traps” to smoke out bad data as the root cause of an issue. This simplifies the workflow, allowing a developer to access it in one system instead of having to search across a network of hard drives for the same information.
- Browser & OS Impact: Assess the issue's impact across various browsers, browser versions, operating systems, and operating system versions. With this information, a developer can set up an emulator with the most affected browser and operating system conditions to have the best chance of replicating the issue.
- Insights: Examine key characteristics of the issue to direct your focus during the debugging process. For example, if the Insights section indicates that an issue is occurring at Checkout Only, you know where to start hunting for errors in your code.
- Last Reproduction Steps: Examine the last step shoppers typically encounter before the issue impacts their session. The same error may occur at multiple steps in the customer journey, but through this running count you can identify the step or steps at which the error usually occurred.
- Top URLs: Examine the URLs where an issue has occurred with the highest frequency. An error may occur on multiple URLs, but understanding where errors tend to happen can help pinpoint which parts of the code trigger errors.
- Correlated Issues: Investigate the root cause of an issue by examining issues that occur in parallel. Issues rarely occur in a vacuum, and you can often trace two or more issues back to the same root cause, or gain context for one issue by examining another.
- Session Timeline: Review a session's timeline to see every event captured in the session video, including issue occurrences, HTTP events, page lifecycle events, and web vital scores.
- Source Maps: Upload a source map to help Noibu navigate through minified code and identify the line(s) of source code responsible for a JavaScript error.
- Sessions Table: Investigate issues by watching session recordings. Use Noibu's impressive menu of filters to isolate sessions with specific characteristics.
- NoibuJS SDK: Instruct the Noibu script to track custom attributes–like customer ID, coupon ID, or version ID–to more easily isolate specific sessions. This might help you find session recordings that showcase specific issues or use cases.
Learn how to get the most out of Noibu as a Product Manager, UX Designer, QA Analyst, or Customer Support Rep.