Samuel Bouchet
Game developer at Lonestone game studio

Unity UI Debugging Tool - Click Occlusion Debugger

21/01/2025

Sharing a tool I made to quickly debug what's under the pointer

The debugging text indicates the full hierarchy path of the element under the pointer. The debugging text indicates the full hierarchy path of the element under the pointer.

Here's a quick tip for setting up a tool to debug what's under the pointer in Unity. This is particularly useful when a click doesn't work, and you need to know what's covering it and preventing the click.

It will display on screen the full game object hierarchy of the element under the pointer.

When set up, it looks like this:

Pointer is over Options button. The debugging text indicates the full hierarchy path of the option menu Icon.
Pointer is over Options button. The debugging text indicates the full hierarchy path of the option menu Icon.
Pointer is over subtitle element. The debugging text indicates the full hierarchy path of the subtitle text element.
Pointer is over subtitle element. The debugging text indicates the full hierarchy path of the subtitle text element.
Pointer is over the text of the Let's go button. The debugging text indicates the full hierarchy path of the text element.
Pointer is over the text of the Let's go button. The debugging text indicates the full hierarchy path of the text element.

If a click doesn't work, first ensure you've added a GraphicRaycaster to your Canvas. I might sometimes forget this step and waste time figuring out why clicks don't register, so here's a reminder—just in case.

If the issue persists, here's how to set up the tool to identify what's capturing the click raycast:

Add this script to your project:

using System.Collections.Generic;
using TMPro;
using UnityEngine;
using UnityEngine.EventSystems;

public class ClickOcclusionDebugger : MonoBehaviour {
    public TextMeshProUGUI? Text;

    void Update() {
        PointerEventData pointerData = new PointerEventData(EventSystem.current);
        pointerData.position = Input.mousePosition;

        List<RaycastResult> results = new List<RaycastResult>();
        EventSystem.current.RaycastAll(pointerData, results);

        if (Text != null) {
            if (results.Count > 0) {
                var obj = results[0].gameObject;
                var n = obj.name;
                while (obj.transform.parent != null) {
                    obj = obj.transform.parent.gameObject;
                    n = obj.name + "/" + n;
                }

                Text.text = n;
            } else {
                Text.text = "";
            }
        }
    }
}

Here's the Unity setup:

  • Create a GameObject in your Canvas.
  • Add the ClickOcclusionDebugger component.
  • Apply the "EditorOnly" tag in the inspector to ensure it doesn't ship with the build if you forget to disable it.
  • As a child, create a TextMeshPro GameObject (Create > UI > Text - TextMeshPro).
  • In the TextMeshPro inspector, click "Extra settings" and uncheck "Raycast Target".
  • In the ClickOcclusionDebugger inspector, reference the Text child element in the "Text" field.

That's it—happy UI debugging!

Find me on social networks

If you found this article helpful, check my other articles and don't forget to follow me on your favorite network for more game development tips and discussions.

Published by Samuel Bouchet.
Do you like reading SF? Try out latest game Neoproxima