@embrace-io/web-sdk
Version:
64 lines (63 loc) • 2.34 kB
JavaScript
import { KEY_EMB_TYPE } from "../../../constants/attributes.js";
import { EmbraceInstrumentationBase } from "../../EmbraceInstrumentationBase/EmbraceInstrumentationBase.js";
import { ATTR_MAX_SCROLL_DEPTH_DID_SCROLL, ATTR_MAX_SCROLL_DEPTH_DOCUMENT_HEIGHT, ATTR_MAX_SCROLL_DEPTH_PERCENT, ATTR_MAX_SCROLL_DEPTH_PIXELS, MAX_SCROLL_DEPTH_EVENT_NAME } from "./constants.js";
import { SeverityNumber } from "@opentelemetry/api-logs";
//#region src/instrumentations/max-scroll-depth/MaxScrollDepthInstrumentation/MaxScrollDepthInstrumentation.ts
var MaxScrollDepthInstrumentation = class extends EmbraceInstrumentationBase {
_onScrollHandler;
_hasScrolled = false;
_maxScrollY = 0;
constructor({ diag, perf } = {}) {
super({
instrumentationName: "MaxScrollDepthInstrumentation",
instrumentationVersion: "1.0.0",
diag,
perf,
config: {}
});
this._onScrollHandler = () => {
try {
const scrollY = window.scrollY;
if (scrollY > this._maxScrollY) this._maxScrollY = scrollY;
this._hasScrolled = true;
} catch (e) {
this._diag.error("failed to process scroll", e);
}
};
if (this._config.enabled) this.enable();
}
onEnable() {
window.addEventListener("scroll", this._onScrollHandler, { passive: true });
this.setSessionPartListeners({ end: () => {
try {
this._emit();
} catch (e) {
this._diag.error("failed to emit max-scroll-depth log", e);
}
} });
}
onDisable() {
window.removeEventListener("scroll", this._onScrollHandler);
}
_emit() {
const documentHeight = document.documentElement.scrollHeight;
const scrollBottom = documentHeight - window.innerHeight;
const scrollPercent = scrollBottom > 0 ? Math.min(100, Math.max(0, Math.round(this._maxScrollY / scrollBottom * 100))) : 0;
this.logger.emit({
eventName: MAX_SCROLL_DEPTH_EVENT_NAME,
severityNumber: SeverityNumber.INFO,
attributes: {
[KEY_EMB_TYPE]: "emb.otel_log",
[ATTR_MAX_SCROLL_DEPTH_PIXELS]: this._maxScrollY,
[ATTR_MAX_SCROLL_DEPTH_PERCENT]: scrollPercent,
[ATTR_MAX_SCROLL_DEPTH_DID_SCROLL]: this._hasScrolled,
[ATTR_MAX_SCROLL_DEPTH_DOCUMENT_HEIGHT]: documentHeight
}
});
this._hasScrolled = false;
this._maxScrollY = window.scrollY;
}
};
//#endregion
export { MaxScrollDepthInstrumentation };
//# sourceMappingURL=MaxScrollDepthInstrumentation.js.map