leemon

I activated the plugin again and switched to point releases and then the label of the update button becomes “Update to latest 6.3”. If I deactivate the plugin, then the label of the update button is “Update to latest 6.5 nightly”. Right now, there’s no way to stay in the 6.4 channel, to get the next 6.4 RCs and final.

I replaced the use of the imagesLoaded lib with the following code I found in the following StackOverflow post:

https://stackoverflow.com/questions/11071314/javascript-execute-after-all-images-have-loaded

const containerRef = useRefEffect((element) => {
    var msnry;
    var images = element.querySelectorAll('img');

    Promise.all(Array.from(images).filter(img => !img.complete).map(img => new Promise(resolve => { img.onload = img.onerror = resolve; }))).then(() => {
        console.log('images finished loading');
        msnry = new Masonry(element, {
           itemSelector: '.exhibit-item',
           columnWidth: '.grid-sizer',
           percentPosition: true,
           gutter: parseInt(gap),
        });
    });

    return () => {
       msnry?.destroy();
    }
}, [items, columns, gap, crop, captions]);

But I’m getting the same results as before.

• This reply was modified 2 years, 10 months ago by leemon.

I made the changes you suggested and these are the results:

1. My custom masonry block continues to work in the post editor
2. My custom masonry block throws the following error in the FSE template editor and doesn’t work at all:

Uncaught TypeError: s.imagesLoaded is not a function
    y http://example.com/wp-content/plugins/my-custom-masonry-block/build/blocks/masonry/index.js?ver=33d807a1c5adc038a3b0:1
    useRefEffect http://example.com/wp-includes/js/dist/compose.js?ver=6861d91c4896ce3aecda:3533
    commitAttachRef http://example.com/wp-includes/js/dist/vendor/react-dom.js?ver=18.2.0:23655
    commitLayoutEffectOnFiber http://example.com/wp-includes/js/dist/vendor/react-dom.js?ver=18.2.0:23513
    commitLayoutMountEffects_complete http://example.com/wp-includes/js/dist/vendor/react-dom.js?ver=18.2.0:24698
    commitLayoutEffects_begin http://example.com/wp-includes/js/dist/vendor/react-dom.js?ver=18.2.0:24684
    commitLayoutEffects http://example.com/wp-includes/js/dist/vendor/react-dom.js?ver=18.2.0:24622
    commitRootImpl http://example.com/wp-includes/js/dist/vendor/react-dom.js?ver=18.2.0:26833
    commitRoot http://example.com/wp-includes/js/dist/vendor/react-dom.js?ver=18.2.0:26692
    performSyncWorkOnRoot http://example.com/wp-includes/js/dist/vendor/react-dom.js?ver=18.2.0:26127
    flushSyncCallbacks http://example.com/wp-includes/js/dist/vendor/react-dom.js?ver=18.2.0:12052
    ensureRootIsScheduled http://example.com/wp-includes/js/dist/vendor/react-dom.js?ver=18.2.0:25661

• This reply was modified 2 years, 10 months ago by leemon.

I just wanted the theme.json styles take precedence over the theme style.css styles. I solved this problem by removing the styles from style.css that were also present in theme.json.

With the latest release of your plugin (3.0.1), this issue is finally fixed. It seems that the vanilla JS rewrite has something to do with it…

Nevermind, the code works. It was an error on my side.

• This reply was modified 3 years, 6 months ago by leemon.

It’s working now!

Thank you very much!

I uploaded a screenshot showing the issue here:

https://ibb.co/h8JWC0W

Basically, if you use the GTranslate lang selector widget in conjunction with WooCommerce (and you are logged in), then the country selectors in the cart and checkout pages in WooCommerce are screwed up.