Improve diffing of styles containing "visibility": "visible"

[lucaswoj]

When I execute this code:

const style = {
    version: 8,
    sources: {},
    layers: [{id: 'background', layout: {visibility: 'visible'}]
}
const map = new Map({style, ...});
map.setStyle(style)

I expect setStyle to do a diff-based update which reduces to a no-op.

However what actually happens is that it produces a ['setLayoutProperty', 'visibility', null] command because we store visibility: 'visible' the same way as visibility: undefined and always serialize into the latter. map.getStyle().layers[0].layout.visibility is undefined.

It is expensive to run a large number of ['setLayoutProperty', 'visibility', null] commands.

Other properties do not behave like this. Visibility is a special case.

This PR correctly stores and serializes the state of visibility into either visible or undefined.

This may fix #7459
This may fix #7648

Launch Checklist

• briefly describe the changes in this PR
• write tests for all new functionality
• manually test the debug page

[lucaswoj]

All callsites that use the visibility property check it as .visibility !== 'none' so this change should be okay.

[asheemmamoowala]

👋 @lucaswoj

[lucaswoj]

I think I’ve fixed this in a subsequent commit. Or I misunderstand. There’s a test that ensures it can be set to “visible”.

[asheemmamoowala]

You're right, I was viewing a single commit instead of all the changes.

[lucaswoj]

Thanks @asheemmamoowala! I think you need to press the big green button 😄.