Get rid of some .innerHTML

This commit is contained in:
Eduard Kuzmenko 2023-03-10 13:36:03 +04:00
parent 523a0366b0
commit e617a5f547
29 changed files with 46 additions and 63 deletions

View File

@ -246,7 +246,7 @@ export default class AppMediaViewer extends AppMediaViewerBase<'caption', 'delet
private setCaption(message: MyMessage) {
const caption = (message as Message.message).message;
let html: Parameters<typeof setInnerHTML>[1] = '';
let html: Parameters<typeof setInnerHTML>[1];
if(caption) {
const media = getMediaFromMessage(message, true);

View File

@ -859,7 +859,7 @@ export default class AppMediaViewerBase<
const mover = this.content.mover;
if(!closing) {
mover.innerHTML = '';
mover.replaceChildren();
// mover.append(this.buttons.prev, this.buttons.next);
}
@ -1205,7 +1205,7 @@ export default class AppMediaViewerBase<
}, delay / 2);
setTimeout(() => {
mover.innerHTML = '';
mover.replaceChildren();
mover.classList.remove('moving', 'active', 'hiding');
mover.style.cssText = 'display: none;';

View File

@ -52,7 +52,7 @@ export class SearchGroup {
this.container.style.display = 'none';
if(this.clearable) {
this.list.innerHTML = '';
this.list.replaceChildren();
}
}

View File

@ -96,7 +96,7 @@ export default class AutocompleteHelper extends EventListenerBase<{
this.attach = undefined;
this.detach = undefined;
list.innerHTML = '';
list.replaceChildren();
detach();
if(this.navigationItem) {

View File

@ -59,7 +59,7 @@ export default class AutocompletePeerHelper extends AutocompleteHelper {
}
if(data.length) {
this.list.innerHTML = '';
this.list.replaceChildren();
data.forEach((d) => {
const div = AutocompletePeerHelper.listElement({
className: this.className,

View File

@ -3962,7 +3962,7 @@ export default class ChatBubbles {
bubble.className = 'bubble service';
bubbleContainer.innerHTML = '';
bubbleContainer.replaceChildren();
const s = document.createElement('div');
s.classList.add('service-msg');
if(action) {
@ -4129,7 +4129,7 @@ export default class ChatBubbles {
maxMediaTimestamp
};
const richText = messageMessage ? wrapRichText(messageMessage, richTextOptions) : '';
const richText = messageMessage ? wrapRichText(messageMessage, richTextOptions) : undefined;
let canHaveTail = true;
let isStandaloneMedia = false;

View File

@ -422,7 +422,7 @@ export default class ChatContextMenu {
icon: 'copy',
text: 'Text.Context.Copy.Username',
onClick: () => {
copyTextToClipboard(this.target.innerHTML);
copyTextToClipboard(this.target.textContent);
},
verify: () => this.isUsernameTarget,
withSelection: true
@ -430,7 +430,7 @@ export default class ChatContextMenu {
icon: 'copy',
text: 'Text.Context.Copy.Hashtag',
onClick: () => {
copyTextToClipboard(this.target.innerHTML);
copyTextToClipboard(this.target.textContent);
},
verify: () => this.target.classList.contains('anchor-hashtag'),
withSelection: true
@ -572,14 +572,14 @@ export default class ChatContextMenu {
notDirect: () => true,
localName: 'emojis'
}, {
regularText: this.sponsoredMessage?.sponsor_info,
regularText: this.sponsoredMessage?.sponsor_info ? wrapEmojiText(this.sponsoredMessage.sponsor_info) : undefined,
separator: true,
multiline: true,
onClick: () => copyTextToClipboard(this.sponsoredMessage.sponsor_info),
verify: () => !!this.sponsoredMessage.sponsor_info,
isSponsored: true
}, {
regularText: this.sponsoredMessage?.additional_info,
regularText: this.sponsoredMessage?.additional_info ? wrapEmojiText(this.sponsoredMessage.additional_info) : undefined,
separator: true,
multiline: true,
onClick: () => copyTextToClipboard(this.sponsoredMessage.additional_info),

View File

@ -60,7 +60,7 @@ export default class EmojiHelper extends AutocompleteHelper {
emojis = emojis.slice(0, 80);
if(emojis.length) {
this.list.innerHTML = '';
this.list.replaceChildren();
emojis.forEach((emoji) => {
appendEmoji(emoji, this.list, false, true);
});

View File

@ -59,7 +59,7 @@ export namespace MessageRender {
const postViewsSpan = document.createElement('span');
postViewsSpan.classList.add('post-views');
postViewsSpan.innerHTML = formatNumber(message.views, 1);
postViewsSpan.textContent = formatNumber(message.views, 1);
const channelViews = document.createElement('i');
channelViews.classList.add('tgico-channelviews', 'time-icon');

View File

@ -144,7 +144,8 @@ export default class PinnedMessageBorder {
if(this.count !== count) {
this.wrapper.className = BASE_CLASS + '-wrapper-1';
this.border.classList.remove(BASE_CLASS + '-mask');
this.wrapper.innerHTML = this.wrapper.style.cssText = '';
this.wrapper.replaceChildren();
this.wrapper.style.cssText = '';
}
return this.border;

View File

@ -49,10 +49,6 @@ export default class RepliesElement extends HTMLElement {
public render() {
const replies = this.message.replies;
/* if(this.firstChild) {
this.innerHTML = '';
} */
if(this.type === 'footer') {
let leftPart: HTMLElement;
if(this.firstElementChild) {
@ -61,7 +57,7 @@ export default class RepliesElement extends HTMLElement {
if(replies?.recent_repliers) {
if(leftPart && !leftPart.classList.contains('replies-footer-avatars')) {
this.innerHTML = '';
this.replaceChildren();
leftPart = null;
}

View File

@ -70,8 +70,7 @@ export function appendEmoji(emoji: string, container?: HTMLElement, prepend = fa
if(spanEmoji.children.length > 1) {
const first = spanEmoji.firstElementChild;
spanEmoji.innerHTML = '';
spanEmoji.append(first);
spanEmoji.replaceChildren(first);
}
if(spanEmoji.firstElementChild?.tagName === 'IMG') {

View File

@ -37,10 +37,8 @@ import wrapPeerTitle from './wrappers/peerTitle';
import wrapTopicNameButton from './wrappers/topicNameButton';
const setText = (text: Parameters<typeof setInnerHTML>[1], row: Row) => {
// fastRaf(() => {
setInnerHTML(row.title, text || '');
setInnerHTML(row.title, text || undefined);
row.container.style.display = text ? '' : 'none';
// });
};
export default class PeerProfile {

View File

@ -354,7 +354,7 @@ export default class PollElement extends HTMLElement {
const time = Date.now();
const percents = (closeTime - time) / period;
const timeLeft = (closeTime - time) / 1000 + 1 | 0;
timeLeftDiv.innerHTML = toHHMMSS(timeLeft);
timeLeftDiv.textContent = toHHMMSS(timeLeft);
if(timeLeft <= 5) {
timeLeftDiv.style.color = '#ee545c';
@ -368,7 +368,7 @@ export default class PollElement extends HTMLElement {
if(time >= closeTime) {
clearInterval(this.quizInterval);
timeLeftDiv.innerHTML = '';
timeLeftDiv.replaceChildren();
// @ts-ignore
circle.style.strokeDashoffset = circumference;
this.quizInterval = 0;

View File

@ -22,7 +22,7 @@ export type PopupPeerOptions = Omit<PopupOptions, 'buttons' | 'title'> & Partial
titleLangKey: LangPackKey,
titleLangArgs: any[],
noTitle: boolean,
description: string | DocumentFragment,
description: Parameters<typeof setInnerHTML>[1],
descriptionLangKey: LangPackKey,
descriptionLangArgs: any[],
buttons: Array<PopupPeerButton>,

View File

@ -132,8 +132,7 @@ export default class PrivacySection {
takeOut: (newPeerIds) => {
_peerIds.length = 0;
_peerIds.push(...newPeerIds);
exception.row.subtitle.innerHTML = '';
exception.row.subtitle.append(...this.generateStr(this.splitPeersByType(newPeerIds)));
exception.row.subtitle.replaceChildren(...this.generateStr(this.splitPeersByType(newPeerIds)));
},
selectedPeerIds: _peerIds
});
@ -161,7 +160,7 @@ export default class PrivacySection {
arr.push(...from.chats.map((id) => id.toPeerId(true)));
this.peerIds[k] = arr;
const s = this.exceptions.get(k).row.subtitle;
s.innerHTML = '';
s.replaceChildren();
s.append(...this.generateStr(from));
});
}
@ -224,7 +223,7 @@ export default class PrivacySection {
const caption = this.options.captions[this.type];
const captionElement = this.radioSection.caption;
if(!caption) {
captionElement.innerHTML = '';
captionElement.replaceChildren();
} else if(caption instanceof HTMLElement) {
replaceContent(captionElement, caption);
} else {

View File

@ -36,7 +36,7 @@ export function setButtonLoader(elem: HTMLButtonElement, icon = 'check') {
putPreloader(elem);
return () => {
elem.innerHTML = '';
elem.replaceChildren();
elem.classList.add('tgico-' + icon);
elem.removeAttribute('disabled');
};

View File

@ -256,7 +256,7 @@ export class AppSidebarLeft extends SidebarSlider {
});
const t = document.createElement('span');
t.classList.add('btn-menu-footer-text');
t.innerHTML = 'Telegram Web' + App.suffix + ' '/* ' alpha ' */ + App.versionFull;
t.textContent = 'Telegram Web' + App.suffix + ' '/* ' alpha ' */ + App.versionFull;
btnMenuFooter.append(t);
btnMenu.classList.add('has-footer');
btnMenu.append(btnMenuFooter);
@ -549,7 +549,7 @@ export class AppSidebarLeft extends SidebarSlider {
});
searchSuper.load(true);
helper.innerHTML = '';
helper.replaceChildren();
searchSuper.nav.classList.remove('hide');
if(!value) {
}

View File

@ -68,7 +68,7 @@ export default class AppAddMembersTab extends SliderSuperTab {
}
this.nextBtn.classList.add('tgico-arrow_next');
this.nextBtn.innerHTML = '';
this.nextBtn.replaceChildren();
this.nextBtn.disabled = false;
this.nextBtn.classList.toggle('is-visible', this.skippable);
}

View File

@ -74,12 +74,9 @@ export default class AppBlockedUsersTab extends SliderSuperTab {
if(user.pFlags.bot) {
dom.lastMessageSpan.append('@' + username);
} else {
if(user.phone) dom.lastMessageSpan.innerHTML = formatUserPhone(user.phone);
if(user.phone) dom.lastMessageSpan.textContent = formatUserPhone(user.phone);
else dom.lastMessageSpan.append(username ? '@' + username : getUserStatusString(user));
}
// dom.titleSpan.innerHTML = 'Raaid El Syed';
// dom.lastMessageSpan.innerHTML = '+1 234 567891';
};
for(const peerId of this.peerIds) {

View File

@ -10,23 +10,16 @@ import CheckboxField from '../../checkboxField';
import RadioField from '../../radioField';
import rootScope from '../../../lib/rootScope';
import {IS_APPLE, IS_SAFARI} from '../../../environment/userAgent';
import Row, {CreateRowFromCheckboxField} from '../../row';
import Row from '../../row';
import AppBackgroundTab from './background';
import I18n, {i18n, LangPackKey, _i18n} from '../../../lib/langPack';
import I18n, {LangPackKey, _i18n} from '../../../lib/langPack';
import {attachClickEvent} from '../../../helpers/dom/clickEvent';
import assumeType from '../../../helpers/assumeType';
import {BaseTheme, MessagesAllStickers, StickerSet} from '../../../layer';
import LazyLoadQueue from '../../lazyLoadQueue';
import PopupStickers from '../../popups/stickers';
import {BaseTheme} from '../../../layer';
import eachMinute from '../../../helpers/eachMinute';
import {SliderSuperTabEventable} from '../../sliderTab';
import IS_GEOLOCATION_SUPPORTED from '../../../environment/geolocationSupport';
import AppQuickReactionTab from './quickReaction';
import wrapEmojiText from '../../../lib/richTextProcessor/wrapEmojiText';
import {DEFAULT_THEME, State} from '../../../config/state';
import wrapStickerSetThumb from '../../wrappers/stickerSetThumb';
import wrapStickerToRow from '../../wrappers/stickerToRow';
import SettingSection, {generateSection} from '../../settingSection';
import {generateSection} from '../../settingSection';
import {ScrollableX} from '../../scrollable';
import wrapStickerEmoji from '../../wrappers/stickerEmoji';
import {Theme} from '../../../layer';

View File

@ -265,9 +265,8 @@ export default class AppPrivacyAndSecurityTab extends SliderSuperTabEventable {
const disallowLength = details.disallowPeers.users.length + details.disallowPeers.chats.length;
const allowLength = details.allowPeers.users.length + details.allowPeers.chats.length;
row.subtitle.innerHTML = '';
const s = i18n(langKey);
row.subtitle.append(s);
row.subtitle.replaceChildren(s);
if(disallowLength || allowLength) {
row.subtitle.append(` (${[-disallowLength, allowLength ? '+' + allowLength : 0].filter(Boolean).join(', ')})`);
}

View File

@ -111,7 +111,7 @@ export default class AppChatTypeTab extends SliderSuperTabEventable {
this.managers.appProfileManager.getChatInviteLink(this.chatId, true).then((link) => {
toggle();
linkRow.title.innerHTML = link;
linkRow.title.textContent = link;
// revoked = true;
// onChange();
});

View File

@ -113,9 +113,8 @@ export default class AppEditContactTab extends SliderSuperTab {
const profileNameDiv = document.createElement('div');
profileNameDiv.classList.add('profile-name');
profileNameDiv.append(new PeerTitle({
peerId: peerId
peerId
}).element);
// profileNameDiv.innerHTML = 'Karen Stanford';
const profileSubtitleDiv = document.createElement('div');
profileSubtitleDiv.classList.add('profile-subtitle');

View File

@ -79,7 +79,7 @@ export default class AppGifsTab extends SliderSuperTab {
public onCloseAfterTimeout() {
this.reset();
this.gifsDiv.innerHTML = '';
this.gifsDiv.replaceChildren();
animationIntersector.checkAnimations(undefined, ANIMATIONGROUP);
this.inputSearch.remove();
return super.onCloseAfterTimeout();
@ -110,7 +110,7 @@ export default class AppGifsTab extends SliderSuperTab {
this.searchPromise = null;
this.nextOffset = next_offset;
if(newSearch) {
this.gifsDiv.innerHTML = '';
this.gifsDiv.replaceChildren();
}
if(results.length) {

View File

@ -91,7 +91,7 @@ export default class AppStickersTab extends SliderSuperTab {
}
public onCloseAfterTimeout() {
this.setsDiv.innerHTML = '';
this.setsDiv.replaceChildren();
animationIntersector.checkAnimations(undefined, 'STICKERS-SEARCH');
return super.onCloseAfterTimeout();
}

View File

@ -6,7 +6,7 @@
export default function replaceContent(elem: HTMLElement, node: string | Node) {
if(typeof(node) === 'string') {
elem.innerHTML = node;
elem.textContent = node;
return;
}

View File

@ -10,7 +10,7 @@ export default function setInnerHTML(elem: Element, html: string | DocumentFragm
setDirection(elem);
if(typeof(html) === 'string') {
if(!html) elem.replaceChildren();
else elem.innerHTML = html;
else elem.textContent = html;
} else {
elem.replaceChildren(html);
}

View File

@ -312,14 +312,16 @@ export default class VideoPlayer extends ControlsHover {
}
protected setBtnMenuToggle() {
const buttons: Parameters<typeof ButtonMenuSync>[0]['buttons'] = VideoPlayer.PLAYBACK_RATES.map((rate, idx) => {
return {
const buttons = VideoPlayer.PLAYBACK_RATES.map((rate, idx) => {
const buttonOptions: Parameters<typeof ButtonMenuSync>[0]['buttons'][0] = {
// icon: VideoPlayer.PLAYBACK_RATES_ICONS[idx],
regularText: rate + 'x',
onClick: () => {
appMediaPlaybackController.playbackRate = rate;
}
};
return buttonOptions;
});
const btnMenu = ButtonMenuSync({buttons});
btnMenu.classList.add('top-left');