Improve APM spans (no more <anonymous>)

[timotheeg]

Problem

We have a lot of spans in APM traces which are <anonymous>. While not a deal breaker to get value out of APM, it is annoying.

The anonymous functions are due to the way some methods are declared in classes, which is done to be able to specify types.

e.g. in ReviewsRouter.ts, the assignment syntax creates anonymous methods

  compareDiff: RequestHandler<
    { siteName: string },
    { items: EditedItemDto[] } | ResponseErrorBody,
    unknown,
    unknown,
    { userWithSiteSessionData: UserWithSiteSessionData }
  > = async (req, res) => {
    // ... 
  }

while in collectionPages.js, this style of named method works:

  async updateCollectionPage(req, res, next) {
    // ...
  }

Note: The first style of method declaration (assignment) does NOT create methods on the class' prototype. The methods are created on the instance themselves at construction (and so just FYI the call to autoBind(this) are actually useless for classes which only use that style of declaration)

TODO: We should ensure that all methods we use as express route handlers are named to have nice usable traces

Solution

• Provide a utility nameAnonymousMethods() to ensure all methods of an instance and its class are named (invoked at construction)
• Update all router classes (ts files) to ensure all methods are named

Updating the Router classes was done via the script below, which was then cleaned up on commit by eslint/prettier:

grep 'autoBind(this)' $(git grep Router | grep class | grep Router | cut -d: -f1) | cut -d: -f1 | grep -v -E '.js$' | while read f; do
  echo 'import { nameAnonymousMethods } from "@root/utils/apm-utils"' > temp;
  sed -E -e 's/autoBind\(this\)/nameAnonymousMethods(this);autoBind(this)/' "${f}" >> temp;
  mv temp "${f}";
done

Verified on staging:

Tests

• Load the CMS and perform some actions, all happy paths should work
• Find a span for a Review compare, and verify the span name is compareDiff (NOT <anonymous>)

[timotheeg]

Note on this for reviewer: autoBind(this)in this file (and all the router files thathave been converted to typescript) doesn't actually do what we think it does 😑😢

When the methods are declared like this in the class:

 handleSiteLaunchFormRequest: RequestHandler<
    never,
    string,
    { data: { submissionId: string } },
    never,
    { submission: DecryptedContentAndAttachments }
  > = async (req, res) => {
   //. ...
}

then they are:

1. anonymous
2. NOT added to the class' prototype (so autoBind() will not get to them at all)
3. Added to the instance directly and bound