GitHub, geli\u015ftiriciler i\u00e7in vazge\u00e7ilmez bir platform olsa da, sorun (issue) zaman \u00e7izelgeleri bazen gereksiz veya “g\u00fcr\u00fclt\u00fcl\u00fc” olaylarla dolabilir. Atanan ki\u015filerin de\u011fi\u015fmesi, etiket eklenip \u00e7\u0131kar\u0131lmas\u0131, durum g\u00fcncellemeleri gibi otomatik bildirimler, \u00f6nemli tart\u0131\u015fmalar\u0131 veya kod de\u011fi\u015fikliklerini g\u00f6zden ka\u00e7\u0131rmam\u0131za neden olabilir. Bu makalede, bu t\u00fcr g\u00fcr\u00fclt\u00fcl\u00fc olaylar\u0131 gizleyerek daha temiz ve odaklanm\u0131\u015f bir GitHub deneyimi sunan bir Chrome uzant\u0131s\u0131n\u0131 nas\u0131l geli\u015ftirdi\u011fimizi, \u00f6zellikle de Copilot CLI’\u0131n bu s\u00fcre\u00e7teki rol\u00fcn\u00fc detayl\u0131ca inceleyece\u011fiz.<\/p>\n
GitHub sorun zaman \u00e7izelgeleri, bir sorunla ilgili t\u00fcm etkinliklerin kronolojik bir kayd\u0131n\u0131 sunar. Ancak bu kay\u0131t, bazen a\u015f\u0131r\u0131 bilgi y\u00fck\u00fcne yol a\u00e7abilir.<\/p>\n
Geli\u015ftiriciler olarak, bir sorunun \u00f6z\u00fcne inmek ve ilgili tart\u0131\u015fmalar\u0131, kod de\u011fi\u015fikliklerini veya \u00f6nemli kararlar\u0131 h\u0131zl\u0131ca g\u00f6rmek isteriz. G\u00fcr\u00fclt\u00fcl\u00fc olaylar, bu ak\u0131\u015f\u0131 bozar ve de\u011ferli bilgilerin aras\u0131nda kaybolmas\u0131na neden olur. S\u00fcrekli etiket, atama veya durum de\u011fi\u015fiklikleri, as\u0131l konudan uzakla\u015ft\u0131r\u0131r ve zaman kayb\u0131na yol a\u00e7ar.<\/p>\n
GitHub zaman \u00e7izelgesinde s\u0131k\u00e7a kar\u015f\u0131la\u015f\u0131lan ve genellikle gizlemek isteyebilece\u011fimiz olay t\u00fcrleri \u015funlard\u0131r:<\/p>\n
G\u00fcr\u00fclt\u00fcl\u00fc zaman \u00e7izelgeleri, geli\u015ftiricilerin sorunlar\u0131 anlama ve \u00e7\u00f6zme s\u00fcre\u00e7lerini yava\u015flat\u0131r. S\u00fcrekli olarak alakas\u0131z bildirimleri filtrelemek zorunda kalmak, bili\u015fsel y\u00fck\u00fc art\u0131r\u0131r ve odaklanmay\u0131 zorla\u015ft\u0131r\u0131r. Bu da genel verimlilikte d\u00fc\u015f\u00fc\u015fe ve potansiyel olarak \u00f6nemli bilgilerin g\u00f6zden ka\u00e7\u0131r\u0131lmas\u0131na yol a\u00e7abilir.<\/p>\n
Bu soruna y\u00f6nelik en pratik \u00e7\u00f6z\u00fcmlerden biri, taray\u0131c\u0131 tabanl\u0131 bir uzant\u0131 geli\u015ftirmektir. Chrome uzant\u0131lar\u0131, web sayfalar\u0131n\u0131n i\u00e7eri\u011fini an\u0131nda de\u011fi\u015ftirebilme yetene\u011fi sayesinde bu t\u00fcr bir manip\u00fclasyon i\u00e7in idealdir.<\/p>\n
Uzant\u0131m\u0131z\u0131n temel amac\u0131, GitHub sorun zaman \u00e7izelgelerindeki belirli “g\u00fcr\u00fclt\u00fcl\u00fc” olay t\u00fcrlerini otomatik olarak gizleyerek, kullan\u0131c\u0131ya daha sade ve odaklanm\u0131\u015f bir g\u00f6r\u00fcn\u00fcm sunmakt\u0131r. Hedefimiz, minimum yap\u0131land\u0131rma ile maksimum fayda sa\u011flamak ve kullan\u0131c\u0131 deneyimini iyile\u015ftirmektir.<\/p>\n
Chrome uzant\u0131s\u0131, GitHub sayfas\u0131n\u0131n Y\u00fckleme tamamland\u0131ktan sonra devreye girecek bir Uzant\u0131, kullan\u0131c\u0131n\u0131n GitHub deneyimini kesintiye u\u011fratmadan arka planda sorunsuz bir \u015fekilde \u00e7al\u0131\u015fmal\u0131d\u0131r. \u0130deal olarak, kullan\u0131c\u0131 uzant\u0131y\u0131 kurduktan sonra herhangi bir ek ayar yapmadan faydalar\u0131n\u0131 g\u00f6rmeye ba\u015flamal\u0131d\u0131r. \u0130lerleyen a\u015famalarda, hangi olaylar\u0131n gizlenece\u011fini se\u00e7ebilece\u011fi basit bir aray\u00fcz de eklenebilir.<\/p>\n Proje geli\u015ftirme s\u00fcrecinde Copilot CLI’\u0131n g\u00fcc\u00fcnden faydalanmak, \u00f6zellikle boilerplate kodlar\u0131 olu\u015fturma ve belirli g\u00f6revler i\u00e7in h\u0131zl\u0131ca kod par\u00e7ac\u0131klar\u0131 \u00fcretme konusunda b\u00fcy\u00fck avantajlar sa\u011flad\u0131.<\/p>\n Copilot CLI, terminalde do\u011fal dil komutlar\u0131 kullanarak kod ve komut sat\u0131r\u0131 \u00e7\u0131kt\u0131lar\u0131 olu\u015fturman\u0131za yard\u0131mc\u0131 olan bir yapay zeka arac\u0131d\u0131r. Bu proje i\u00e7in tercih edilmesinin ba\u015fl\u0131ca nedenleri \u015funlard\u0131:<\/p>\n Bir Chrome uzant\u0131s\u0131 i\u00e7in temel dosya yap\u0131s\u0131 \u015funlar\u0131 i\u00e7erir: <\/code><\/p>\n Bu komut, bize temel izinleri ve Copilot CLI, \u00f6zellikle Copilot CLI, belirli bir DOM elementini hedeflemek i\u00e7in do\u011fru CSS se\u00e7icisini bulmakta zorland\u0131\u011f\u0131m\u0131zda veya bir JavaScript d\u00f6ng\u00fcs\u00fc yazmam\u0131z gerekti\u011finde h\u0131zl\u0131ca \u00f6neriler sunarak geli\u015ftirme d\u00f6ng\u00fcs\u00fcn\u00fc h\u0131zland\u0131rd\u0131. K\u00fc\u00e7\u00fck kod par\u00e7ac\u0131klar\u0131n\u0131 an\u0131nda test etme ve de\u011fi\u015ftirme yetene\u011fi, hata ay\u0131klama s\u00fcrecini de kolayla\u015ft\u0131rd\u0131.<\/p>\n Her Chrome uzant\u0131s\u0131 gibi, bizim uzant\u0131m\u0131z da belirli bir mimariye ve temel bile\u015fenlere sahiptir.<\/p>\n <\/code><\/p>\n Bu script, uzant\u0131n\u0131n ana mant\u0131\u011f\u0131n\u0131 i\u00e7erir. GitHub sayfas\u0131n\u0131n DOM'una eri\u015fir, g\u00fcr\u00fclt\u00fcl\u00fc olaylar\u0131 tespit eder ve bunlar\u0131 gizler. Bu script, sayfa y\u00fcklendikten sonra \u00e7al\u0131\u015f\u0131r ve sayfa i\u00e7eri\u011findeki de\u011fi\u015fiklikleri dinleyebilir.<\/p>\n Uzant\u0131n\u0131n taray\u0131c\u0131 \u00e7ubu\u011fundaki simgesine t\u0131kland\u0131\u011f\u0131nda a\u00e7\u0131lan k\u00fc\u00e7\u00fck bir penceredir. Bu pencere, kullan\u0131c\u0131n\u0131n hangi olay t\u00fcrlerinin gizlenece\u011fini se\u00e7ebilece\u011fi veya uzant\u0131y\u0131 etkinle\u015ftirip devre d\u0131\u015f\u0131 b\u0131rakabilece\u011fi bir aray\u00fcz sunar. Bu proje i\u00e7in zorunlu olmasa da, daha karma\u015f\u0131k uzant\u0131lar i\u00e7in Bu, uzant\u0131n\u0131n en kritik teknik b\u00f6l\u00fcm\u00fcd\u00fcr. Do\u011fru DOM elementlerini hedeflemek ve onlar\u0131 etkili bir \u015fekilde gizlemek esast\u0131r.<\/p>\n \u0130lk ad\u0131m, GitHub sorun zaman \u00e7izelgesinin HTML yap\u0131s\u0131n\u0131 anlamakt\u0131r. Taray\u0131c\u0131n\u0131n Geli\u015ftirici Ara\u00e7lar\u0131 (Developer Tools) ile sayfa incelenerek, farkl\u0131 olay t\u00fcrlerinin hangi HTML etiketleri, s\u0131n\u0131flar veya veri nitelikleri (data attributes) ile temsil edildi\u011fi bulunur. \u00d6rne\u011fin, her bir zaman \u00e7izelgesi olay\u0131 genellikle belirli bir <\/code><\/p>\n Yukar\u0131daki \u00f6rnekte, \"assigned\" metnini i\u00e7eren bir ba\u015fl\u0131k elementini hedefleyebiliriz.<\/p>\n Belirlenen DOM yap\u0131s\u0131na g\u00f6re, JavaScript'te <\/code><\/p>\n Burada GitHub gibi modern web siteleri, i\u00e7eri\u011fi dinamik olarak y\u00fckleyebilir (\u00f6rne\u011fin, a\u015fa\u011f\u0131 kayd\u0131rd\u0131k\u00e7a yeni yorumlar veya olaylar g\u00f6r\u00fcn\u00fcr). Bu durumda, sayfa ilk y\u00fcklendi\u011finde \u00e7al\u0131\u015fan script'imiz, sonradan y\u00fcklenen olaylar\u0131 gizleyemez. Bu sorunu \u00e7\u00f6zmek i\u00e7in <\/code><\/p>\n Olaylar\u0131 gizlemenin en basit yolu, ilgili HTML elementinin Bir Chrome uzant\u0131s\u0131 geli\u015ftirmek, standart web geli\u015ftirme s\u00fcre\u00e7lerine benzer ad\u0131mlar i\u00e7erir, ancak taray\u0131c\u0131ya \u00f6zg\u00fc baz\u0131 farkl\u0131l\u0131klar vard\u0131r.<\/p>\n Uzant\u0131y\u0131 test etmek i\u00e7in Chrome'un uzant\u0131lar sayfas\u0131na ( Farkl\u0131 GitHub sorun sayfalar\u0131nda uzant\u0131n\u0131n do\u011fru \u00e7al\u0131\u015ft\u0131\u011f\u0131ndan emin olmak i\u00e7in \u00e7e\u015fitli senaryolar test edilmelidir. Farkl\u0131 olay t\u00fcrleri, uzun zaman \u00e7izelgeleri, dinamik olarak y\u00fcklenen i\u00e7erikler gibi durumlar kontrol edilmelidir. Hata ay\u0131klama i\u00e7in taray\u0131c\u0131n\u0131n Geli\u015ftirici Ara\u00e7lar\u0131 \u00e7ok \u00f6nemlidir. Uzant\u0131 ilk a\u015famada iyi \u00e7al\u0131\u015fsa bile, ger\u00e7ek kullan\u0131c\u0131lar\u0131n farkl\u0131 GitHub kullan\u0131m al\u0131\u015fkanl\u0131klar\u0131 ve beklentileri olabilir. Beta testleri veya erken kullan\u0131c\u0131 geri bildirimleri, hangi olaylar\u0131n ger\u00e7ekten g\u00fcr\u00fclt\u00fcl\u00fc oldu\u011funu, hangi ayarlar\u0131n kullan\u0131\u015fl\u0131 olaca\u011f\u0131n\u0131 ve performansa ili\u015fkin olas\u0131 sorunlar\u0131 anlamak i\u00e7in hayati \u00f6neme sahiptir. Bu geri bildirimler, uzant\u0131n\u0131n gelecekteki geli\u015ftirmelerine y\u00f6n verir.<\/p>\n Bu uzant\u0131 projesi, GitHub'daki g\u00fcr\u00fclt\u00fcl\u00fc olay sorununa pratik bir \u00e7\u00f6z\u00fcm sunarken, Copilot CLI'\u0131n geli\u015ftirme s\u00fcrecini nas\u0131l h\u0131zland\u0131rd\u0131\u011f\u0131n\u0131 da g\u00f6sterdi.<\/p>\n Uzant\u0131 sayesinde, GitHub sorun zaman \u00e7izelgeleri daha temiz ve okunabilir hale geldi. Geli\u015ftiriciler, \u00f6nemli bilgilere daha h\u0131zl\u0131 odaklanabiliyor ve gereksiz bildirimlerin dikkat da\u011f\u0131t\u0131c\u0131 etkisinden kurtuluyor. Copilot CLI kullan\u0131m\u0131, \u00f6zellikle ba\u015flang\u0131\u00e7 boilerplate kodlar\u0131 ve DOM manip\u00fclasyonu i\u00e7in gerekli se\u00e7icilerin h\u0131zl\u0131ca olu\u015fturulmas\u0131nda zaman kazand\u0131rd\u0131. Bu proje, Chrome uzant\u0131s\u0131 geli\u015ftirme, DOM manip\u00fclasyonu ve yapay zeka destekli geli\u015ftirme ara\u00e7lar\u0131n\u0131n entegrasyonu konular\u0131nda de\u011ferli dersler sa\u011flad\u0131.<\/p>\n Uzant\u0131 i\u00e7in gelecekte d\u00fc\u015f\u00fcn\u00fclebilecek baz\u0131 iyile\u015ftirmeler \u015funlard\u0131r:<\/p>\n Bu t\u00fcr bir uzant\u0131, a\u00e7\u0131k kaynak olarak yay\u0131nlanarak di\u011fer geli\u015ftiricilerin katk\u0131lar\u0131na a\u00e7\u0131labilir. Topluluktan gelen geri bildirimler ve katk\u0131lar, uzant\u0131y\u0131 daha g\u00fc\u00e7l\u00fc ve kullan\u0131\u015fl\u0131 hale getirebilir.<\/p>\n GitHub sorun zaman \u00e7izelgelerindeki g\u00fcr\u00fclt\u00fc, bir\u00e7ok geli\u015ftirici i\u00e7in ger\u00e7ek bir verimlilik engelidir. Bu Chrome uzant\u0131s\u0131, bu sorunu basit ama etkili bir \u015fekilde \u00e7\u00f6zerek, geli\u015ftiricilerin daha odaklanm\u0131\u015f ve keyifli bir GitHub deneyimi ya\u015famas\u0131n\u0131 sa\u011flar. Copilot CLI gibi ara\u00e7lar ise, bu t\u00fcr \u00e7\u00f6z\u00fcmlerin h\u0131zl\u0131 ve verimli bir \u015fekilde hayata ge\u00e7irilmesinde paha bi\u00e7ilmez bir destek sunar.<\/p>\n Uzant\u0131, atanan ki\u015fi de\u011fi\u015fiklikleri, etiket ekleme\/\u00e7\u0131karma, milestone de\u011fi\u015fiklikleri ve baz\u0131 durum g\u00fcncellemeleri gibi yayg\u0131n g\u00fcr\u00fclt\u00fcl\u00fc olaylar\u0131 gizlemek \u00fczere tasarlanm\u0131\u015ft\u0131r. Ayarlar arac\u0131l\u0131\u011f\u0131yla hangi olaylar\u0131n gizlenece\u011fi \u00f6zelle\u015ftirilebilir.<\/p>\n Uzant\u0131, sayfa y\u00fcklendikten sonra DOM \u00fczerinde k\u00fc\u00e7\u00fck manip\u00fclasyonlar yapar ve Hay\u0131r, Copilot CLI'\u0131 kullanmak zorunlu de\u011fildir. Uzant\u0131, manuel olarak da geli\u015ftirilebilir. Ancak Copilot CLI, \u00f6zellikle boilerplate kodlar\u0131 olu\u015fturma, DOM se\u00e7icileri bulma ve h\u0131zl\u0131 prototipleme s\u00fcre\u00e7lerinde b\u00fcy\u00fck zaman kazanc\u0131 sa\u011flar.<\/p>\n Uzant\u0131y\u0131 geli\u015ftirdiyseniz, Chrome'un uzant\u0131lar sayfas\u0131na ( Mevcut temel s\u00fcr\u00fcmde gizlenen olaylar do\u011frudan g\u00f6r\u00fcnmez. Ancak, uzant\u0131n\u0131n gelecekteki s\u00fcr\u00fcmlerinde, gizlenen olaylar\u0131 ge\u00e7ici olarak g\u00f6stermek i\u00e7in bir \"T\u00fcm\u00fcn\u00fc G\u00f6ster\" d\u00fc\u011fmesi gibi bir \u00f6zellik eklenebilir. \u015eimdilik, uzant\u0131y\u0131 devre d\u0131\u015f\u0131 b\u0131rakarak veya sayfay\u0131 yenileyerek t\u00fcm olaylar\u0131 tekrar g\u00f6rebilirsiniz.<\/p>\n","protected":false},"excerpt":{"rendered":"GitHub sorun zaman \u00e7izelgeleri, bir sorunla ilgili t\u00fcm etkinliklerin kronolojik bir kayd\u0131n\u0131 sunar. Ancak bu kay\u0131t, bazen a\u015f\u0131r\u0131 bilgi y\u00fck\u00fcne yol a\u00e7…","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"csco_page_header_type":"","csco_page_load_nextpost":"","csco_page_subscribe_form":"","csco_page_contact_form":"","footnotes":""},"categories":[1401],"tags":[],"class_list":{"0":"post-38845","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-git","7":"cs-entry","8":"cs-video-wrap"},"yoast_head":"\ncontent script<\/code> kullanacakt\u0131r. Bu script, sayfan\u0131n Belge Nesne Modeli’ni (DOM) tarayacak, belirlenen g\u00fcr\u00fclt\u00fcl\u00fc olaylar\u0131 temsil eden HTML elementlerini tespit edecek ve bunlar\u0131 CSS arac\u0131l\u0131\u011f\u0131yla gizleyecektir (\u00f6rne\u011fin, display: none;<\/code> uygulayarak).<\/p>\nKullan\u0131c\u0131 Deneyimi Beklentileri<\/h4>\n
Copilot CLI ile H\u0131zl\u0131 Prototipleme ve Geli\u015ftirme<\/h3>\n
Copilot CLI Nedir ve Neden Tercih Edildi?<\/h4>\n
\n
\u0130lk Ad\u0131mlar: Proje Yap\u0131s\u0131n\u0131 Olu\u015fturma<\/h4>\n
manifest.json<\/code>, content.js<\/code>, popup.html<\/code>, popup.js<\/code> ve iste\u011fe ba\u011fl\u0131 olarak CSS dosyalar\u0131. Copilot CLI’a “Chrome uzant\u0131s\u0131 i\u00e7in temel bir manifest.json dosyas\u0131 olu\u015ftur” veya “content script i\u00e7in boilerplate kod yaz” gibi komutlar vererek bu ba\u015flang\u0131\u00e7 dosyalar\u0131n\u0131 h\u0131zla olu\u015fturduk.<\/p>\n# Copilot CLI ile manifest.json olu\u015fturma \u00f6rne\u011fi\ngh copilot suggest \"Chrome extension manifest.json for content script that runs on github.com\"\n<\/pre>\ncontent_scripts<\/code> tan\u0131m\u0131n\u0131 i\u00e7eren bir JSON yap\u0131s\u0131 \u00f6nerecektir.<\/p>\nKod \u00dcretimi ve Otomasyon: Manifest ve Temel Scriptler<\/h4>\n
manifest.json<\/code> dosyas\u0131n\u0131 do\u011fru izinlerle (\"activeTab\"<\/code>, \"storage\"<\/code>, \"https:\/\/github.com\/*\"<\/code>) ve content_scripts<\/code> tan\u0131mlar\u0131yla olu\u015fturmada \u00e7ok yard\u0131mc\u0131 oldu. Ayr\u0131ca, GitHub DOM yap\u0131s\u0131 i\u00e7inde belirli elementleri hedeflemek i\u00e7in kullanaca\u011f\u0131m\u0131z temel JavaScript fonksiyonlar\u0131 ve CSS se\u00e7icileri i\u00e7in de \u00f6neriler ald\u0131k. \u00d6rne\u011fin, \"GitHub issue timeline'da assignee change event'ini gizlemek i\u00e7in JavaScript kodu yaz\" gibi bir komut, bize potansiyel DOM elementlerini ve gizleme mant\u0131\u011f\u0131n\u0131 sunabilirdi.<\/p>\nH\u0131zl\u0131 \u0130terasyon ve Hata Ay\u0131klama<\/h4>\n
Uzant\u0131n\u0131n Mimari Yap\u0131s\u0131 ve Temel Bile\u015fenleri<\/h3>\n
manifest.json<\/code> Dosyas\u0131: Uzant\u0131n\u0131n Kimlik Kart\u0131<\/h4>\nmanifest.json<\/code>, uzant\u0131m\u0131z\u0131n ad\u0131, s\u00fcr\u00fcm\u00fc, izinleri ve hangi scriptlerin nerede \u00e7al\u0131\u015faca\u011f\u0131n\u0131 tan\u0131mlayan merkezi bir dosyad\u0131r. \u0130\u015fte projemiz i\u00e7in \u00f6nemli baz\u0131 alanlar:<\/p>\n{\n \"manifest_version\": 3,\n \"name\": \"GitHub Timeline Temizleyici\",\n \"version\": \"1.0\",\n \"description\": \"GitHub sorun zaman \u00e7izelgelerindeki g\u00fcr\u00fclt\u00fcl\u00fc olaylar\u0131 gizler.\",\n \"permissions\": [\"storage\"],\n \"host_permissions\": [\"https:\/\/github.com\/*\"],\n \"content_scripts\": [\n {\n \"matches\": [\"https:\/\/github.com\/*\/issues\/*\"],\n \"js\": [\"content.js\"],\n \"run_at\": \"document_idle\"\n }\n ],\n \"action\": {\n \"default_popup\": \"popup.html\",\n \"default_icon\": {\n \"16\": \"icons\/icon16.png\",\n \"48\": \"icons\/icon48.png\",\n \"128\": \"icons\/icon128.png\"\n }\n }\n}\n<\/pre>\n\"host_permissions\"<\/code>, uzant\u0131m\u0131z\u0131n hangi URL'lerde \u00e7al\u0131\u015fabilece\u011fini belirtir. \"content_scripts\"<\/code> ise content.js<\/code> dosyam\u0131z\u0131n sadece GitHub sorun sayfalar\u0131nda (\/issues\/<\/code> i\u00e7eren URL'ler) \u00e7al\u0131\u015fmas\u0131n\u0131 sa\u011flar.<\/p>\ncontent.js<\/code>: GitHub Sayfas\u0131n\u0131 Manip\u00fcle Eden Kalp<\/h4>\npopup.html<\/code> ve popup.js<\/code>: Kullan\u0131c\u0131 Aray\u00fcz\u00fc ve Ayarlar<\/h4>\npopup.js<\/code> ise bu aray\u00fcz\u00fcn etkile\u015fim mant\u0131\u011f\u0131n\u0131 y\u00f6netir ve kullan\u0131c\u0131 tercihlerini Chrome'un depolama API'si (chrome.storage<\/code>) arac\u0131l\u0131\u011f\u0131yla kaydeder.<\/p>\nArka Plan Scriptleri (Opsiyonel)<\/h4>\n
background.js<\/code> dosyalar\u0131 kullan\u0131labilir. Bu scriptler, taray\u0131c\u0131 olaylar\u0131n\u0131 dinleyebilir (\u00f6rne\u011fin, sekme a\u00e7ma\/kapatma), uzun s\u00fcreli i\u015flemler yapabilir ve content script'ler ile ileti\u015fim kurabilir.<\/p>\nG\u00fcr\u00fclt\u00fcl\u00fc Olaylar\u0131 Tespit Etme ve Gizleme Mekanizmas\u0131<\/h3>\n
GitHub DOM Yap\u0131s\u0131n\u0131 \u0130nceleme<\/h4>\n
<\/p>\n\n \n \n <\/span>\n @kullanici<\/span>\n assigned <\/span>\n @baskakullanici<\/span>\n <\/h3>\n \n<\/div>\n<\/pre>\n
CSS Se\u00e7icileri ile Hedefleme<\/h4>\n
document.querySelectorAll()<\/code> metodunu kullanarak ilgili olaylar\u0131 se\u00e7eriz. \u00d6rne\u011fin, atanan ki\u015fi de\u011fi\u015fikliklerini gizlemek i\u00e7in:<\/p>\nconst noisyEvents = document.querySelectorAll('.TimelineItem-body:has(.TimelineItem-badge-text[title*=\"assigned\"])');\nnoisyEvents.forEach(event => {\n event.style.display = 'none';\n});\n<\/pre>\n:has()<\/code> pseudo-class'\u0131, belirli bir alt \u00f6\u011feye sahip olan .TimelineItem-body<\/code> \u00f6\u011felerini se\u00e7memizi sa\u011flar. Bu t\u00fcr se\u00e7iciler, g\u00fcr\u00fclt\u00fcl\u00fc olaylar\u0131 kesin olarak hedeflemek i\u00e7in \u00e7ok \u00f6nemlidir.<\/p>\nMutationObserver<\/code> Kullan\u0131m\u0131 (Dinamik Y\u00fcklemeler \u0130\u00e7in)<\/h4>\nMutationObserver<\/code> API'sini kullan\u0131r\u0131z. MutationObserver<\/code>, DOM'daki de\u011fi\u015fiklikleri (yeni elementlerin eklenmesi, kald\u0131r\u0131lmas\u0131, niteliklerin de\u011fi\u015fmesi vb.) dinlememizi sa\u011flar. Yeni bir olay elementi eklendi\u011finde, observer tetiklenir ve yeni gelen olay\u0131 da gizleme mant\u0131\u011f\u0131m\u0131za tabi tutar\u0131z.<\/p>\nconst observer = new MutationObserver(mutations => {\n mutations.forEach(mutation => {\n if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {\n mutation.addedNodes.forEach(node => {\n if (node.nodeType === 1 && node.classList.contains('TimelineItem')) {\n \/\/ Yeni eklenen TimelineItem'\u0131 kontrol et ve gizle\n if (node.querySelector('.TimelineItem-badge-text[title*=\"assigned\"]')) {\n node.style.display = 'none';\n }\n }\n });\n }\n });\n});\n\nobserver.observe(document.querySelector('.js-timeline-item-container'), { childList: true, subtree: true });\n<\/pre>\nGizleme Mant\u0131\u011f\u0131:
display: none;<\/code> veya S\u0131n\u0131f Ekleme<\/h4>\nstyle.display<\/code> \u00f6zelli\u011fini 'none'<\/code> olarak ayarlamakt\u0131r. Daha esnek bir yakla\u015f\u0131m ise, gizlenecek elementlere \u00f6zel bir CSS s\u0131n\u0131f\u0131 (\u00f6rne\u011fin, .hidden-timeline-event<\/code>) eklemek ve bu s\u0131n\u0131f i\u00e7in CSS'te display: none;<\/code> tan\u0131mlamakt\u0131r. Bu, gelecekte uzant\u0131n\u0131n stilini veya gizleme davran\u0131\u015f\u0131n\u0131 de\u011fi\u015ftirmeyi kolayla\u015ft\u0131r\u0131r.<\/p>\nUzant\u0131y\u0131 Geli\u015ftirme ve Test Etme S\u00fcreci<\/h3>\n
Geli\u015ftirici Modunda Y\u00fckleme<\/h4>\n
chrome:\/\/extensions\/<\/code>) gidilir ve \"Geli\u015ftirici modu\" etkinle\u015ftirilir. Ard\u0131ndan, \"Paketlenmemi\u015f uzant\u0131 y\u00fckle\" d\u00fc\u011fmesi kullan\u0131larak uzant\u0131 dosyalar\u0131n\u0131n bulundu\u011fu klas\u00f6r se\u00e7ilir. Bu sayede, kodda yap\u0131lan de\u011fi\u015fiklikler uzant\u0131y\u0131 yenileyerek an\u0131nda test edilebilir.<\/p>\nTest Senaryolar\u0131 ve Hata Ay\u0131klama \u0130pu\u00e7lar\u0131<\/h4>\n
console.log()<\/code> kullanarak de\u011fi\u015fken de\u011ferlerini izlemek, DOM'u incelemek ve JavaScript hatalar\u0131n\u0131 tespit etmek kritik \u00f6neme sahiptir.<\/p>\nKullan\u0131c\u0131 Geri Bildirimlerini Entegre Etme<\/h4>\n
Sonu\u00e7 ve Gelecek Geli\u015ftirmeler<\/h3>\n
Elde Edilen Faydalar ve \u00d6\u011frenilen Dersler<\/h4>\n
Potansiyel \u0130yile\u015ftirmeler ve Yeni \u00d6zellikler<\/h4>\n
\n
A\u00e7\u0131k Kaynak Toplulu\u011funa Katk\u0131<\/h4>\n
SSS (S\u0131k Sorulan Sorular)<\/h3>\n
Bu uzant\u0131 hangi GitHub olaylar\u0131n\u0131 gizleyebilir?<\/h4>\n
Uzant\u0131 performans\u0131 etkiler mi?<\/h4>\n
MutationObserver<\/code> kullanarak dinamik de\u011fi\u015fiklikleri izler. Genellikle, modern taray\u0131c\u0131larda performansa g\u00f6zle g\u00f6r\u00fcl\u00fcr bir etkisi olmaz. Ancak, \u00e7ok b\u00fcy\u00fck ve karma\u015f\u0131k GitHub sorun sayfalar\u0131nda minimal bir etki olabilir.<\/p>\nCopilot CLI'\u0131 kullanmak zorunlu mu?<\/h4>\n
Uzant\u0131y\u0131 nas\u0131l kurabilirim?<\/h4>\n
chrome:\/\/extensions\/<\/code>) giderek \"Geli\u015ftirici modu\"nu etkinle\u015ftirip \"Paketlenmemi\u015f uzant\u0131 y\u00fckle\" se\u00e7ene\u011fi ile projenizin ana klas\u00f6r\u00fcn\u00fc se\u00e7erek kurabilirsiniz. E\u011fer Chrome Web Ma\u011fazas\u0131'nda yay\u0131nlan\u0131rsa, do\u011frudan ma\u011fazadan ekleyebilirsiniz.<\/p>\nGizledi\u011fim olaylar\u0131 tekrar g\u00f6rebilir miyim?<\/h4>\n