This was a bit trickier than I expected, and required an additional render pass, so I created an example implementation with some explanation here: Support applying outlines to individual objects by OmarShehata · Pull Request #3 · OmarShehata/webgl-outlines · GitHub
Basically the challenge here is that if you only include the objects you want to outline in the normal & depth buffers, then the created outlines will show through objects that may be in front of it. If that’s your desired effect anyway, then great! You can stick with the same amount of render passes.
Otherwise, to make the outlines get occluded correctly, we need to create an additional render pass that creates a depth buffer that has objects that are NOT outlined, which we’ll use to depth test the outlines before rendering them.
I found it helps to look at the rendering pipeline with a screenshot of what’s the output of each step:
Happy to hear if anyone has feedback on doing this in a more optimized way would love to hear.