add code for different wrappers on query api page

Author: alexkrolick

.vscode/markdown.code-snippets

@@ -0,0 +1,53 @@
+{
+	// Place your testing-library-docs workspace snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and 
+	// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope 
+	// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is 
+	// used to trigger the snippet and the body will be expanded and inserted. Possible variables are: 
+	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. 
+	// Placeholders with the same ids are connected.
+	// Example:
+	// "Print to console": {
+	// 	"scope": "javascript,typescript",
+	// 	"prefix": "log",
+	// 	"body": [
+	// 		"console.log('$1');",
+	// 		"$2"
+	// 	],
+	// 	"description": "Log output to console"
+	// },
+	"Multilanguage Code Block": {
+		"scope": "markdown",
+		"prefix": "docblock",
+		"body": [
+			"```html",
+			"$4",
+			"```",
+			"",
+			"<!--DOCUSAURUS_CODE_TABS-->",
+			"",
+			"<!--Native-->",
+			"```js",
+			"import { $1 } from 'dom-testing-library'",
+			"",
+			"const container = document.body",
+			"const $3 = $1(container, '$2')",
+			"```",
+			"",
+			"<!--React-->",
+			"```js",
+			"import { render } from 'react-testing-library'",
+			"",
+			"const { $1 } = render(<MyComponent />)",
+			"const $3 = $1('$2')",
+			"```",
+			"",
+			"<!--Cypress-->",
+			"```js",
+			"cy.$1('$2').should('exist')",
+			"```",
+			"",
+			"<!--END_DOCUSAURUS_CODE_TABS-->"
+		],
+		"description": "Create a Docusaurus multi-language code block"
+	}
+}