[serialize]: Convert to Typescript

[danilofuchs]

What:

Migrates the serialize package to Typescript. This was not that simple as the internal functions deal with a large variety of possible types for each argument (Interpolation), and some were undocumented.

Why:

Part of #2358

How:

• Convert Flow type annotations
• Copy .d.ts definitions to main file
• Fix whatever breaks

Checklist:

• Documentation
• Tests
• Code complete
• Changeset

[changeset-bot]

🦋 Changeset detected

Latest commit: 62719e2

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@emotion/serialize	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[danilofuchs]

Note: This isn't finished just yet, some tests are still breaking and it's missing the changeset

[danilofuchs]

I rewrote this string interpolation as semantic coloring broke on VSCode due to the complex ' and ` usage

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 62719e2:

Sandbox	Source
Emotion	Configuration

[danilofuchs]

Hi @Andarist, I've updated the PR with the requested changes. I made sure no runtime code changes were made.

However, some tests are now breaking. Apparently Interpolation could also be a Symbol. When adding it to the interoplated string, if throws a TypeError. Specifically, Symbol(react.forward_ref).

Perhaps something in the old Flow build output is now different, causing this unexpected bug. Either way, the code seems to not expect a Symbol value at all, and will break if called with it.

Should we apply a patch on the main branch before migrating to TS?

[danilofuchs]

I used the same comment from the original Flow code

[codecov]

Codecov Report

Merging #2543 (62719e2) into ts-migration (17fee4b) will increase coverage by 0.01%.
The diff coverage is 100.00%.

Impacted Files	Coverage Δ
packages/serialize/src/index.ts	100.00% <100.00%> (ø)

[Andarist]

@danilofuchs the code looks OK (i've pushed some additional, minor, changes but they were mostly nits) but some type tests are failing. I've looked briefly into failing tests for @emotion/serialize and I'm pretty sure that this is caused by older TS versions being tripped on import/export type syntax.

The problem is that we need this syntax because we compile stuff with isolatedModules. I've tried changing the minimal TS version header for this package but it turns out that we are using very old version of dtslint and it only supports up to TS 3.4 and that syntax has been introduced in 3.8 🙈

I recall that I've tried to upgrade dtslint like a year ago or something and I've bumped into some problems, didn't have enough time to dig into this back then but I guess I might have to do that after all.