Configure User Feedback

⚙️ Configure User Feedback

👀 Overview

Configure GermainUX User Feedback to collect feedback directly from users while they interact with monitored web and native Windows applications.

Depending on the application, User Feedback can be deployed using:

Feedback can be associated with available user, application, session, activity, error, performance, and Session Replay context, helping teams connect:

What the user said + What the user experienced

This page covers deployment, configuration, advanced configuration, validation, API integration, troubleshooting, security, and privacy.

📋 Before You Begin

Before configuring User Feedback:

📌 Choose a Deployment Method

Select the RUM component appropriate for the monitored application.

Only one RUM deployment method is normally required for a given application.

🚀 Deploy User Feedback

🌐 RUM JS

Use GermainUX RUM JS when the monitoring script can be deployed directly into the monitored web application.

The deployment process is:

🔧 RUM Extension

Use GermainUX RUM Extension when the required monitoring script cannot be deployed directly into the application's required execution context or when browser-extension deployment is preferred.

For example, some SaaS applications may require extension-based monitoring to provide the required browser context.

The deployment process is:

🖥️ RUM Windows

Use GermainUX RUM Windows to collect User Feedback from monitored native Windows applications.

The deployment process is:

💬 Configure the User Feedback Popup

For RUM JS, the Feedback Popup is configured in the applicable Monitoring Profile's Init Script.

The popup is disabled by default and must be enabled for each applicable Monitoring Profile.

✅ Enable the Popup

Set settings.plugins.feedback.enabled to true.

const settings = germainApm.getDefaultSettings(loaderArgs, agentConfig);

settings.plugins.feedback.enabled = true;

germainApm.start(settings);

This enables the Feedback Popup using its default settings.

⛔ Disable the Popup

No configuration is required to keep the popup disabled because enabled defaults to false.

To disable it explicitly:

const settings = germainApm.getDefaultSettings(loaderArgs, agentConfig);

settings.plugins.feedback.enabled = false;

germainApm.start(settings);

🎨 Customize the Feedback Popup

The popup's appearance, labels, position, buttons, and comment form can be customized.

The following example enables User Feedback and customizes the positive and negative buttons, labels, colors, comment form, and screen position:

const settings = germainApm.getDefaultSettings(loaderArgs, agentConfig);

settings.plugins.feedback = {
    enabled: true,
    positive: {
        icon: 'data:image/jpeg;base64,...',
        label: 'I like this page',
        backgroundColor: 'green'
    },
    negative: {
        icon: 'data:image/jpeg;base64,...',
        label: 'This page contains an error',
        backgroundColor: 'red'
    },
    position: 'bottom-right',
    comment: {
        position: 'right',
        commentHint: 'Tell us more',
        emailHint: 'Email',
        sendHint: 'Send'
    }
};

germainApm.start(settings);

📚 Advanced Configuration Reference

The settings.plugins.feedback object provides detailed control over the RUM JS Feedback Popup.

📜 FeedbackSettings

type FeedbackSettings = {
    /** Enable the feedback buttons. Default: false. */
    enabled?: boolean;

    /** Positive-feedback button settings. */
    positive?: FeedbackButton;

    /** Negative-feedback button settings. */
    negative?: FeedbackButton;

    /** Popup position. Default: 'bottom-left'. */
    position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';

    /** Comment-form settings. */
    comment?: {
        /** Position relative to the feedback buttons. Default: 'right'. */
        position?: 'left' | 'right';

        /** Comment placeholder. Default: 'Tell us more'. */
        commentHint?: string;

        /** Email placeholder. Default: 'Email'. */
        emailHint?: string;

        /** Submit-button label. Default: 'Send'. */
        sendHint?: string;

        /** Additional styles applied to the comment-form elements. */
        styles?: Record<
            'container' | 'email' | 'comment' | 'send' | 'close',
            Record<string, string>
        >;
    };
};

ℹ️ FeedbackSettings Properties

📍 FeedbackButton

type FeedbackButton = {
    /** Image supplied as a data URI. */
    icon?: string;

    /** Button title displayed on hover. */
    label?: string;

    /** Button background color. */
    backgroundColor?: string;

    /** Parent element receiving the button. Default: document.body. */
    parentSelector?: string;

    /** Additional styles applied to the button. */
    styles?: Record<string, string>;
};

ℹ️ FeedbackButton Properties

Default button settings include the GermainUX thumbs-up and thumbs-down icons, standard accessible labels, and default positive and negative colors.

📌 Popup Position

The position property determines where the Feedback Popup appears.

Supported values:

Default:

position: 'bottom-left'

Choose a position that does not interfere with application navigation, chat widgets, accessibility controls, or other interactive elements.

📝 Comment Configuration

The comment object controls the form used to collect additional feedback.

🖌️ Comment Styles

Custom styles can be applied to:

For example:

comment: {
    position: 'right',
    commentHint: 'Tell us about your experience',
    emailHint: 'Email',
    sendHint: 'Submit'
}

Use custom styling when the Feedback Popup needs to align with the visual design of the monitored application.

⚓ Parent Element

By default, feedback buttons are added to:

document.body

Use parentSelector when the feedback control needs to be attached to another element.

For example:

positive: {
    parentSelector: '#application-container'
}

When using a custom parent element, verify that:

🔍 Validate the Deployment

Perform a controlled test before broad rollout.

📊 Validate Feedback KPIs & Measures

Feedback submitted through the User Feedback Popup is captured by the preconfigured User Feedback KPI.

The User Session Replay KPI also provides session-level feedback measures:

Use these measures to verify the configuration and identify sessions containing feedback.

🔗 API Integration

GermainUX APIs can process feedback submitted through the User Feedback Popup and use it within custom analytics and automation workflows.

API-based processing can be used to:

For example:

Negative Feedback → Process Feedback → Analyze User & Session Context → Prioritize → Trigger Follow-Up

This allows feedback to become an operational signal rather than simply a response stored for later review.

🤖 Automate Actions from Feedback

Feedback can be incorporated into workflows that:

The exact workflow can be customized according to the organization's requirements.

⚙️ User Monitoring and Session Replay APIs

Use the User Monitoring and Session Replay APIs for applicable API operations involving User Feedback and its associated monitoring context.

Refer to the User Monitoring and Session Replay API documentation for available API operations.

📊 Analyze Submitted Feedback

After deployment, submitted feedback can be investigated using GermainUX Analytics.

💬 Configure the User Feedback Popup

For RUM JS, the Feedback Popup is configured in the applicable Monitoring Profile's Init Script.

The popup is disabled by default and must be enabled for each applicable Monitoring Profile.

✅ Enable the Popup

Set settings.plugins.feedback.enabled to true.

const settings = germainApm.getDefaultSettings(loaderArgs, agentConfig);

settings.plugins.feedback.enabled = true;

germainApm.start(settings);

This enables the Feedback Popup using its default settings.

⛔ Disable the Popup

No configuration is required to keep the popup disabled because enabled defaults to false.

To disable it explicitly:

const settings = germainApm.getDefaultSettings(loaderArgs, agentConfig);

settings.plugins.feedback.enabled = false;

germainApm.start(settings);

🎨 Customize the Feedback Popup

The popup's appearance, labels, position, buttons, and comment form can be customized.

The following example enables User Feedback and customizes the positive and negative buttons, labels, colors, comment form, and screen position:

const settings = germainApm.getDefaultSettings(loaderArgs, agentConfig);

settings.plugins.feedback = {
    enabled: true,
    positive: {
        icon: 'data:image/jpeg;base64,...',
        label: 'I like this page',
        backgroundColor: 'green'
    },
    negative: {
        icon: 'data:image/jpeg;base64,...',
        label: 'This page contains an error',
        backgroundColor: 'red'
    },
    position: 'bottom-right',
    comment: {
        position: 'right',
        commentHint: 'Tell us more',
        emailHint: 'Email',
        sendHint: 'Send'
    }
};

germainApm.start(settings);

📚 Advanced Configuration Reference

The settings.plugins.feedback object provides detailed control over the RUM JS Feedback Popup.

📜 FeedbackSettings

type FeedbackSettings = {
    /** Enable the feedback buttons. Default: false. */
    enabled?: boolean;

    /** Positive-feedback button settings. */
    positive?: FeedbackButton;

    /** Negative-feedback button settings. */
    negative?: FeedbackButton;

    /** Popup position. Default: 'bottom-left'. */
    position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';

    /** Comment-form settings. */
    comment?: {
        /** Position relative to the feedback buttons. Default: 'right'. */
        position?: 'left' | 'right';

        /** Comment placeholder. Default: 'Tell us more'. */
        commentHint?: string;

        /** Email placeholder. Default: 'Email'. */
        emailHint?: string;

        /** Submit-button label. Default: 'Send'. */
        sendHint?: string;

        /** Additional styles applied to the comment-form elements. */
        styles?: Record<
            'container' | 'email' | 'comment' | 'send' | 'close',
            Record<string, string>
        >;
    };
};

ℹ️ FeedbackSettings Properties

📍 FeedbackButton

type FeedbackButton = {
    /** Image supplied as a data URI. */
    icon?: string;

    /** Button title displayed on hover. */
    label?: string;

    /** Button background color. */
    backgroundColor?: string;

    /** Parent element receiving the button. Default: document.body. */
    parentSelector?: string;

    /** Additional styles applied to the button. */
    styles?: Record<string, string>;
};

ℹ️ FeedbackButton Properties

Default button settings include the GermainUX thumbs-up and thumbs-down icons, standard accessible labels, and default positive and negative colors.

📌 Popup Position

The position property determines where the Feedback Popup appears.

Supported values:

• ata.

• The correct application and environment are being analyzed.

• The selected time range includes the test feedback.

• The feedback is associated with the expected monitored session.

Session Replay Is Not Available

Verify that:

• Session Replay is enabled.

• The application and user are included in the Session Replay configuration.

• The session occurred within the selected time range.

• Privacy or exclusion settings did not prevent the expected data from being captured.

Security & Privacy

Feedback comments and Session Replay may contain personal or sensitive information.

Before production rollout:

• Configure appropriate masking and exclusion rules.

• Limit access to authorized roles.

• Confirm applicable consent requirements.

• Avoid collecting unnecessary personal information.

• Apply appropriate data-retention policies.

• Protect API credentials and integrations.

• Limit sensitive information sent through alerts or external systems.

• Test feedback alerts and integrations to ensure they do not expose sensitive content.

If an email address or other identifying information is collected, verify that it is necessary for the intended feedback workflow and handled according to your organization's privacy requirements.

Related Documentation

User Feedback

GermainUX RUM JS

GermainUX RUM Extension

GermainUX RUM Windows

User Session Monitoring & Replay

Analytics

Automation

Data Retention

ℹ️ Get Help

The Germain Team can help you set this up. Contact GermainUX Support.