Пользовательская переменная JavaScript в GTM возвращает undefined вместо значения атрибута

Оффтоп javascript
1

Проблема с получением значения атрибута через GTM переменную

Уже несколько дней пытаюсь разобраться с этой проблемой. На странице есть такая структура:

<div class="content-block">
<span class="document document--type-pdf document--pdf-format icon-style">
<div class="document-details mobile-center"><span class="doc-icon"><span class="icon fa fa-file-pdf main-color" aria-hidden="true"></span></span><div class="content-holder"><span class="document-title">report-2023.pdf</span><span class="document-size">156.22 KB</span></div></div>
<span class="download-section"><a href="/files/get/2023/456789" class="btn-download" file-title="Vietnam War Analysis Report" file-id="456789" file-format="PDF" subject-area="History" category-type="">Скачать</a>
</span></span></div>

Моя пользовательская переменная выглядит так:

function() {
    return document.querySelector('.btn-download').getAttribute('file-title').text();
}

Хочу создать переменную которая будет получать название файла когда пользователь нажимает на кнопку скачивания. Сам клик трекинг настрою отдельно но сейчас функция возвращает только undefined вместо нужного значения.

Подскажите пожалуйста в чем может быть проблема?

2

Скорее всего проблема в том, что переменная вызывается не в контексте клика. В GTM пользовательские переменные срабатывают с триггером, но элемент может быть не в фокусе. Попробуй {{Click Element}} или создай переменную, которая ищет атрибут от кликнутого элемента: return {{Click Element}}.getAttribute('file-title'). Надежнее чем querySelector.

3

Еще одна причина - элемент может быть в iframe или загружаться динамически. Попробуй сначала проверить, существует ли элемент: var element = document.querySelector('.btn-download'); return element ? element.getAttribute('file-title') : null; И проверь в GTM preview, что элемент точно есть на странице, когда код выполняется.

4

У тебя лишний .text() в конце - getAttribute уже возвращает строку. Попробуй просто return document.querySelector(‘.btn-download’).getAttribute(‘file-title’); Или элемент ещё не загрузился когда код выполняется - проверь в консоли работает ли селектор.