Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove CableReady plugin system #238

Merged
merged 2 commits into from
Jan 16, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 6 additions & 4 deletions javascript/elements/updates_for_element.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import Plugins from '../plugins'
import morphdom from 'morphdom'
import SubscribingElement from './subscribing_element'

import { shouldMorph } from '../morph_callbacks'
Expand Down Expand Up @@ -136,7 +136,7 @@ class Block {
}

dispatch(this.element, 'cable-ready:before-update', operation)
Plugins.morphdom(this.element, fragments[blockIndex], {
morphdom(this.element, fragments[blockIndex], {
childrenOnly: true,
onBeforeElUpdated: shouldMorph(operation),
onElUpdated: _ => {
Expand All @@ -147,9 +147,11 @@ class Block {
})
}

async resolveTurboFrames (docFragment) {
async resolveTurboFrames (documentFragment) {
const reloadingTurboFrames = [
...docFragment.querySelectorAll('turbo-frame[src]:not([loading="lazy"])')
...documentFragment.querySelectorAll(
'turbo-frame[src]:not([loading="lazy"])'
)
]

return Promise.all(
Expand Down
22 changes: 6 additions & 16 deletions javascript/index.js
Original file line number Diff line number Diff line change
@@ -1,15 +1,10 @@
import morphdom from 'morphdom'

import packageInfo from '../package.json'
import { perform, performAsync } from './cable_ready'
import { defineElements } from './elements'
import { shouldMorphCallbacks, didMorphCallbacks } from './morph_callbacks'

import * as Plugins from './plugins'

// TODO: Remove this in v6
// Kicking the can down the road for now
import morphdom from 'morphdom'
Plugins.register('morphdom', morphdom)

import * as MorphCallbacks from './morph_callbacks'
import * as Utils from './utils'

Expand All @@ -21,7 +16,7 @@ import SubscribingElement from './elements/subscribing_element'
import CableConsumer from './cable_consumer'

const initialize = (initializeOptions = {}) => {
const { consumer, onMissingElement, plugins } = initializeOptions
const { consumer, onMissingElement } = initializeOptions

if (consumer) {
CableConsumer.setConsumer(consumer)
Expand All @@ -31,20 +26,16 @@ const initialize = (initializeOptions = {}) => {
)
}

if (onMissingElement) MissingElement.set(onMissingElement)

if (plugins)
Object.keys(plugins).forEach(plugin =>
Plugins.register(plugin, plugins[plugin])
)
if (onMissingElement) {
MissingElement.set(onMissingElement)
}

defineElements()
}

export {
Utils,
MorphCallbacks,
Plugins,
CableReadyElement,
StreamFromElement,
UpdatesForElement,
Expand All @@ -57,7 +48,6 @@ const global = {
shouldMorphCallbacks,
didMorphCallbacks,
initialize,
registerPlugin: Plugins.register,
addOperation,
addOperations,
version: packageInfo.version,
Expand Down
35 changes: 3 additions & 32 deletions javascript/operations.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import Plugins from './plugins'
import morphdom from 'morphdom'

import { shouldMorph, didMorph } from './morph_callbacks'
import {
assignFocus,
Expand Down Expand Up @@ -477,36 +478,6 @@ export default {
// Morph operations

morph: operation => {
// TODO: remove this in 6.0
processElements(operation, element => {
const { html } = operation
const template = document.createElement('template')
template.innerHTML = String(safeScalar(html)).trim()
operation.content = template.content
const parent = element.parentElement
const idx = parent && Array.from(parent.children).indexOf(element)
before(element, operation)
operate(operation, () => {
const { childrenOnly, focusSelector } = operation
Plugins.morphdom(
element,
childrenOnly ? template.content : template.innerHTML,
{
childrenOnly: !!childrenOnly,
onBeforeElUpdated: shouldMorph(operation),
onElUpdated: didMorph(operation)
}
)
assignFocus(focusSelector)
})
console.warn(
'The "morph" operation is deprecated in CableReady v5 and will be removed in v6. Use "morphdom" or similar instead.'
)
after(parent ? parent.children[idx] : document.documentElement, operation)
})
},

morphdom: operation => {
processElements(operation, element => {
const { html } = operation
const template = document.createElement('template')
Expand All @@ -517,7 +488,7 @@ export default {
before(element, operation)
operate(operation, () => {
const { childrenOnly, focusSelector } = operation
Plugins.morphdom(
morphdom(
element,
childrenOnly ? template.content : template.innerHTML,
{
Expand Down
20 changes: 0 additions & 20 deletions javascript/plugins.js

This file was deleted.

14 changes: 5 additions & 9 deletions javascript/test/operations.morph.test.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,5 @@
import { html, fixture, assert } from '@open-wc/testing'

import CableReady from '..'
import morphdom from 'morphdom'

CableReady.registerPlugin('morphdom', morphdom)
import { perform } from '../cable_ready'

describe('operations', () => {
context('morph', () => {
Expand All @@ -20,7 +16,7 @@ describe('operations', () => {
}
]

CableReady.perform(operations)
perform(operations)

assert.equal(element.innerHTML, 'data-muscles will be set.')
assert.equal(element.dataset.muscles, 'sore')
Expand All @@ -40,7 +36,7 @@ describe('operations', () => {
}
]

CableReady.perform(operations)
perform(operations)

assert.equal(element.innerHTML, 'data-muscles will be updated.')
assert.equal(element.dataset.muscles, 'sore')
Expand All @@ -61,7 +57,7 @@ describe('operations', () => {
}
]

CableReady.perform(operations)
perform(operations)

assert.equal(element.innerHTML, 'Post-Operation')
assert.equal(Object.keys(document.body.dataset).length, 0)
Expand All @@ -82,7 +78,7 @@ describe('operations', () => {
}
]

CableReady.perform(operations)
perform(operations)

assert.equal(element.innerHTML, 'Post-Operation')
assert.equal(element.dataset.muscles, 'pre')
Expand Down
1 change: 0 additions & 1 deletion lib/cable_ready/config.rb
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,6 @@ def default_operation_names
insert_adjacent_text
invoke_method
morph
morphdom
notification
outer_html
prepend
Expand Down