Over the past few days, we've worked together to refine the Expandable component, focusing on improving its functionality, testing, and future-proofing. Here’s a quick summary of what we’ve accomplished:

Summary of Accomplishments​

• Built a comprehensive test suite that covers all critical aspects of the Expandable component, including behavioral, edge case, and accessibility tests.
• Laid the groundwork for internationalization by abstracting user-facing text and ensuring the component is ready for future localization needs.
• Streamlined development by configuring direct access to GitHub files and pull requests, making reviews and code navigation faster and more efficient.
• Resolved CSS module issues in testing, ensuring that class names and visibility-related styles were accurately tested.
• Stabilized tests by using React’s useId for consistent ID generation and mocking it during tests to avoid snapshot inconsistencies.
• Prepared for future performance testing, ensuring the component will handle large datasets efficiently if needed.

Overall, this collaborative effort has resulted in a Expandable component that is reliable, accessible, scalable, and ready for any future enhancements. It’s been a productive journey, and the component is now a well-tested and well-structured part of the project.

It's been a few days since I posted. That's not because I haven't been busy, it's because setting up unit testing turned out to be much harder than I anticipated.

To be fair, I was trying to achieve a somewhat complex setup.

It's a best-practice in Docusaurus to include a truncation marker in your blog posts. That way, when you're looking at a list of posts, you just see a brief introduction from each post, instead of the full content of the first post pushing the second post clear off the page.

It's where all those "Read more" links are coming from on the main page for my blog.

The default truncation marker for markdown files looks like this:

<!-- truncate -->

Yesterday I posted about setting up Zapier to automate posting to my LinkedIn profile whenever I create a new post here.

I've since looked into alternatives and have moved from Zapier to Make.

This post is just a listing of some of the things I'm planning to add here in the coming days.

One of the first things my outplacement coach told me was that I ought to be posting to LinkedIn regularly. I knew I wanted to have updates specific to this website here on my blog, and I figured I'd just have to cross-post them manually.

It turns out that's not so!

In my last blog post, I used a diff to show how my SVG files had changed.

For those who don't know a diff is an operation on two files that shows a graphical representation of how one is different than the other.

They look like this:

on the command line	in a nice UI like GitHub

After creating my logo, I wanted to turn it into a re-usable React component that would respond to theming, and let the logo variant be controllable by properties, so that essentially, I would only need one component that I could use wherever I wanted a logo

Variants​

I didn't intend to create a bunch of brand graphics. I just knew I was going to have to replace the default docusaurus logos with something.

I thought it would be a good idea to have a central location to showcase whatever components I add to the Docusaurus repertoire.

I'd worked with Storybook before, and found it pretty handy. During development, it gives you a way to interact with a component-in-progress and see that it works as intended. It can serve as a beginning basis for unit and component tests, and it can be a really handy tool for communicating with non-technical stakeholders... clicking on a component and seeing immediately how it responds is much easier to grasp than an engineer trying to explain something to you in non-engineer-speak as best they can. The proof is in the pudding, as they say.