Если правильно понял, то поможет экранирование: "\" перед "проблемным" символом

Смастерил регулярку:

'строка'.replace(/[\[\]\(\)\/\.\$\*\+\|\^]/g,'\\$&'); // v3.0

этот relase позволяет заэкранировать все спец. символы регулярных выражений в строке.
Баг: неадекватно реагирует на "\"

попробуйте теперь так:

const text = ':)test'
const reg = new RegExp(text.replace(/[\[\\\\/^\$\.\|\?\*\+\(\)\]]/g,'\\$&'), 'g'),

Можно через flex-box:
поместить этот блок в еще один блок, который растянут во весь экран

#родитель{
position:fixed; left:0; top:0;
width:100vw; height:100vh;
display:flex;
justify-content:center;
align-items:center;
}

Переписать код