Add Logs to the JavaScript SDK #15526
Assignees
Labels
Comments
AbhiPrasad
added a commit
that referenced
this issue
Feb 28, 2025
ref #15526 Based on the work in #15442, we add definitions for the logs protocol and envelope to the JavaScript SDKs. Relay data category: https://github.com/getsentry/relay/blob/e36886a98c89af645e5c0d2109657deafa25d902/relay-server/src/envelope.rs#L182 Relay log protocol: https://github.com/getsentry/relay/blob/ad04adf6d6756c4e36328c8217bea0ee01f289ec/relay-event-schema/src/protocol/ourlog.rs#L12
|
After chatting with the team, we decided to go for an approach that does not add a new method to the client. This saves on bundle size, but does add some complexity around how internals and managed and exposed. You can see both attempts here:
Pros and cons:
|
This was referenced Mar 18, 2025
AbhiPrasad
added a commit
that referenced
this issue
Mar 21, 2025
ref #15526 Continuing off the work from #15717, this PR adds the logging public API to the Browser SDK. It also adds a basic flushing strategy to the SDK that is timeout based. This is done to help save bundle size. The main file added was `log.ts`. This has three areas to look at: 1. The logger methods for `trace`, `debug`, `info`, `warn`, `error`, `fatal` (the log severity levels) as well as an internal capture log helper all these methods call. 2. `addFlushingListeners` which adds listeners to flush the logs buffer on client flush and document visibility hidden. 3. a flush timeout that flushes logs after X seconds, which gets restarted when new logs are captured. I also removed any logs logic from the `BrowserClient`, which should ensure this stays as bundle size efficient as possible. Usage: ```js import * as Sentry from "@sentry/browser"; Sentry.init({ dsn: "your-dsn-here", _experiments: { enableLogs: true // This is required to use the logging features } }); // Trace level (lowest severity) Sentry.logger.trace("This is a trace message", { userId: 123 }); // Debug level Sentry.logger.debug("This is a debug message", { component: "UserProfile" }); // Info level Sentry.logger.info("User logged in successfully", { userId: 123 }); // Warning level Sentry.logger.warn("API response was slow", { responseTime: 2500 }); // Error level Sentry.logger.error("Failed to load user data", { userId: 123, errorCode: 404 }); // Critical level Sentry.logger.critical("Database connection failed", { dbHost: "primary-db" }); // Fatal level (highest severity) Sentry.logger.fatal("Application is shutting down unexpectedly", { memory: "exhausted" }); ```
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
In #15442 we created an experimental logging API to test out the new logging product.
Based on the experimental API, we devised unified public API we'd like all SDKs to implement: https://www.notion.so/sentry/Logs-in-the-SDK-1a48b10e4b5d80b1827fe14d9fd0236b#1a48b10e4b5d80a782a9efc6fd463acf
This task looks at implementing this logging API in the JavaScript SDKs
captureLogmethod #15717beforeSendLogoption and functionalityThe text was updated successfully, but these errors were encountered: