Xcode – Unexpected CAShapeLayer behavior when added to custom UICollectionViewCell

I’ve been trying to figure this out for a while, but I’ve exhausted my search. I’ve been trying to add a CAShapeLayer to a custom UICollectionViewCell, but it either doesn’t get drawn or only gets drawn sometimes. I’ve decided to simplify the problem I’m having to its bare bones with the following code:

class ViewController: UICollectionViewController, UICollectionViewDelegateFlowLayout {
    
    let cellId = "cell"
    let dataSource: [UIColor] = [.blue, .purple, .brown, .green, .red]

    override func viewDidLoad() {
        super.viewDidLoad()
        collectionView.isPagingEnabled = true
        collectionView.register(CellSubclass.self, forCellWithReuseIdentifier: cellId)
    }
    
    override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return dataSource.count
    }
    
    override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: cellId, for: indexPath) as! CellSubclass
        cell.backgroundColor = dataSource[indexPath.item]
        return cell
    }
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CGSize(width: view.frame.width, height: view.frame.height)
    }
}

class CellSubclass: UICollectionViewCell {
    
    let circle = CAShapeLayer()
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        circle.frame = bounds

        let circleCenter = self.center
        let path = UIBezierPath(arcCenter: circleCenter, radius: 100, startAngle: 0, endAngle: 2*CGFloat.pi, clockwise: true)
        circle.path = path.cgPath
        circle.fillColor = UIColor.gray.cgColor
        layer.addSublayer(circle)
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

I have the following flow layout for the UICollectionViewController

let layout = UICollectionViewFlowLayout()
layout.scrollDirection = .horizontal
layout.minimumLineSpacing = 0
let home = ViewController(collectionViewLayout: layout)

Based on other StackOverflow questions I’ve seen, people recommend taking the approach of adding the shape sublayer to the custom UICollectionViewCell when it’s init’d like I’ve done. However, when I run this code, I get the following output:

Any help with understanding how to fix this behavior so that each instance of the custom cells gets its own shape would be most appreciated.