Skip to content

Conversation

@ValerasNarbutas
Copy link
Contributor

Summary

This PR introduces a new sample: Tenant Telemetry Application Customizer.
The solution provides a lightweight tenant-wide telemetry framework for SPFx solutions, enabling modern monitoring of component usage, page context, versions, and custom events across SharePoint Online.

The Application Customizer listens for browser CustomEvent-based telemetry messages and forwards them—based on configuration—to either Azure Application Insights or a custom Azure Function endpoint.

Key Features

  • Tenant-wide Application Customizer for telemetry collection

  • TelemetryService supporting two modes:

    • appinsights — direct ingestion via Application Insights Connection String

    • function — POST telemetry to an Azure Function

  • Simple integration from web parts via:

    window.dispatchEvent(new CustomEvent("spfx-telemetry", { detail: { ... } }));
    
  • Automatic enrichment with:

    • Site URL

    • Page URL

    • Component ID, name, version

  • Works across all modern SharePoint sites without modifying existing web parts

  • Configurable at runtime using Tenant Wide Extensions

  • Includes full TypeScript, localization, and manifest configuration

  • Suitable for analytics, usage tracking, component adoption, and operational telemetry


What's in this Pull Request?

  • Added package.json with required dependencies and build scripts

  • Added ClientSideInstance.xml and elements.xml for SharePoint integration

  • Implemented TelemetryService (App Insights + Azure Function support)

  • Implemented TenantTelemetryApplicationCustomizer to initialize telemetry and listen globally for telemetry events

  • Included localization support (en-us.js, myStrings.d.ts)

  • Configured TypeScript with project-appropriate settings (tsconfig.json)

  • Added README documentation, sample usage instructions, and console testing steps

  • Included preview image and PnP sample metadata


PR Metadata

Q A
Bug fix? no
New feature? no
New sample? yes
Related issues? #1546

Additional Notes

This sample demonstrates a scalable pattern for enterprise-grade telemetry collection across thousands of SharePoint Online sites. It enables administrators and developers to understand adoption, diagnose issues, and build richer insights without modifying each web part.


- Created package.json for the React application with necessary dependencies and scripts.
- Added ClientSideInstance.xml and elements.xml for SharePoint integration.
- Implemented TelemetryService for handling telemetry events and sending data to Application Insights or Azure Functions.
- Developed TenantTelemetryApplicationCustomizer to initialize telemetry and listen for telemetry events from web parts.
- Included localization support with en-us.js and myStrings.d.ts.
- Configured TypeScript settings in tsconfig.json for the project.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant