Skip to content

[BUG] Function getHiddenSelectedCountryWidth fails to calculate the correct offset width. #1935

@TheBlackSwannn

Description

@TheBlackSwannn

Plugin Version

v25.2.1

Steps to Reproduce

  1. Initialize the plugin with separateDialCode enabled.
  2. Place the input field within a hidden container or an iframe during initialization.
  3. Observe that the _getHiddenSelectedCountryWidth function fails to calculate the correct offset width.

Expected Behavior

The _getHiddenSelectedCountryWidth function should correctly calculate the offsetWidth of the selectedCountry element, even when the input is within a hidden container or iframe during initialization.

Actual Behavior

The _getHiddenSelectedCountryWidth function fails when the input is within an iframe or hidden container. This is likely because the document.body.appendChild(containerClone) operation does not correctly account for the DOM context, causing the width calculation to return incorrect or zero values.

Proposed Solution

The issue can be resolved by ensuring that the operation to append the containerClone occurs in the correct DOM context. For example, using window.top.document.body.appendChild(containerClone) ensures that the correct body element is targeted, even within an iframe.

See PR: #1934

Additional Notes

  • The issue seems to stem from the fact that document.body might not be accessible or correctly referenced when the input is within an iframe.
  • The proposed solution ensures that the correct DOM context is used for appending the containerClone.
  • I am not totally sure about the potential sideffects it may cause for other environments such as Vue or React.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions