DiscipleTools / disciple-tools-web-components

https://jade-chebakia-17493f.netlify.app/?path=/story/kitchen-sink--kitchen-sink
GNU General Public License v2.0
3 stars 8 forks source link

Lit upgrade #84

Open cairocoder01 opened 4 months ago

cairocoder01 commented 4 months ago

Upgrades the following:

Changes the build slightly so that you no longer need type="module" on the script tag. This will be especially useful for including from the CDN with static HTML or in WordPress.

I published this under the beta tag on NPM so that it's available to test: https://www.npmjs.com/package/@disciple.tools/web-components/v/0.7.0-beta.1. Since it's not under the latest tag, users won't get that until we're ready to publish it for sure.

Could use a little bit of testing in real environments (or local DT dev setup) to make sure everything is still working as expected before we merge this in.

netlify[bot] commented 4 months ago

Deploy Preview for jade-chebakia-17493f ready!

Name Link
Latest commit 91514409c2d5fd3850e131ae01a66f979c070b7d
Latest deploy log https://app.netlify.com/sites/jade-chebakia-17493f/deploys/670774f4fa750f0008b12f7f
Deploy Preview https://deploy-preview-84--jade-chebakia-17493f.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

cairocoder01 commented 4 months ago

This also adds a demo of some auto documentation for the dt-text component, as well as some extra markdown docs alongside it for what isn't automatically documented. Hopefully we can upgrade all the rest of the components' docs in the same way.

cairocoder01 commented 4 months ago

Netlify preview build is failing because it seems to be using Node v16. I don't have access to that account, but it probably needs to be updated to v20 (v18 at the minimum for Storybook, based on the error log)

micahmills commented 4 months ago

I fixed the GitHub actions and netlify deploy to be on node 20. I Have looked briefly at this but will test it more thoroughly tomorrow.

cairocoder01 commented 4 months ago

I noticed once you got the Netlify preview working that it's not loading the CSS right. I think I just need to include those assets in the build, so I'll try to get to that later today.

cairocoder01 commented 3 months ago

@micahmills I updated this from master with the most recent changes and published beta.2 as I was testing it in a magic link I'm building. I also ignored the few failing tests for the time being.

I'm not sure what we want to do for releasing/merging this. Do you want to wait until there is a lull in the work of your devs? I'm happy to just leave this PR sitting here and occasionally merge master in and release another beta version. The magic link I'm working on will be probably another few months before being ready for release, so I'm fine to go a little slow on this if that's easiest.

micahmills commented 3 months ago

I have my devs working on the failing tests this week and I have a few PRs to review and merge in. We should reach a point in the next couple of weeks that will make merging this in a bit easier as they will have most of the components working in the theme. So let's leave this for another week or two and get the current PRs merged in, then we can do this upgrade.

micahmills commented 1 month ago

Hey Jon, I was attempting to merge this in but am getting an error in the theme next branch. It looks like vite is now building just the index.js file another there is no services.min.js file as we were with rollup. Since we are enqueueing that file in the WP theme, it throws an error that the file doesn't exist.

This is fine, but before I make changes in the theme to align with this I want to make sure I understand it. In the current version we are putting the API and component services on the window object at window.WebComponentServices. How do we initialize the services in the theme with this upgrade?

cairocoder01 commented 1 month ago

Yes, there's only one file to include now. It has all of the services code included in it, so it makes it a bit easier.

If you look in the commit history of my post-connections branch in the magic link plugin, you can see how to access the services class. I changed the namespace used in js but forgot exactly. I think it currently is WebComponentServices but I changed it to maybe DtComponents or something like that.

micahmills commented 1 month ago

I took a stab at merging this in yesterday, but ran out of time to track down an error.

I am getting an error on the test runner that says You are using es module syntax in a config loaded as CommonJS module I am not sure what changed because the test were working before. I will try to get back to this today or tomorrow, but if you have any ideas let me know.