Class LiveSocket

constructor

• new LiveSocket(
      url: string,
      phxSocket: typeof Socket,
      opts?: Partial<LiveSocketOptions>,
  ): LiveSocket

  Creates a new LiveSocket instance.

  Parameters

  • url: string

    The WebSocket endpoint URL, e.g., "wss://example.com/live", or "/live" to inherit the host and protocol.

  • phxSocket: typeof Socket

    The required Phoenix Socket class imported from "phoenix". For example:

    import {Socket} from "phoenix"
    import {LiveSocket} from "phoenix_live_view"
    let liveSocket = new LiveSocket("/live", Socket, {...})
    Copy

  • opts: Partial<LiveSocketOptions> = {}

    Optional configuration.

  Returns LiveSocket

Readonly Internalbuffers

InternalcurrentHistoryPosition

InternaldisconnectedTimeout

InternaldomCallbacks

InternalloaderTimeout

InternallocalStorage

Internalmain

Internalparams

InternalRenderingBuffer

socket

Internalunloaded

Internaluploaders

asyncTransition

• asyncTransition(promise: any): void
  Internal

  Parameters

  • promise: any

  Returns void

attachDebugBuffer

• attachDebugBuffer(bufferClass: typeof RenderingBuffer): typeof RenderingBuffer
  Internal

  Installs a rendered buffer: what the renderer writes rendered HTML through.

  A buffer can observe or annotate the output — for example to mark which HEEx function components re-rendered, for a debugging overlay. See RenderingBuffer for the protocol a buffer implements.

  It applies to views that are already mounted as well as to views that join later, and nothing is re-rendered to install it: it sees each part of the page the next time a patch renders that part, so a buffer that annotates the output leaves whatever is already in the DOM untouched until then.

  const previous = liveSocket.attachDebugBuffer(MyBuffer)
  

  Parameters

  • bufferClass: typeof RenderingBuffer

    a class extending RenderingBuffer.

  Returns typeof RenderingBuffer

  The class installed until now, to restore it with.

bind

• bind<E extends Record<string, keyof HTMLElementEventMap>>(
      events: E,
      callback: (
          e: HTMLElementEventMap[E[keyof E]],
          type: keyof E & string,
          view: default,
          targetEl: Element,
          phxEvent: string,
          phxTarget: "window",
      ) => void,
  ): void
  Internal

  Type Parameters

  • E extends Record<string, keyof HTMLElementEventMap>

  Parameters

  • events: E
  • callback: (
        e: HTMLElementEventMap[E[keyof E]],
        type: keyof E & string,
        view: default,
        targetEl: Element,
        phxEvent: string,
        phxTarget: "window",
    ) => void

  Returns void

bindClick

• bindClick(): void
  Internal

  Returns void

bindClicks

• bindClicks(): void
  Internal

  Returns void

bindForms

• bindForms(): void
  Internal

  Returns void

binding

• binding(kind: any): string
  Internal

  Parameters

  • kind: any

  Returns string

bindNav

• bindNav(): void
  Internal

  Returns void

bindTopLevelEvents

• bindTopLevelEvents(__namedParameters?: { dead?: boolean }): void
  Internal

  Parameters

  • __namedParameters: { dead?: boolean } = {}

  Returns void

blurActiveElement

• blurActiveElement(): void
  Internal

  Returns void

channel

• channel(topic: any, params: any): Channel
  Internal

  Parameters

  • topic: any
  • params: any

  Returns Channel

commitPendingLink

• commitPendingLink(linkRef: any): boolean
  Internal

  Parameters

  • linkRef: any

  Returns boolean

connect

• connect(): void

  Connects to the LiveView server.

  Returns void

debounce

• debounce(el: any, event: any, eventType: any, callback: any): any
  Internal

  Parameters

  • el: any
  • event: any
  • eventType: any
  • callback: any

  Returns any

destroyAllViews

• destroyAllViews(): void
  Internal

  Returns void

destroyViewByEl

• destroyViewByEl(el: any): void
  Internal

  Parameters

  • el: any

  Returns void

disableDebug

• disableDebug(): void

  Disables debugging.

  Returns void

disableLatencySim

• disableLatencySim(): void

  Disables latency simulation.

  Returns void

disableProfiling

• disableProfiling(): void

  Disables profiling.

  Returns void

disconnect

• disconnect(callback?: () => void): void

  Disconnects from the LiveView server.

  Parameters

  • Optionalcallback: () => void

  Returns void

dispatchBeforeNavigate

• dispatchBeforeNavigate(detail: any): any
  Internal

  Parameters

  • detail: any

  Returns any

dispatchClickAway

• dispatchClickAway(e: any, clickStartedAt: any): void
  Internal

  Parameters

  • e: any
  • clickStartedAt: any

  Returns void

dispatchEvent

• dispatchEvent(event: any, payload?: {}): void
  Internal

  Parameters

  • event: any
  • payload: {} = {}

  Returns void

dispatchEvents

• dispatchEvents(events: any): void
  Internal

  Parameters

  • events: any

  Returns void

dropActiveElement

• dropActiveElement(view: any): void
  Internal

  Parameters

  • view: any

  Returns void

enableDebug

• enableDebug(): void

  Enables debugging.

  When debugging is enabled, the LiveView client will log debug information to the console. See Debugging client events for more information.

  Returns void

enableLatencySim

• enableLatencySim(upperBoundMs: number): void

  Enables latency simulation.

  When latency simulation is enabled, the LiveView client will add a delay to requests and responses from the server. See Simulating Latency for more information.

  Parameters

  • upperBoundMs: number

  Returns void

enableProfiling

• enableProfiling(): void

  Enables profiling.

  When profiling is enabled, the LiveView client will log profiling information to the console.

  Returns void

eventMeta

• eventMeta(eventName: any, e: any, targetEl: any): any
  Internal

  Parameters

  • eventName: any
  • e: any
  • targetEl: any

  Returns any

execJS

• execJS(el: Element, encodedJS: EncodedJS, eventType?: string): void

  Executes an encoded JS command, targeting the given element.

  See Phoenix.LiveView.JS for more information.

  Parameters

  • el: Element
  • encodedJS: EncodedJS
  • eventType: string = null

  Returns void

getActiveElement

• getActiveElement(): Element
  Internal

  Returns Element

getBindingPrefix

• getBindingPrefix(): string
  Internal

  Returns string

getHookDefinition

• getHookDefinition(name: any): any
  Internal

  Parameters

  • name: any

  Returns any

getHref

• getHref(): string
  Internal

  Returns string

getLatencySim

• getLatencySim(): number

  Returns the current latency simulation upper bound.

  Returns number

getRootById

• getRootById(id: any): default
  Internal

  Parameters

  • id: any

  Returns default

getSocket

• getSocket(): Socket

  Returns the Phoenix Socket instance.

  Returns Socket

getViewByEl

• getViewByEl(el: any): any
  Internal

  Parameters

  • el: any

  Returns any

hasPendingLink

• hasPendingLink(): boolean
  Internal

  Returns boolean

historyPatch

• historyPatch(href: any, linkState: any, linkRef?: number): void
  Internal

  Parameters

  • href: any
  • linkState: any
  • linkRef: number = ...

  Returns void

historyRedirect

• historyRedirect(
      e: Event,
      href: string,
      linkState: "replace" | "push",
      flash: string,
      targetEl?: Element,
  ): void
  Internal

  Parameters

  • e: Event
  • href: string
  • linkState: "replace" | "push"
  • flash: string
  • OptionaltargetEl: Element

  Returns void

isConnected

• isConnected(): boolean
  Internal

  Returns boolean

isDebugDisabled

• isDebugDisabled(): boolean

  Returns true if debugging is disabled. See enableDebug and disableDebug.

  Returns boolean

isDebugEnabled

• isDebugEnabled(): boolean

  Returns true if debugging is enabled. See enableDebug and disableDebug.

  Returns boolean

isNewLocation

• isNewLocation(newLocation: any): boolean
  Internal

  Parameters

  • newLocation: any

  Returns boolean

isPhxView

• isPhxView(el: any): boolean
  Internal

  Parameters

  • el: any

  Returns boolean

isProfileEnabled

• isProfileEnabled(): boolean

  Returns true if profiling is enabled. See enableProfiling and disableProfiling.

  Returns boolean

isUnloaded

• isUnloaded(): boolean
  Internal

  Returns boolean

joinDeadView

• joinDeadView(): void
  Internal

  Returns void

joinRootViews

• joinRootViews(): boolean
  Internal

  Returns boolean

js

• js(): AllJSCommands

  Returns an object with methods to manipulate the DOM and execute JavaScript. The applied changes integrate with server DOM patching.

  See JavaScript interoperability for more information.

  Returns AllJSCommands

jsQuerySelectorAll

• jsQuerySelectorAll(sourceEl: any, query: any, defaultQuery: any): any
  Internal

  Parameters

  • sourceEl: any
  • query: any
  • defaultQuery: any

  Returns any

log

• log(
      view: any,
      kind: any,
      msgCallback: any,
      diagnostic?: {
          code: string;
          context?: LiveViewDiagnosticContext;
          level?: LiveViewDiagnosticLevel;
          metadata?: () => LiveViewDiagnosticMetadata;
      },
  ): void
  Internal

  Parameters

  • view: any
  • kind: any
  • msgCallback: any
  • Optionaldiagnostic: {
        code: string;
        context?: LiveViewDiagnosticContext;
        level?: LiveViewDiagnosticLevel;
        metadata?: () => LiveViewDiagnosticMetadata;
    }

  Returns void

maybeInternalHook

• maybeInternalHook(name: any): Hook<any, any>
  Internal

  Parameters

  • name: any

  Returns Hook<any, any>

maybeRuntimeHook

• maybeRuntimeHook(name: any): any
  Internal

  Parameters

  • name: any

  Returns any

maybeScroll

• maybeScroll(scroll: any): void
  Internal

  Parameters

  • scroll: any

  Returns void

newRootView

• newRootView(el: any, flash?: any, liveReferer?: any): default
  Internal

  Parameters

  • el: any
  • Optionalflash: any
  • OptionalliveReferer: any

  Returns default

on

• on<K extends string>(
      event: K,
      callback: (
          e: K extends keyof HTMLElementEventMap
              ? HTMLElementEventMap[K]
              : CustomEvent<any>,
      ) => void,
  ): void
  Internal

  Type Parameters

  • K extends string

  Parameters

  • event: K
  • callback: (
        e: K extends keyof HTMLElementEventMap
            ? HTMLElementEventMap[K]
            : CustomEvent<any>,
    ) => void

  Returns void

onChannel

• onChannel(channel: any, event: any, cb: any): void
  Internal

  Parameters

  • channel: any
  • event: any
  • cb: any

  Returns void

owner

• owner(childEl: Element, callback?: (view: default) => any): any
  Internal

  Parameters

  • childEl: Element
  • Optionalcallback: (view: default) => any

  Returns any

pushHistoryPatch

• pushHistoryPatch(e: any, href: any, linkState: any, targetEl: any): void
  Internal

  Parameters

  • e: any
  • href: any
  • linkState: any
  • targetEl: any

  Returns void

redirect

• redirect(to: string, flash: string, reloadToken: string): void
  Internal

  Parameters

  • to: string
  • flash: string
  • reloadToken: string

  Returns void

registerNewLocation

• registerNewLocation(newLocation: any): boolean
  Internal

  Parameters

  • newLocation: any

  Returns boolean

reloadWithJitter

• reloadWithJitter(view: any, log?: any): void
  Internal

  Parameters

  • view: any
  • Optionallog: any

  Returns void

replaceMain

• replaceMain(
      href: string,
      flash: string,
      callback?: (linkRef: number) => void,
      linkRef?: number,
  ): void
  Internal

  Parameters

  • href: string
  • flash: string
  • callback: (linkRef: number) => void = null
  • linkRef: number = ...

  Returns void

replaceTransport

• replaceTransport(transport: any): void

  Can be used to replace the transport used by the underlying Phoenix Socket.

  Parameters

  • transport: any

  Returns void

requestDOMUpdate

• requestDOMUpdate(callback: any): void
  Internal

  Parameters

  • callback: any

  Returns void

resetReloadStatus

• resetReloadStatus(): void
  Internal

  anytime we are navigating or connecting, drop reload cookie in case we issue the cookie but the next request was interrupted and the server never dropped it

  Returns void

restorePreviouslyActiveFocus

• restorePreviouslyActiveFocus(): void
  Internal

  Returns void

setPendingLink

• setPendingLink(href: any): number
  Internal

  Parameters

  • href: any

  Returns number

silenceEvents

• silenceEvents(callback: any): void
  Internal

  Parameters

  • callback: any

  Returns void

time

• time(name: any, func: any): any
  Internal

  Parameters

  • name: any
  • func: any

  Returns any

transition

• transition(time: any, onStart: any, onDone?: () => void): void
  Internal

  Parameters

  • time: any
  • onStart: any
  • onDone: () => void = ...

  Returns void

transitionRemoves

• transitionRemoves(elements: any, view: default, callback?: any): void
  Internal

  Parameters

  • elements: any
  • view: default
  • Optionalcallback: any

  Returns void

triggerDOM

• triggerDOM(kind: any, args: any): void
  Internal

  Parameters

  • kind: any
  • args: any

  Returns void

unload

• unload(): void
  Internal

  Returns void

version

• version(): string

  Returns the version of the LiveView client.

  Returns string

withinOwners

• withinOwners(
      childEl: any,
      callback: (view: default, targetCtx: Element) => unknown,
  ): void
  Internal

  Parameters

  • childEl: any
  • callback: (view: default, targetCtx: Element) => unknown

  Returns void

withPageLoading

• withPageLoading(info: any, callback?: any): any
  Internal

  Parameters

  • info: any
  • Optionalcallback: any

  Returns any