diff --git a/readme.txt b/readme.txt index 4de063ddb..d55ac49a0 100644 --- a/readme.txt +++ b/readme.txt @@ -108,6 +108,8 @@ e.g. == Changelog == +[ Bug fix ][ Post list (Pro) / Post list slider (Pro) / Tab (Pro) / Slider ] Fixed errors occurring regardless of whether the editing screen environment is in an iframe and improved the stability of feature performance. + = 1.96.1 = [ Other ] Rollback 1.95.0.3 diff --git a/src/blocks/_pro/post-list-slider/edit.js b/src/blocks/_pro/post-list-slider/edit.js index ef15f9e71..af4ea1aff 100644 --- a/src/blocks/_pro/post-list-slider/edit.js +++ b/src/blocks/_pro/post-list-slider/edit.js @@ -65,16 +65,16 @@ export default function PostListSliderEdit(props) { } }, [layout]); + // リンクを無効にする関数 const disableLinks = () => { - // iframe内のドキュメントを取得 + // iframe の有無を確認して適切なドキュメントを取得 const iframe = document.querySelector( '.block-editor-iframe__container iframe' ); + const targetDocument = iframe?.contentWindow?.document || document; - const iframeDocument = iframe.contentWindow.document; - - const links = iframeDocument.querySelectorAll( - '.vk_post a, .card-intext .card-intext-inner, .postListText_singleTermLabel_inner' + const links = targetDocument.querySelectorAll( + '.vk_post_imgOuter a, .vk_post .vk_post_title a, .postListText_title a, .card-intext .card-intext-inner, .postListText_singleTermLabel_inner, .vk_post_btnOuter a' ); links.forEach((link) => { link.addEventListener('click', (event) => { @@ -82,7 +82,6 @@ export default function PostListSliderEdit(props) { }); link.style.cursor = 'default'; link.style.boxShadow = 'unset'; - // ホバー効果を無効化 link.style.textDecorationColor = 'inherit'; }); @@ -90,15 +89,15 @@ export default function PostListSliderEdit(props) { useEffect(() => { // MutationObserverでDOMの変化を監視 - const observer = new MutationObserver(disableLinks); - - // iframeの中身を監視 const iframe = document.querySelector( '.block-editor-iframe__container iframe' ); - if (iframe && iframe.contentWindow) { - const iframeDocument = iframe.contentWindow.document; - observer.observe(iframeDocument.body, { + const targetDocument = iframe?.contentWindow?.document || document; + const observerTarget = targetDocument.querySelector('body'); + + const observer = new MutationObserver(disableLinks); + if (observerTarget) { + observer.observe(observerTarget, { childList: true, subtree: true, }); diff --git a/src/blocks/_pro/post-list/edit.js b/src/blocks/_pro/post-list/edit.js index 89b87c86d..7451362b2 100644 --- a/src/blocks/_pro/post-list/edit.js +++ b/src/blocks/_pro/post-list/edit.js @@ -17,16 +17,16 @@ export default function PostListEdit(props) { const blockProps = useBlockProps(); + // リンクを無効にする関数 const disableLinks = () => { - // iframe内のドキュメントを取得 + // iframe の有無を確認して適切なドキュメントを取得 const iframe = document.querySelector( '.block-editor-iframe__container iframe' ); + const targetDocument = iframe?.contentWindow?.document || document; - const iframeDocument = iframe.contentWindow.document; - - const links = iframeDocument.querySelectorAll( - '.vk_post a, .card-intext .card-intext-inner, .postListText_singleTermLabel_inner' + const links = targetDocument.querySelectorAll( + '.vk_post_imgOuter a, .vk_post .vk_post_title a, .postListText_title a, .card-intext .card-intext-inner, .postListText_singleTermLabel_inner, .vk_post_btnOuter a' ); links.forEach((link) => { link.addEventListener('click', (event) => { @@ -34,7 +34,6 @@ export default function PostListEdit(props) { }); link.style.cursor = 'default'; link.style.boxShadow = 'unset'; - // ホバー効果を無効化 link.style.textDecorationColor = 'inherit'; }); @@ -42,15 +41,15 @@ export default function PostListEdit(props) { useEffect(() => { // MutationObserverでDOMの変化を監視 - const observer = new MutationObserver(disableLinks); - - // iframeの中身を監視 const iframe = document.querySelector( '.block-editor-iframe__container iframe' ); - if (iframe && iframe.contentWindow) { - const iframeDocument = iframe.contentWindow.document; - observer.observe(iframeDocument.body, { + const targetDocument = iframe?.contentWindow?.document || document; + const observerTarget = targetDocument.querySelector('body'); + + const observer = new MutationObserver(disableLinks); + if (observerTarget) { + observer.observe(observerTarget, { childList: true, subtree: true, }); diff --git a/src/blocks/_pro/tab/edit.js b/src/blocks/_pro/tab/edit.js index dce1e0d87..3d990c26d 100644 --- a/src/blocks/_pro/tab/edit.js +++ b/src/blocks/_pro/tab/edit.js @@ -210,16 +210,28 @@ export default function TabEdit(props) { const liOnClick = (e) => { if (childBlocks) { + // iframeの有無を確認し、適切なdocumentを取得 const iframe = document.querySelector( '.block-editor-iframe__container iframe' ); - const iframeDocument = iframe?.contentWindow?.document; + const targetDocument = iframe?.contentWindow?.document || document; const vkTab = e.target.closest('.vk_tab'); + if (!vkTab) { + return; + } + const vkTabLabels = vkTab.querySelector('.vk_tab_labels'); + if (!vkTabLabels) { + return; + } // ブロック ID を抽出 - const TabLabelId = e.target.closest('.vk_tab_labels_label').id; + const TabLabelId = e.target.closest('.vk_tab_labels_label')?.id; + if (!TabLabelId) { + return; + } + const TabId = TabLabelId.replace('vk_tab_labels_label-', ''); /* ラベルの処理 */ @@ -249,23 +261,30 @@ export default function TabEdit(props) { const newActiveLabel = vkTabLabels.querySelector( `#vk_tab_labels_label-${TabId}` ); - newActiveLabel.classList.add('vk_tab_labels_label-state-active'); - newActiveLabel.classList.remove( - 'vk_tab_labels_label-state-inactive' - ); - newActiveLabel.style.removeProperty('background-color'); + if (newActiveLabel) { + newActiveLabel.classList.add( + 'vk_tab_labels_label-state-active' + ); + newActiveLabel.classList.remove( + 'vk_tab_labels_label-state-inactive' + ); + newActiveLabel.style.removeProperty('background-color'); + } - const activeTabBody = iframeDocument.querySelector( + const activeTabBody = targetDocument.querySelector( `#block-${TabId}` ); - const activeTabBodyStyle = window.getComputedStyle(activeTabBody); - if ( - !newActiveLabel - .closest('.vk_tab') - .classList.contains('is-style-vk_tab_labels-line') - ) { - newActiveLabel.style.backgroundColor = - activeTabBodyStyle.borderTopColor || ''; + if (activeTabBody) { + const activeTabBodyStyle = + window.getComputedStyle(activeTabBody); + if ( + !newActiveLabel + .closest('.vk_tab') + .classList.contains('is-style-vk_tab_labels-line') + ) { + newActiveLabel.style.backgroundColor = + activeTabBodyStyle.borderTopColor || ''; + } } /* 本体の処理 */ diff --git a/src/blocks/slider/edit-slider.js b/src/blocks/slider/edit-slider.js index 177b8e5da..64ba57bdb 100644 --- a/src/blocks/slider/edit-slider.js +++ b/src/blocks/slider/edit-slider.js @@ -75,6 +75,11 @@ const LaunchSwiper = (slider) => { if (swiperButtonNext) { swiperButtonNext.style.display = ''; } + const swiperPagination = + slider.querySelector('.swiper-pagination'); + if (swiperPagination) { + swiperPagination.style.display = ''; + } // Sloder の設定を作成 const SwiperSetting = {}; @@ -211,7 +216,7 @@ const LaunchSwiper = (slider) => { removeSwiperClassName(newSwiperDiv); } - // 不要な wiper-wrapper クラスを削除 + // 不要な swiper-wrapper クラスを削除 const newSwiperWrapper = slider.querySelector( '.block-editor-block-list__layout' ); @@ -243,6 +248,13 @@ const LaunchSwiper = (slider) => { if (swiperButtonNext) { swiperButtonNext.style.display = 'none'; } + + // ページネーションの非表示 + const swiperPagination = slider.querySelector('.swiper-pagination'); + if (swiperPagination) { + swiperPagination.style.display = 'none'; + } + if (swiper[sliderId]) { swiper[sliderId].destroy(); swiper[sliderId] = null; @@ -307,23 +319,21 @@ const editorRootLaunch = (editorRoot) => { }; export const editSliderLaunch = () => { - const blockEditorRoot = document.querySelector( - '.block-editor__container iframe' - ); - if (blockEditorRoot && blockEditorRoot.contentWindow) { - const editorRoot = blockEditorRoot.contentWindow.document.querySelector( - '.block-editor-block-list__layout' - ); - if (editorRoot) { - editorRootLaunch(editorRoot); - } + const iframe = document.querySelector('.block-editor__container iframe'); + const iframeDoc = iframe?.contentWindow?.document; + const editorRoot = + iframeDoc?.querySelector('.block-editor-block-list__layout') || + document.querySelector('.block-editor-block-list__layout'); + + if (editorRoot) { + editorRootLaunch(editorRoot); } - const iframe = document.querySelector('#site-editor iframe'); - if (iframe) { - const siteEditorRoot = - iframe.contentWindow.document.querySelector('.is-root-container'); - if (siteEditorRoot) { - editorRootLaunch(siteEditorRoot); - } + + const siteIframe = document.querySelector('#site-editor iframe'); + const siteEditorRoot = + siteIframe?.contentWindow?.document.querySelector('.is-root-container'); + + if (siteEditorRoot) { + editorRootLaunch(siteEditorRoot); } }; diff --git a/src/blocks/slider/edit.js b/src/blocks/slider/edit.js index df91a73c8..16c797c56 100644 --- a/src/blocks/slider/edit.js +++ b/src/blocks/slider/edit.js @@ -51,10 +51,16 @@ export default function SliderEdit(props) { blockId, } = attributes; - editSliderLaunch(); useEffect(() => { - editSliderLaunch(); - }, [attributes]); + let timer; + if (editorMode) { + timer = setTimeout(() => { + editSliderLaunch(); + }, 50); + } + + return () => clearTimeout(timer); + }, [editorMode]); useEffect(() => { // attributes の clientId は使わなくなったので削除