CircuitPython Type Annotations

Fairly recently, I picked up a new keyboard. Not just any keyboard though. I finally got around to picking up a Corne keyboard. The journey to the specific one I chose is a bit of a story, but that’s not what this article is about.

I ended up selecting the Boardsource Corne powered by the Blok Rpi-2040 microcontroller. For me, this hit a bunch of sweet spots in terms of price, power, customizability, and ease of use. It’s been my daily driver now for several months, and I can’t imagine going back.

The default user experience for the Blok Microcontroller on supported keyboards is the Peg keymap manager (it does more than just keymaps - see the website for more details). In my opinion, Peg is sufficient for a lot of the tasks one would wish to do in terms of layout management. Based on KMK, with some customizations, Peg allows for pretty effective management of keymaps, code blocks, OLED management, LED mappings, etc, etc.

Since I tend to be … a little bit weird, I wanted the generated code to be simpler. I wanted it to be easier for me to read, and understand. I wanted the formatting to look different than what Peg generated. I could manage all this and still use Peg, but at that point, I would be getting no benefit from the Peg software. So, I set out to make my own configurations, including a boot.py that suits my needs.

The frustrations of developing those pieces by hand were exacerbated by the default python tooling not having type definitions for CircuitPython types. For any reasonably seasoned CircuitPython developer, the answer may have been simple and obvious - but that shared intuition doesn’t appear to be documented anywhere that I could easily find.

Problem Statement:

Out of the box, python tooling (even for a KMK development environment) does not include type definitions for CircuitPython. This makes inspections, linting, formatting, and warnings inaccurate, even when using something like Pyright configured with useLibraryCodeForTypes.

Solution:

The solution is surprisingly simple - Python has something called a typeshed, which (as I understand it), is effectively a method for providing type information for target environments to Python tooling.

Assuming the use of Pipenv within a project, one can add the CircuitPython types with only two libraries:

pipenv install --dev types-circuitpython
pipenv install --dev adafruit-circuitpython-typing

With those two packages installed, the static type checker, formatter, linter, LSP server, or whatever tooling you use should pick up the CircuitPython types correctly and begin offering proper typing tooltips and code completion … and get rid of those pesky false positive warnings!

These type definitions don’t need to be present at runtime, which is why they’re installed with the --dev category. If you’re not using Pipenv, then you can simply install the packages with pip, or whatever system you use to manage python dependencies - just make sure to install them in your Virtual Environment - these types will be useless for regular cPython code.

My Soldering Stuff - A Summary

A question that I’ve either been asked personally, or seen asked in public forums several times now is: what should I get to begin soldering?

The succinct, accurate answer is: it really depends on what you want to do!

That answer, however, isn’t really helpful for anyone, so I thought it might be nice to provide a list of the equipment I have available, why I chose it, and what might work instead. What works for me may not work for someone else, but at least this list and rationale should give anyone else a starting point to curating their own home lab, or whatever type of kit they want!

I started writing this post with the intention of providing sections on each category of equipment and offering thoughts and opinions on each, why I use what I use, and recommendations for new users. That quickly ballooned, giving birth to this new summary - a quick and dirty overview of some of the things in my equipment cart so that folks can take a look and pick and choose. In later days I intend to post individual articles on different categories (i.e. soldering irons, solder/flux, desoldering equipment, safety equipment) to give them the attention they deserve. Stay Tuned!

The Summary

Some Quick Closing Thoughts

The things that made this list are some of the things that I’ve collected over the years. My needs are my own and may not reflect yours, the only way to really figure out what works for you is to try things until you find what works!

In this list, I prefer to use my Pinecil, with a fume extractor and soldering mat. I wear gloves because I don’t like the feeling of my hands when they get electronics residues on them. The syringes with blunt-tip needles help me to apply flux and IPA accurately. I like the tip-tinner because it’s easy to apply with one hand. The cotton swabs listed have plastic handles so I don’t have to worry about the pressure I apply - the flat end is good for large area cleanup, and the pointed end is good for detailed cleanup work such as removing flux residue from small components and pads. I don’t need the microscope for most of the work that I do, but it definitely does make it easier to closely inspect solder joints when I suspect an issue.

Hello, World!

Hello, world!

Expanding-the-T-Mobile-Activity-Log

I’m a professional … and that means: I do expense reports! Yay!

One of my recurring expenses, a cell phone, is reimbursable for on-call rotation. I became a T-Mobile customer almost 5 years ago, starting with a pre-pay plan that gets unlimited calling (who calls people on the phone anymore?), and enough bandwidth to satisfy my needs. At a paltry $45 USD/month, there’s been no need for me to switch to another plan, so I haven’t.

As a pre-pay T-Mobile customer, my account is a second-class account. There is no way for me to request an itemized bill for the lines on my account. To get that, I’d need to be a post-pay customer. I’m not going to do that, for a few reasons. The first reason is: I like my plan, why should I change it just to get access to something I should already have? The second is that there are few to no plans at my current rate, and those offer significantly less than what I currently get. Again, why should I change?

My workaround? Gather the data I need from the T-Mobile website, combined with transactions from my credit card statement. It’s good enough to get approval on my expense reports.

The problem? T-Mobile’s website auto-collapses line items whenever one expands a second item.

Solution

If we take a look at the source through page inspection, we get to see a lot of generated HTML. I’m using the firefox built-in Web Developer Tools. The snippet below is some of the generated content from the “Activity Log” page:

<p-accordiontab
  _ngcontent-nln-c19=""
  class="m-t-sm ng-tns-c18-58 ng-star-inserted"
  id="p-accordionTab-default-10_0"
>
  <div class="ui-accordion-header ui-state-default ui-corner-all">
    <span class="fa fa-fw fa-caret-down"> </span>
    <!---->
    <!---->
    <a
      href="#"
      role="tab"
      class="ng-tns-c18-58 ng-star-inserted"
      aria-expanded="true"
      aria-selected="true"
    >
      <p-header _ngcontent-nln-c19="">
        <h6 _ngcontent-nln-c19=""></h6>
        <p _ngcontent-nln-c19="" class="blade-desc">
          <!-- snipped by Ch4ni -->
        </p>
      </p-header>
    </a>
  </div>
  <div
    class="ui-accordion-content-wrapper ng-trigger ng-trigger-tabContent"
    role="tabpanel"
    aria-hidden="true"
  >
    <!---->
    <div
      class="ui-accordion-content ui-widget-content ng-tns-c18-58 ng-star-inserted"
      style=""
    >
      <div _ngcontent-nln-c19="" class="p-content">
        <div _ngcontent-nln-c19="" class="row">
          <p _ngcontent-nln-c19="" class="col-12 m-t-sm">
            <!-- snipped by Ch4ni -->
          </p>
        </div>
        <!---->
      </div>
    </div>
  </div></p-accordiontab
>

The div class names, and p-accordiontab tag were enough context for me to figure out that this view makes use of PrimeNG accordion widgets. I tried to figure out how to trigger the multi-select by manipulating only the top-level accordion widget, but am limited here by only looking at the code after angular has had its way with the dom.

So, to make sure I could look at all elements, I iterated through each child node of the accordionTab that I was interested in, and manually modified the attributes to render the nodes while bypassing DOM events (onClick and friends).

It would be so easy to add multi-select as an option for this display, but alas, my feature request with T-Mobile has gone unnoticed for well over a year, so … here’s the code to get around that particular limitation for anyone else who needs it.

The Code

Instructions

Copy the contents of the code block above. When visiting the T-Mobile website for pre-pay customers, perform the appropriate “activity” filtering using the web UI (I do for the month I’m looking at and choose “Billing and Payment” activity). Once satisfied, paste the code into the Developer Console, and you should see every item in the activity log expand.

… you’re welcome.