Advanced usage

Now, when you are already familiar with CodeBud basic concepts, you might have noticed that CodeBud is very configurable and can be personalized for many type of tasks.

Of course, this is only yours decision how you're going to use CodeBud. You can use it only for sending complex scenarios, or only for redux state observing. But here is some ideas that you might find interesting.

Integration with already existing tests

For example, you have some project and there are some unit test you've written. How does app tester start this test? It can be done with CodeBud: just wrap your tests with instruction handler, wait for results and return them.

const INSTRUCTIONS: Instruction[] = [
  // ...
  {
    id: "runUnitTests",
    description: "Run our prepared unit tests and the result",
    handler: async () => {
      // Call your tests function and wait for the result
      const result = await runUnitTests();

      // Return result
      return {res: result.ok ? "TESTS PASSED" : "TESTS FAILED"};
    }
  },
];
// ...

Get the most out of the CodeBud

Example of the most complete CodeBud integration with usage of all features (you will most likely never use all features at once, this is just a useful example).

If you are using React or React Native also refer to this page

import { CodeBud, Instruction, InstructionGroup } from '@appklaar/codebud';
import { NetworkInterceptorRN } from '@appklaar/codebud/Network/NetworkInterceptorRN';
import { ReactNativePlugin } from '@appklaar/codebud/rn';
import { getStackTraceSimple } from '@appklaar/codebud/StackTracing/getStackTraceSimple';
import { RootState } from './store/reducers';
import { getUserInstructions, getAppSettingsInstructions, getDogsInstructions, getInfoInstructions, getPublicationsInstructions } from './instructions';
import AsyncStorage from '@react-native-async-storage/async-storage';
// other imports

const INSTRUCTIONS: (Instruction | InstructionGroup)[] = [ /* ... */ ];

// Call the init method.
CodeBud.init("YOUR API KEY HERE", INSTRUCTIONS, {
  mode: CONFIG.RUN_MODE === "DEVELOPMENT" ? "dev" : "prod", // Package mode
  Interceptor: NetworkInterceptorRN, // Any chosen Interceptor for your platform
  ReactNativePlugin: ReactNativePlugin, // If using React Native
  projectInfo: { // If using projects
    projectId: "YOUR PROJECT ID HERE"
  },
  remoteSettingsAutoUpdateInterval: 70000,
  getStackTraceFn: getStackTraceSimple, // Chosen getStackTrace function
  stackTraceOptions: {
    calleeExclude: [
      "?anon_0_", 
      "next", 
      "_next",
      "anonymous",
      "doResolve",
      "Promise",
      "apply",
      "batchedUpdates",
      "batchedUpdates$1",
      "_receiveRootNodeIDEvent",
      "__callFunction",
      "__guard",
      "Unknown",
      "onpacket",
      "__callReactNativeMicrotasks",
      "callReactNativeMicrotasks",
      "_callReactNativeMicrotasksPass"
    ],
    fileNameExclude: [
      "MyFile1.js",
      "MyFile2.tsx"
    ]
  }
});

CodeBud.enableApplicationCrashInterception();

// Check package state (optionaly)
console.log('CodeBud init:', CodeBud.isInit);
console.log('CodeBud state:', CodeBud.state);

function select(state: RootState) {
  return state;
}

// Monitor Redux updates, also you can add action monitor middleware with CodeBud.createReduxActionMonitorMiddleware()
const unsubscribeCodeBudFromStoreChanges = store.subscribe(
  CodeBud.createReduxStoreChangeHandler(store, select),
);

// Monitor Zustand updates
const unsubscribeCodebudFromZustand = zustandStore.subscribe(CodeBud.createZustandStoreChangeHandler(select));

// Monitor TanStack Query updates
const unsubscribeCodebudFromTanStackQueriesDataChanges = CodeBud.monitorTanStackQueriesData(queryClient);
const unsubscribeCodebudFromTanStackQueryEvents = CodeBud.monitorTanStackQueryEvents(queryClient);

// Monitor localStorage events (web only)
CodeBud.enableLocalStorageMonitor(localStorage);
// Monitor AsyncStorage events (RN only)
CodeBud.enableAsyncStorageMonitor(AsyncStorage);

setTimeout(() => {
  CodeBud.captureEvent("Hello, world!", {data: "my data"});
}, 2000);