I have trouble in using autoComplete function in codemirror

1

Now I am using the or to Complete function in codemirror to achieve the goal of Python autoComplete but failed .

This is my code:

CodeMirror Autocomplete 
<script>
    window.onload = function() {
        // Initialize CodeMirror editor
        var editor = CodeMirror.fromTextArea(document.getElementById('code'), {
            mode: 'text/x-python', // Set mode to Python
            indentWithTabs: true,
            smartIndent: true,
            styleActiveLine: true,
            lineNumbers: true,
            lineWrapping: true,
            matchBrackets: true,
            autofocus: true,
            extraKeys: {"Ctrl-Space": "autocomplete"}, // Bind the shortcut key Ctrl+Space to trigger autocompletion
            hintOptions: {
                tables: {
                    "users": ["name", "email", "created_at"], // Hypothetical table and fields
                    "products": ["product_name", "price", "stock"]
                }
            }
        });

        // Listen for keyboard events to trigger autocompletion
        editor.on("keyup", function(cm, event) {
            if (!cm.state.completionActive &&
                ((event.keyCode >= 65 && event.keyCode <= 90) || event.keyCode == 52 || event.keyCode == 219 || event.keyCode == 190)) {
                CodeMirror.commands.autocomplete(cm, null, {completeSingle: false});
            }
        });
    };
</script>

All the links of cdn are available.
But when I type in the text area, I got no reaction.