iframe-resizer icon indicating copy to clipboard operation
iframe-resizer copied to clipboard

Version 5.0.0 Beta

Open davidjbradshaw opened this issue 4 months ago • 0 comments

New documentation site

  • https://iframe-resizer.com

New features

  • Added automatic selection of best page size calculation method
  • Added check for html elements overflowing document body with console warning to advise on how to optimise the performance of page size calculation in this this situation
  • Added getParentProperties() function that returns the following information from the parent page:
    • iFrame boundingClientRect details
    • Position and size of scrollable page area
    • Inner size of the bowser window
  • Added offsetHeight & offsetWidth options to adjust values returned from iframe
    • #1030
  • Added direction option
  • Added postMessageTarget option to better support GAS iframes
  • Log element used to calculate lowest/rightmost/tagged element
    • #400
  • Added visibility checks to disable resizing when either the page or the iframe is hidden
  • Added direct message passing for same domain iframes, this gives much improved performance over postMessage()
  • Added CSS animation to examples
  • Added width resizing to the examples
  • Added WordPress guide to docs

Changes

  • Changed default height calculation method to auto
  • Improved performance optimisation of element based page size calculation methods
  • Replaced user interaction and browser event detection with the newish ResizeObserver API, by adding it to all non-static page elements. This provides improved detection of CSS :hover, CSS Animation, <textarea/> user resizing events and remove the need for user interaction event listeners.
    • #961
  • Deprecated heightCalculationMethod/widthCalculationMethod in favour of auto calculation mode detection
  • Deprecated data-iframe-height / date-iframe-width for data-iframe-size
  • Deprecated sizeHeight and sizeWidth in favour of new direction option
  • Deprecated getPageInfo() in favour of getParentProperties() which returns more reliable and useful data
  • Renamed onInit() -> onReady() , and added deprecation warning
  • Renamed size() -> resize() in iframe, and added deprecation warning
  • Split out jQuery support into it's own packages @iframe-resizer/jquery
  • Changed MutationObserver to now just look for added nodes in the document tree and ensure that new non-static elements are covered by ResizeObserver
  • Enhanced warning messages
  • Removed minHeight, maxHeight, minWidth and maxHeight options, as modern CSS can now deal with this for us.
  • Removed log messages from production build (reduces file sizes by 20%)
  • Removed deprecated v3 methods. Calls to v3 methods will now fail, rather than be a warning
  • Removed mouse, touch and resize event listeners, as not required alongside ResizeObserver
    • #290
  • Removed jQuery from examples
  • Removed legacy browser support, base support is now ecmaScript2020
  • Removed interval fallback, as no longer support browsers that require it
  • Removed Firefox invisible iframe fix, as no longer required

Fixes

  • Updated lowestElement to exclude non-visible elements (head, meta, base, title, script, link, style, map, area, option, optgroup, template, track, wbr, nobr) and then check remaining elements using element.checkVisibility()
    • #312
    • #508
  • Use Math.ceil() to round up sub-pixel heights (Use offset: 1 option)
    • #1017
    • #811
    • #727
  • Fixed possible memory leak in addImageListeners
    • #708
  • Deconflict AMD and CommonJS
    • #1008
  • Created React Example (onMessage)
    • #1084
  • Fixed getPageInfo() to update when the size of the iframe changes
  • Fix disabling getPageInfo() updates after leaving page in iframe that requested them
  • Fixed forcing html/body height to auto !important, incorrectly setting these values is the number one cause of problems effecting the page resizing
  • Fixed issue with height / width being returned as strings, rather than numbers by some Parent Page API methods.

Chore

  • Migrate build to Rollup
  • Migrate integration test to Chrome Headless
  • Split into multiple packages
  • Refactored code to more modern JavaScript (ongoing)
  • Migrate unit tests to Jest (ongoing)
  • Create publish script
  • Updated deps (ongoing)

Future roadmap

  • Add types for child API
  • log when new element is used to calculate size
  • Add Parent option to create data-iframe-size attrs via CSS selector
  • When checkOrigin has more than one target, iterate over them with postMessage(), rather than use *
    • #707
  • Migrate warning to tiny-warning in React version
  • Detect and ignore elements elements anchored to the page bottom/right of the page
  • Detect when an iframe is removed from the page and auto disconnect with warning message
  • Add scrollBy() method
  • Add object { top: left: behaviour: } to scrollTo / scrollToOffeset
  • Add getTopInfo() method
  • Migrate to using pubSub patten
  • Add EventListener() methods
    • #710
  • Investigate scrolling with sticky headers
    • #794
  • Add auto same-domain code injection (@iframe-resizer/injector))

Framework components / plugins roadmap

  • Vue 3 / Nuxt
  • Astro
  • Svelte
  • SolidJS
  • Angular

davidjbradshaw avatar Feb 15 '24 10:02 davidjbradshaw