Allow option update

e2e/tests/shared/parent-methods.js

@@ -50,6 +50,29 @@ export function parentMethodTests(baseUrl, { hasDisconnect = true } = {}) {
     )
   })
 
+  test('connectResizer re-binding sends update without breaking the iframe', async ({
+    page,
+  }) => {
+    await page.goto(baseUrl)
+    await page.waitForLoadState('networkidle')
+    await waitForResizer(page)
+
+    // Skip frameworks that don't expose the imperative factory globally.
+    const hasFactory = await page.evaluate(
+      () => typeof window.iframeResize === 'function',
+    )
+    test.skip(!hasFactory, 'iframeResize factory not exposed globally')
+
+    // Re-bind with new options on an already-connected iframe.
+    // The update flow should fire (no throw) and iframeResizer stays attached.
+    const result = await page.evaluate(() => {
+      const iframe = document.querySelector('iframe')
+      window.iframeResize({ license: 'GPLv3', log: true }, iframe)
+      return iframe.iframeResizer ? 'attached' : 'detached'
+    })
+    expect(result).toBe('attached')
+  })
+
   if (hasDisconnect) {
     test('disconnect removes iframeResizer from iframe', async ({ page }) => {
       await page.goto(baseUrl)

packages/angular/directive.test.ts

@@ -338,11 +338,11 @@ describe('Angular IframeResizerDirective', () => {
     directive.ngAfterViewInit()
 
     expect(mockGroupExpand).toHaveBeenCalledTimes(1)
-    expect(mockGroupExpand).toHaveBeenCalledWith(undefined)
+    expect(mockGroupExpand).toHaveBeenCalledWith(false)
   })
 
-  test('expand passes logExpand option when set', () => {
-    directive.options = { license: 'TEST', logExpand: true }
+  test('expand is true when log option is "expanded"', () => {
+    directive.options = { license: 'TEST', log: 'expanded' }
     directive.ngAfterViewInit()
 
     expect(mockGroupExpand).toHaveBeenCalledWith(true)

packages/angular/directive.ts

@@ -8,8 +8,10 @@
   EventEmitter,
   Input,
   Output,
+  type SimpleChanges,
 } from '@angular/core'
 import { esModuleInterop } from '@iframe-resizer/common'
+import { EXPAND, LOG_EXPANDED } from '@iframe-resizer/common/consts'
 import type {
   IFrameComponent,
   IFrameMessageData,
@@ -55,25 +57,19 @@
     return this.resizer
   }
 
-  @Input() options: IFrameOptions & { logExpand?: boolean } = {
+  @Input() options: IFrameOptions = {
     license: '',
   }
 
   @Input() debug: boolean = false
 
   constructor(private elementRef: ElementRef) {}
 
-  ngAfterViewInit(): void {
-    const id = this.elementRef.nativeElement?.id
-
-    this.consoleGroup.label(`angular(${id})`)
-    this.consoleGroup.event('setup')
-    this.consoleGroup.expand(this.options.logExpand)
-
-    if (this.debug) this.consoleGroup.log('ngAfterViewInit')
-
-    this.resizer = connectResizer({
-      ...this.options,
+  private buildOptions(): IFrameOptions {
+    const { logExpand: _logExpand, ...options } = this.options as IFrameOptions &
+      Record<string, unknown>
+    return {
+      ...options,
 
       onBeforeClose: () => {
         this.consoleGroup.event('close')
@@ -98,7 +94,32 @@
         top: number
         left: number
       }) => this.onScroll.next(event),
-    })(this.elementRef.nativeElement)
+    } as IFrameOptions
+  }
+
+  ngAfterViewInit(): void {
+    const id = this.elementRef.nativeElement?.id
+
+    this.consoleGroup.label(`angular(${id})`)
+    this.consoleGroup.event('setup')
+    this.consoleGroup.expand(
+      this.options.log === EXPAND || this.options.log === LOG_EXPANDED,
+    )
+
+    if (this.debug) this.consoleGroup.log('ngAfterViewInit')
+
+    this.resizer = connectResizer(this.buildOptions())(
+      this.elementRef.nativeElement,
+    )
+  }
+
+  ngOnChanges(changes: SimpleChanges): void {
+    // Re-bind when @Input options change. Skip the first call: the binding
+    // hasn't been established yet at that point — ngAfterViewInit handles it.
+    if (!this.resizer) return
+    if (!changes.options) return
+    if (this.debug) this.consoleGroup.log('ngOnChanges: options updated')
+    connectResizer(this.buildOptions())(this.elementRef.nativeElement)
   }
 
   ngOnDestroy(): void {

packages/child/events/mouse.test.ts

@@ -1,13 +1,15 @@
 import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest'
 
 import sendMessage from '../send/message'
+import settings from '../values/settings'
 import setupMouseEvents from './mouse'
 
 vi.mock('../send/message', () => ({ default: vi.fn() }))
 
 describe('child/events/mouse', () => {
   let addSpy
   beforeEach(() => {
+    settings.mouseEvents = true
     addSpy = vi.spyOn(document, 'addEventListener')
   })
 
@@ -37,4 +39,14 @@ describe('child/events/mouse', () => {
     expect(sendMessage).toHaveBeenCalledWith(0, 0, 'mouseenter', '10:20')
     expect(sendMessage).toHaveBeenCalledWith(0, 0, 'mouseleave', '30:40')
   })
+
+  test('does not forward events when settings.mouseEvents is false', () => {
+    setupMouseEvents({ mouseEvents: true })
+
+    settings.mouseEvents = false
+    const [, fn1] = addSpy.mock.calls[0].slice(0, 2)
+    fn1({ type: 'mouseenter', screenY: 10, screenX: 20 })
+
+    expect(sendMessage).not.toHaveBeenCalled()
+  })
 })

packages/child/events/mouse.ts

@@ -3,10 +3,13 @@ import { HIGHLIGHT } from 'auto-console-group'
 
 import { log } from '../console'
 import sendMessage from '../send/message'
+import settings from '../values/settings'
 import { addEventListener } from './listeners'
 
-const sendMouse = (evt: MouseEvent): void =>
+const sendMouse = (evt: MouseEvent): void => {
+  if (settings.mouseEvents !== true) return
   sendMessage(0, 0, evt.type, `${evt.screenY}:${evt.screenX}`)
+}
 
 function addMouseListener(evt: string, name: string): void {
   log(`Add event listener: %c${name}`, HIGHLIGHT)

packages/child/methods/move-to-anchor.test.ts

@@ -1,30 +1,26 @@
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
-vi.mock('../console', () => ({ advise: vi.fn() }))
-
-const { advise } = await import('../console')
 const state = (await import('../values/state')).default
 const moveToAnchor = (await import('./move-to-anchor')).default
 
 describe('child/methods/move-to-anchor', () => {
   beforeEach(() => {
     vi.restoreAllMocks()
-    state.inPageLinks = { findTarget: vi.fn() }
+    state.findInPageLinkTarget = vi.fn()
   })
 
   it('calls findTarget with the provided anchor', () => {
     moveToAnchor('section-1')
-    expect(state.inPageLinks.findTarget).toHaveBeenCalledWith('section-1')
+    expect(state.findInPageLinkTarget).toHaveBeenCalledWith('section-1')
   })
 
   it('throws TypeError when anchor is not a string', () => {
     // @ts-expect-error testing runtime type check with wrong type
     expect(() => moveToAnchor(123)).toThrowError(TypeError)
   })
 
-  it('advises when inPageLinks is not enabled', () => {
-    state.inPageLinks = undefined
-    moveToAnchor('section-1')
-    expect(advise).toHaveBeenCalledWith(expect.stringContaining('inPageLinks'))
+  it('is a no-op when inPageLinks is not enabled', () => {
+    state.findInPageLinkTarget = null
+    expect(() => moveToAnchor('section-1')).not.toThrow()
   })
 })

packages/child/methods/move-to-anchor.ts

@@ -1,18 +1,9 @@
 import { typeAssert } from '@iframe-resizer/common'
 import { STRING } from '@iframe-resizer/common/consts'
 
-import { advise } from '../console'
 import state from '../values/state'
 
 export default function moveToAnchor(anchor: string): void {
   typeAssert(anchor, STRING, 'parentIframe.moveToAnchor(anchor) anchor')
-
-  if (!state.inPageLinks?.findTarget) {
-    advise(
-      '<rb>Move to Anchor</><br><br>moveToAnchor() requires <b>inPageLinks</> to be enabled',
-    )
-    return
-  }
-
-  state.inPageLinks.findTarget(anchor)
+  state.findInPageLinkTarget?.(anchor)
 }

packages/child/page/links.branches.test.ts

@@ -16,15 +16,16 @@ describe('child/page/links branches', () => {
   beforeEach(() => {
     vi.restoreAllMocks()
     document.body.innerHTML = ''
-    state.inPageLinks = undefined
+    state.findInPageLinkTarget = null
     settings.mode = 0
+    settings.inPageLinks = true
     sendMessage.mockClear()
   })
 
   it('enabled=false logs and does not set up handlers', () => {
     setupInPageLinks(false)
 
-    expect(state.inPageLinks).toBeUndefined()
+    expect(state.findInPageLinkTarget).toBeNull()
     expect(sendMessage).not.toHaveBeenCalled()
   })
 
@@ -34,7 +35,7 @@ describe('child/page/links branches', () => {
     setupInPageLinks(true)
 
     expect(consoleMod.advise).toHaveBeenCalled()
-    expect(state.inPageLinks).toBeUndefined()
+    expect(state.findInPageLinkTarget).toBeNull()
     expect(sendMessage).not.toHaveBeenCalled()
   })
 
@@ -69,15 +70,15 @@ describe('child/page/links branches', () => {
   })
 
   it('findTarget jumps when element exists', () => {
-    // Enable and use state.inPageLinks.findTarget
+    // Enable and use state.findInPageLinkTarget
     const target = document.createElement('div')
     target.id = 'found'
     target.getBoundingClientRect = () => ({ left: 7, top: 11 })
     document.body.append(target)
 
     setupInPageLinks(true)
 
-    state.inPageLinks.findTarget('#found')
+    state.findInPageLinkTarget('#found')
 
     expect(sendMessage).toHaveBeenCalledWith(11, 7, SCROLL_TO_OFFSET)
   })
@@ -91,7 +92,7 @@ describe('child/page/links branches', () => {
     setupInPageLinks(true)
 
     // Pass location without # prefix
-    state.inPageLinks.findTarget('nohash')
+    state.findInPageLinkTarget('nohash')
 
     expect(sendMessage).toHaveBeenCalledWith(15, 5, SCROLL_TO_OFFSET)
   })
@@ -104,7 +105,7 @@ describe('child/page/links branches', () => {
 
     setupInPageLinks(true)
 
-    state.inPageLinks.findTarget('#byname')
+    state.findInPageLinkTarget('#byname')
 
     expect(sendMessage).toHaveBeenCalledWith(9, 3, SCROLL_TO_OFFSET)
   })

packages/child/page/links.test.ts

@@ -3,7 +3,7 @@ import { beforeEach, describe, expect, test, vi } from 'vitest'
 import sendMessage from '../send/message'
 import settings from '../values/settings'
 import state from '../values/state'
-import setupInPageLinks from './links'
+import setupInPageLinks, { findTarget } from './links'
 
 vi.mock('../console', () => ({ log: vi.fn(), advise: vi.fn() }))
 vi.mock('../send/message', () => ({ __esModule: true, default: vi.fn() }))
@@ -13,6 +13,8 @@ describe('child/page/links', () => {
     vi.clearAllMocks()
     document.body.innerHTML = ''
     settings.mode = 0
+    settings.inPageLinks = true
+    state.findInPageLinkTarget = null
   })
 
   test('setup and findTarget sends message for existing id', () => {
@@ -26,8 +28,15 @@ describe('child/page/links', () => {
 
     setupInPageLinks(true)
     // use the registered finder directly
-    state.inPageLinks.findTarget('#t1')
+    state.findInPageLinkTarget('#t1')
 
     expect(sendMessage).toHaveBeenCalled()
   })
+
+  test('findTarget no-op when inPageLinks setting becomes false', () => {
+    settings.inPageLinks = false
+    findTarget('#nope')
+
+    expect(sendMessage).not.toHaveBeenCalled()
+  })
 })