diff --git a/.gitignore b/.gitignore
index b8fabf8..6778dbb 100644
--- a/.gitignore
+++ b/.gitignore
@@ -105,5 +105,5 @@ out.html
 .tern-port
 
 # playground of vm module
-vm.playground.js
+playground.js
 srcold/
\ No newline at end of file
diff --git a/.npmignore b/.npmignore
index 6e8c58e..c47f67a 100644
--- a/.npmignore
+++ b/.npmignore
@@ -5,5 +5,5 @@ examples/
 .eslintignore
 .prettierrc
 .prettierignore
-vm.playground.js
+playground.js
 .vscode/
\ No newline at end of file
diff --git a/package.json b/package.json
index b6d1f12..fc31e6f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "abell-renderer",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "JavaScript based Template Engine. Compiles .abell files to .html",
   "main": "src/index.js",
   "bin": {
diff --git a/src/parsers/component-parser.js b/src/parsers/component-parser.js
index ba0c5b0..2e10fd3 100644
--- a/src/parsers/component-parser.js
+++ b/src/parsers/component-parser.js
@@ -172,10 +172,10 @@ function parseComponent(
     } else if (!isCss && contentMatch[2].includes('scopedSelector')) {
       // if it is javascript then scope it by injecting scopedSelector functions
       // prettier-ignore
-      content =
-        `scopedSelector = (queryString) => document.querySelector(queryString + '[data-abell-${componentHash}]');` + // eslint-disable-line max-len
-        `scopedSelectorAll = (queryString) => document.querySelectorAll(queryString + '[data-abell-${componentHash}]');` // eslint-disable-line max-len
-         + contentMatch[2];
+      content = contentMatch[2].replace(
+        /scoped(Selector|SelectorAll)\((['"`].*?["'`])\)/g,
+        `document.query$1($2 + "[data-abell-${componentHash}]")`
+      );
     } else {
       content = contentMatch[2];
     }