Add className option for marks

[RLesser]

see #1002 (and related discussions).

fixes #1002

I believe with this implementation className will be an option on all marks.

Open questions

• Other capabilities that should be tested?
• Should the two maybeClassName functions be combined in a cleaner way?

[RLesser]

Looks like the jobs are failing due to a checkout issue? lmk if I need to construct my pull request differently.

[Fil]

Do the tests pass locally?

[Fil]

I would change the logic a bit, instead of introducing a new function maybeClassNameOptional (which is a bit redundant), I would instead add a second parameter to maybeClassName(name, provide) and have plot, ramp, and swatches, call it with provide = true.

[espinielli]

This seems interesting.
My use case would be for a Plot.image marks where I could define a border via CSS to the their class of using something like:

.my_image {
    outline: 6px solid white;
}

Looking forward to some progress ;-)

[RLesser]

@Fil updated with new logic. Tests pass, but something about the prettier action is failing due to "A branch or tag with the name 'add-className-option-for-marks' could not be found". Not sure why that is.

[RLesser]

@Fil, I think there might be an issue with users who aren't @Fil or @mbostock getting their pull requests past the prettier check.

I'm getting a Error: A branch or tag with the name 'add-className-option-for-marks' could not be found for that check.

I looked back thru past runs of that action and found that the two most recent times that other's have put up pull requests similar things have happened:

Do you think it might be a permission issue? Is there some other way I should be creating the branch or pull request?

[mbostock]

The Prettier issues are almost certainly a problem with our GitHub workflow, likely these lines:

plot/.github/workflows/prettier.yml

Lines 14 to 18 in a946fd9

	with:
	# Make sure the actual branch is checked out when running on pull requests
	ref: ${{ github.head_ref }}
	# This is important to fetch the changes to the previous commit
	fetch-depth: 0

I’m not sure why we have a separate workflow for Prettier given that ES Lint is already run as part of the main workflow here:

plot/.github/workflows/node.js.yml

Lines 27 to 28 in a946fd9

	echo ::add-matcher::.github/eslint.json
	yarn run eslint . --format=compact

We should investigate consolidating the Prettier checks into the main workflow. #1227

[jcolot]

In the meantime, an easy way to do this is by using the new render option, an example here: https://observablehq.com/@jcolot/observable-plot-adding-classes-to-marks

[RLesser]

@Fil do you view this as still worth getting on? If so I can clean up the conflicts and get it ready for review.

[Fil]

Yes, I still think it would be a useful feature. Thanks!

[mbostock]

I’m going to tweak how this is implemented, but the functionality looks right. 👍

Redesigned maybeClassName