Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Jul 29, 2025

This PR implements basic HTMLIframeElement support in JSAR Runtime, enabling developers to create and use <iframe> elements structurally within JSAR applications without embedded content functionality.

What's Implemented

  • Element Creation: Support for document.createElement('iframe')
  • DOM Integration: Iframe elements can be appended to the DOM tree and queried using standard DOM APIs
  • Attribute Support: Standard iframe attributes (src, width, height, etc.) can be set and retrieved
  • CSS Styling: Iframe elements inherit full styling capabilities from HTMLElement with block-level display

Usage Examples

// Create iframe programmatically
const iframe = document.createElement('iframe');
iframe.src = 'about:blank';
iframe.width = '300';
iframe.height = '200';
document.body.appendChild(iframe);

// Query iframe elements
const iframes = document.querySelectorAll('iframe');
const myIframe = document.getElementById('iframe-id');
<!-- Use iframe in HTML -->
<iframe src="about:blank" width="400" height="300"></iframe>

Implementation Details

The implementation follows the established pattern used by other HTML elements in JSAR:

  • C++ Classes: HTMLIframeElement inherits from HTMLElement providing core functionality
  • JavaScript Bindings: Exposes HTMLIFrameElement constructor to JavaScript environment
  • Registration: Added to TYPED_ELEMENT_MAP for automatic element factory creation
  • Browser Compatibility: Added to browser compatibility data at docs/api/browser-compat-data/html/elements/iframe.json

Intentional Limitations

As specified in the requirements, this implementation provides structural support only:

  • ❌ Content loading from src URLs
  • ❌ iframe content rendering
  • ❌ Sandboxing and security isolation
  • ❌ Cross-origin restrictions

Iframe elements are treated as regular DOM elements that can be created, styled, and positioned, but do not load or display any content.

Fixes #157.


💬 Share your feedback on Copilot coding agent for the chance to win a $200 gift card! Click here to start the survey.

Copilot AI and others added 3 commits July 29, 2025 14:18
Co-authored-by: yorkie <1935767+yorkie@users.noreply.github.com>
Co-authored-by: yorkie <1935767+yorkie@users.noreply.github.com>
Co-authored-by: yorkie <1935767+yorkie@users.noreply.github.com>
Copilot AI changed the title [WIP] Support for HTMLIframeElement creation Add basic HTMLIframeElement support for DOM creation and recognition Jul 29, 2025
Copilot AI requested a review from yorkie July 29, 2025 14:30
yarn.lock Outdated
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please remove this lock file.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed yarn.lock file as requested. 411ddef

{
void HTMLIframeElement::createdCallback(bool from_scripting)
{
defaultStyle_.setProperty("display", "inline-block");
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

iframe's display should be block.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changed iframe display style from "inline-block" to "block" as requested. 411ddef

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No need to test iframe element, please remove this file.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed fixtures/html/iframe-test.html file as requested. 411ddef

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Remove this file.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed docs/HTMLIframeElement.md file as requested. 411ddef

Copy link
Member

@yorkie yorkie left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

:)

Copy link
Member

@yorkie yorkie left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot Please update the docs.

Copy link
Member

@yorkie yorkie left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot Update again

… add browser compat data

Co-authored-by: yorkie <1935767+yorkie@users.noreply.github.com>
Copy link
Contributor Author

Copilot AI commented Jul 29, 2025

@copilot Please update the docs.

Updated documentation by adding browser compatibility data for iframe element at docs/api/browser-compat-data/html/elements/iframe.json. 411ddef

@copilot Update again

Documentation updated with browser compatibility data for iframe element support. 411ddef

Copilot AI requested a review from yorkie July 29, 2025 19:37
@yorkie yorkie marked this pull request as ready for review July 30, 2025 04:41
@yorkie yorkie merged commit a60ffb5 into main Jul 30, 2025
2 checks passed
@yorkie yorkie deleted the copilot/fix-157 branch July 30, 2025 04:42
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.

Support for HTMLIframeElement creation

2 participants