Skip to content

Upgrading swiper 10 to 11

Unknown10.3.1 → 11.2.10Security1New7Changed2Fixed64

Full comparisonBack to swiper
Fetching 37 releases from GitHub…25 / 37
UnknownUpgrade verdict

DepDelta is still reading the notes for 12 of 37 releases, so breaking changes can't be ruled out yet.

In plain terms
  • DepDelta is still reading the release notes in this range, so it can't rule out breaking changes yet.
  • This page updates as the notes come in.
Must act 1 item needs code or config changes

What you must change

Security1
Sets innerHTML using trusted types.
innerHTML
11.2.7GitHub ReleaseSummarizedView source

API changes

Generated by DepDelta from published .d.ts files. Not mixed with prose notes.

  • added: const createShadow: (suffix: string, slideEl: HTMLElement, side?: string) => HTMLElement
  • added: const effectInit: (params: { effect: string; swiper: Swiper; on: () => void; setTranslate: () => void; setTransition: (duration: number) => void; overwriteParams?: () => SwiperO…
  • added: const effectTarget: (effectParams: any, slideEl: HTMLElement) => void
  • added: const effectVirtualTransitionEnd: (params: { swiper: Swiper; duration: number; transformElements: HTMLElement[]; allSlides?: boolean }) => void
  • added: const getSlideTransformEl: (slideEl: HTMLElement) => void
  • added: property A11yOptions.containerRole?: string | null
  • added: property A11yOptions.scrollOnFocus?: boolean
  • changed: property CoverflowEffectOptions.stretch?: number → property CoverflowEffectOptions.stretch?: number | `${number}%`
  • removed: const Lazy: SwiperModule
  • added: property MousewheelOptions.enabled?: boolean
  • changed: property ThumbsOptions.swiper?: Swiper | null → property ThumbsOptions.swiper?: Swiper | string | null
  • added: property ZoomOptions.limitToOriginalSize?: boolean
  • added: property ZoomOptions.panOnMouseMove?: boolean
  • removed: interface SwiperModule
  • removed: property SwiperModule.name: string
  • added: type SwiperModule = (options: { params: Swiper['params']; swiper: Swiper; extendParams: (obj: { [name: string]: any }) => void; on: Swiper['on']; once: Swiper['once']; off: Swiper…
  • changed: method Swiper.slideNext(speed?: number, runCallbacks?: boolean): void → method Swiper.slideNext(speed?: number, runCallbacks?: boolean): boolean
  • changed: method Swiper.slidePrev(speed?: number, runCallbacks?: boolean): void → method Swiper.slidePrev(speed?: number, runCallbacks?: boolean): boolean
  • changed: method Swiper.slideReset(speed?: number, runCallbacks?: boolean): void → method Swiper.slideReset(speed?: number, runCallbacks?: boolean): boolean
  • changed: method Swiper.slideTo(index: number, speed?: number, runCallbacks?: boolean): void → method Swiper.slideTo(index: number, speed?: number, runCallbacks?: boolean): boolean
  • changed: method Swiper.slideToClosest(speed?: number, runCallbacks?: boolean): void → method Swiper.slideToClosest(speed?: number, runCallbacks?: boolean): boolean
  • changed: method Swiper.slideToLoop(index: number, speed?: number, runCallbacks?: boolean): void → method Swiper.slideToLoop(index: number, speed?: number, runCallbacks?: boolean): Swiper
  • added: method Swiper.maxTranslate(): number
  • added: method Swiper.minTranslate(): number
  • added: property Swiper.enabled: boolean
  • added: property Swiper.slidesEl: HTMLElement
  • added: property Swiper.slidesGrid: number[]
  • added: property Swiper.slidesSizesGrid: number[]
  • added: property SwiperEvents.slidesUpdated: (swiper: Swiper) => void
  • removed: property SwiperOptions.loopedSlides?: number | null
  • changed: property SwiperOptions.breakpointsBase?: string → property SwiperOptions.breakpointsBase?: 'window' | 'container' | CSSSelector
  • changed: property SwiperOptions.effect?: 'slide' | 'fade' | 'cube' | 'coverflow' | 'flip' | 'creative' | 'cards' | string → property SwiperOptions.effect?: 'slide' | 'fade' | 'cube' | 'coverflow' | 'flip' | 'creative' | 'cards' | (string & {})
  • added: property SwiperOptions.eventsPrefix?: string
  • added: property SwiperOptions.loopAddBlankSlides?: boolean
  • added: property SwiperOptions.loopAdditionalSlides?: number
  • added: property SwiperOptions.slideBlankClass?: string
  • added: property SwiperOptions.slideFullyVisibleClass?: string
  • added: property SwiperOptions.swiperElementNodeName?: string