How do I render cesium scene to VR headset screen?

I’m trying to make the scene displayed on my HTC VIVE VR headset using WebXR API. I’ve searched the forum and the internet and the solution I got all seems outdated.
Here are part of my code

function initVR() {
var gl = viewer.scene.context._gl;
navigator.xr.requestSession('immersive-vr').then((xrSession) => {
xrSession.requestReferenceSpace("local-floor").then((xrReferenceSpace) => {  
    const xrWebGLLayer = new XRWebGLLayer(xrSession, gl,)
    xrSession.updateRenderState({ baseLayer: xrWebGLLayer })
    xrSession.requestAnimationFrame(animate)
    function animate() {
        xrSession.requestAnimationFrame((time, xrFrame) => {
             let poses = xrFrame.getViewerPose(xrReferenceSpace);
              // gl.clearColor(1,0,1,1)
               gl.bindFramebuffer(gl.FRAMEBUFFER, xrSession.renderState.baseLayer.framebuffer);
                // **draw call here**
                viewer.scene.render()
                 for (let xrView of poses.views) {
                        let xrViewport = xrWebGLLayer.getViewport(xrView);
                         gl.viewport(xrViewport.x, xrViewport.y, xrViewport.width, xrViewport.height);
                  }
                 animate()
             });
         }
       }).catch((err) => {
          console.log(err)
       });
       }).catch((err) => {
          console.log(err)
        });
 }

I wrote a demo using raw webgl where i call gl.clear and gl.drawArrays in the xrSession.requestAnimationFrame callback function and it works fine. But when I replace them with cesium’s render method, the headset screen only shows the clear color I set with gl.clearColor and nothing else.
Currently I only need to make the scene shown on the headset screen. What should I do to achieve this?