Aetae

Тут всё плохо:

function isHappy(array){
  // записываем пустой массив в array
  // (не важно что там мы получили, теперь этого нет)
  array = [] 
  // получаем 6 переменных с значением "ничего"(undefined)
  let[x,y,z,b,n,v] = array
  // сравниваем x+y+z == b+n и выкидываем, никак не используя
  // с помощью оператора запятая(,) в if попадает только v
  // как мы знаем во всех переменных undefined - if(undefined) - ложь
  if(x+y+z == b+n,v){
    console.log(`Число ${array} - счастливое!`);
  }
  else{
    console.log(`Число ${array} - несчастливое`);
  }
}
// вызываем isHappy с аргументом 000000, который является числом 0, 
// просто записанным длинно, а не массивом
isHappy(000000)

return - это возврат из функции. После return жизни нет. Никакой. Вообще никакой. В том числе и других return.

Может стоит сначала учебник почитать, если таких базовых вещей как обращение через квадратные скобочки не знаешь?
value['key'](...args)

Нет, если бы переменная была локальная тебе бы приходила ошибка, а не пустой массив.

Проблема твоя в том, что операция запроса к базе данных - асинхронная, т.е. запрос и ответ разнесены во времени.

Сейчас твой код условно выглядит так:
1. Задали переменную, инициализировали её пустым массивом.
2. Послали запрос в базу данных.
3. Обратились к переменной - получили пустой массив.
4. Прошло некоторое время.
5. Пришёл ответ от базы данных - заполнили массив.

Изучи как работать с асинхронностью, без этого никуда.

Поставить расширение для браузера с поддержкой пользовательских скриптов, например tempermonkey и написать свой скрипт который по document-start начнёт отслеживать появление этой функции\запрос к серверу\ещё что-то в зависимости от кода, и подменит результат.

Вариантов что именно нужно сделать - такое же бесконечное множество, как и вариантов написания этой вашей функции. Тут надо смотреть на конкретный код.

Тебе надо изучить, что такое асинхронность, что такое Promise, что такое async\await. Без этого ты никуда не уедешь.

Тебе надо делать либо так: this.svg = await getFileContent(url), либо так
getFileContent(url).then(a => this.svg = a).

Promise всегда возвращает Promise. Тебе надо дождаться выполнения Promise'а тем или иным способом.
Если ты делаешь так this.svg = getFileContent(url) - конечно у тебя в this.svg лежит Promise. Этот Promise только начинает выполнение и никаких данных там нет. Данные в него прилетят возможно через час, если ты на модеме.

К Vue вопрос отношение не имеет.

Если этот компонент выше - $emit событие.
Если этот компонент ниже - через props.
Если эти компоненты широко разнесены, но всегда находятся логически в одном родителе - provide в родителе и inject в обоих комонентах.
Eсли они они связаны общей логикой - отдельный реактивный объект
Vue.observable/Vue.reactive и, соответственно, import в обоих компонентах.
И, наконец, если компоненты никак не связаны и таких ситуаций много - Vuex.)

В index.js:
import './assets/style.css';

export const Film = ({ film }: { film: IFilm ): ReactElement => {
  return <div></div>;
};

А лучше:

export const Film: React.FC<{
  film: IFilm
}> = ({ 
  film 
}) => {
  return <div></div>;
};

Никак.
Таски разные:

l = (text) => console.log(performance.now(), text) || true;

new Promise(resolve => {l('a1')&&resolve()}).then(()=> l('a2')&&'one').then(()=>l('a3')&&'two');
new Promise(resolve => {l('b1')&&resolve()}).then(()=> l('b2')&&'one').then(()=>l('b3')&&'two');

body::after {
  display: none;
  content: 'Переверни!';
  position: fixed;
  bottom: 50vh;
  right: 50vw;
  transform: translate(50%, 50%);
  z-index: 1000;
}

@media (orientation: portrait) {
  body::after {
    display: block;
  }
}

transform-origin

Лучше сразу на React. React - не Vue, он не html-совместим, придётся бессмысленно тратить время ещё и на перекорячивание.

Почему бы тебе не посмотреть в консоль?
Там вполне понятно написано в чём проблема:

Uncaught TypeError: slider is null

Почему же slider is null? Наверное потому что на странице он появится только через (1000 + 1000 + погрешность) миллисекунд, после того как ты пытаешься его получить.