Safari MCP

Güncelleme: Safari 27 ve Safari Technology Preview 247 sürümleriyle birlikte, web geliştiricileri için bir Model Context Protocol sunucusu olan Safari MCP sunucusunu tanıtıyoruz. Bu sunucu, web geliştirme ve hata ayıklama iş akışınızı daha hızlı ve daha güçlü hale getirir. Aracıların kodlama sürecine giderek daha fazla entegre olduğunu biliyoruz ve Safari MCP sunucusu, aracınızı bir Safari tarayıcı penceresine bağlayarak kodunuzun tarayıcıda gerçekte nasıl görüntülendiğini bilmesini sağlar.

MCP uyumlu herhangi bir istemci Safari MCP sunucusuna bağlanabilir. Aracınızı bir Safari tarayıcı penceresine bağlayarak, aracınız kullanıcılarınızın deneyimlediklerini simüle edebilir ve DOM erişimi, ağ istekleri, ekran görüntüleri ve konsol çıktısı gibi daha özerk hata ayıklaması için ihtiyaç duyduğu bilgileri elde edebilir.

Bu, hata ayıklama sürecinizi hızlandırır ve terminalinizin konforunda kalmanızı sağlar; bu da kodunuzda hata ayıklamak için pencere değiştirme ve komut yazma turlarının azalması anlamına gelir.

Kullanım alanları

Web için geliştirme yapıyorsanız, hata ayıklama dansını bilirsiniz. Genellikle şöyle ilerler:

Sitenizde tarayıcıda yanlış bir şey görürsünüz. Onu bulmak için konsolu açarsınız. Stiller sekmesine tıklarsınız. Neyin bozuk olduğunu görürsünüz. Düzeltmek için kodunuza geri dönersiniz. Ya da bir ekran görüntüsü alır, sorunu aracınıza detaylandırır ve düzeltmeyi ona bırakırsınız. Umarız doğru yapar, hata düzeltilir ve devam edebilirsiniz.

Ancak düzeltilmediğinde, iş akışını tekrar yaşarsınız — Tarayıcı. Komut. Aracı.

Ve tekrar tekrar, sonunda hatayı ezene kadar.

Hangi tarayıcıyı veya aracı kullanırsanız kullanın, hata ayıklama iş akışı tek bir düzeltme yapmak için çok sayıda tıklama, araç ve pencere değiştirme gerektirir, ancak böyle olmak zorunda değil. Geliştirme iş akışınızda zaten aracılar kullanıyorsanız, Safari MCP sunucusu hata ayıklamanızı daha hızlı ve daha verimli hale getirir.

Safari MCP sunucusu, aracınızın kendi başına daha fazla hata ayıklama ve sorun giderme yapmasını sağlar. İşte yardımcı olabileceği birkaç örnek:

Safari'de web geliştirme. Safari'de bir sonraki geliştirme yaptığınızda, yükseltilmiş bir iş akışından yararlanırsınız. Aracınız zaten kodunuzda size yardımcı oluyor, şimdi kodunuzun Safari'de gerçekte nasıl görüntülendiğini kontrol ederek daha da fazlasını yapabilir.

Safari ile uyumluluğu artırın. Yalnızca bir tarayıcıda test etmek, diğerinde potansiyel hataların gözden kaçması anlamına gelir ve bu kullanıcılara vasat bir deneyim sunar. Safari MCP sunucusu ile aracınız sitenizi Safari'de açabilir, hesaplanan stilleri inceleyebilir, düzeni kontrol edebilir ve pencere değiştirmeden beklediğinizle karşılaştırabilir.

Performansı analiz edin. Sitenizin hangi bölümlerinin yavaşlamaya neden olduğunu görün. Safari MCP sunucusu, aracınızın sayfadaki JavaScript'i değerlendirmesine ve gezinme zamanlaması ile kaynak yükleme süreleri gibi performans metriklerini ortaya çıkarmasına olanak tanır; böylece sitenizi neyin yavaşlattığını belirleyebilir ve doğru düzeltme üzerinde çalışabilir.

Erişilebilirliği kontrol edin. Safari MCP sunucusu, aracınızın eksik etiketler, hatalı ARIA öznitelikleri ve zayıf kontrast gibi yaygın erişilebilirlik sorunlarını kontrol etmesini sağlar; böylece kullanıcılarınızı etkileyen sorunları yakalayabilirsiniz.

Herhangi bir kullanıcı durumunu doğrulayın. Sayfanın çalıştığını ve olması gerektiği gibi göründüğünü bilin. Aracınız formun durumunu kontrol edebilir, bir seçici kullanarak bir öğeyi sorgulayabilir, belirli etkileşimleri doğrulayabilir, ödeme akışının farklı durumlarını gösterebilir ve daha fazlasını yapabilir. Bu manuel kontrollere daha az zaman harcayın ve aracın bunu sizin için yapmasını sağlayın.

Bunlar kullanım alanlarından sadece birkaçı. Nasıl uygulamaya karar verirseniz verin, Safari MCP sunucusu aracınızın sizin için daha fazlasını yapmasına ve web geliştirmenin sıklıkla gerektirdiği tüm gidiş gelişleri azaltmasına yardımcı olur. Daha kolay bir iş akışı, daha fazla hatanın giderilmesi, daha mutlu kullanıcılar ve daha iyi bir ürün anlamına gelir.

Araçlar

İşte mevcut araçlar ve ne yaptıkları:

Araç	Açıklama
browser_console_messages	Geçerli veya belirtilen sekme için arabelleğe alınmış konsol günlüklerini döndürür
browser_dialogs	Tarayıcı iletişim kutularını listeler ve yanıtlar (kabul et, reddet veya JS istemleri için metin girişi)
close_tab	Bir tarayıcı sekmesini tanıtıcısına göre kapatır
create_tab	İsteğe bağlı olarak bir URL yükleyerek yeni bir tarayıcı sekmesi oluşturur
evaluate_javascript	Sayfa içinde JavaScript kodunu çalıştırır ve sonucu döndürür
get_network_request	Kaydedilmiş tek bir ağ isteği için tam ayrıntıyı alır (başlıklar, gövde, zamanlama)
get_page_content	Bir sayfanın metin içeriğini çeşitli biçimlerde çıkarır (markdown, HTML, JSON vb.)
list_network_requests	Geçerli sekme için ağ isteği özetlerini listeler (URL, yöntem, durum, zamanlama)
list_tabs	Tüm açık tarayıcı sekmelerini tanıtıcıları ve URL'leriyle listeler
navigate_to_url	Bir URL'ye gider ve yüklenen sayfanın içeriğini döndürür
page_info	Geçerli sayfa hakkında bilgi alır: URL, başlık ve yükleme durumu
page_interactions	DOM etkileşimlerini sırayla gerçekleştirir: tıklama, yazma, kaydırma, üzerine gelme, tuş basma vb.
screenshot	Geçerli sayfanın PNG olarak ekran görüntüsünü yakalar
set_emulated_media	Duyarlı tasarım testi için bir CSS medya türünü (ör. "print") öykünür
set_viewport_size	Tarayıcı görünüm alanı boyutunu CSS piksel cinsinden ayarlar
switch_tab	Tanıtıcısına göre farklı bir tarayıcı sekmesine geçer
wait_for_navigation	Geçerli sayfanın yüklenmesinin bitmesini bekler; son URL'yi ve başlığı döndürür

Safari MCP sunucusu ile artık tarayıcıda deneyimlediklerinizi aracınıza dikkatlice anlatan mükemmel komutu yazmak zorunda değilsiniz. Aracınıza kendi başına öğrenme yeteneği verebilirsiniz.

Nasıl başlanır

Safari 27

Öncelikle Safari 27 sürümünü yüklemeniz gerekecek. Kurulduktan sonra, web geliştirici özelliklerini ve uzaktan otomasyonu etkinleştirdiğinizden emin olun. Web geliştiricileri için özellikleri etkinleştirmek için Safari > Ayarlar > Gelişmiş > "Web geliştiricileri için özellikleri göster" onay kutusunu işaretleyin. Ardından Safari > Ayarlar > Geliştirici > "Uzaktan otomasyona ve harici aracılara izin ver" seçeneğini işaretleyin.

Claude kullanıyorsanız, terminalinizde aşağıdaki komutu kullanabilirsiniz:

claude mcp add safari-mcp -- "/usr/bin/safaridriver" --mcp

Codex kullanıyorsanız, terminalinizde aşağıdaki komutu kullanabilirsiniz:

codex mcp add safari-mcp -- "/usr/bin/safaridriver" --mcp

Diğer aracılar için, aşağıdakileri mcp.json veya config.json dosyanıza ekleyebilirsiniz.

{
  "mcpServers": {
    "safari-mcp": {
      "command": "/usr/bin/safaridriver",
      "args": ["--mcp"]
    }
  }
}

Safari Technology Preview

Öncelikle Safari Technology Preview sürümünü yüklemeniz gerekecek. Kurulduktan sonra, Safari Ayarlar > Gelişmiş > Web geliştiricileri için özellikleri göster seçeneğini etkinleştirdiğinizden emin olun. Ardından Safari Ayarlar > Geliştirici > Uzaktan otomasyonu ve harici aracıları etkinleştirin.

Claude kullanıyorsanız, terminalinizde aşağıdaki komutu kullanabilirsiniz:

claude mcp add safari-mcp-stp -- "/Applications/Safari Technology Preview.app/Contents/MacOS/safaridriver" --mcp

Codex kullanıyorsanız, terminalinizde aşağıdaki komutu kullanabilirsiniz:

codex mcp add safari-mcp-stp -- "/Applications/Safari Technology Preview.app/Contents/MacOS/safaridriver" --mcp

Diğer aracılar için, aşağıdakileri mcp.json veya config.json dosyanıza ekleyebilirsiniz:

"safari-mcp-stp": {
  "command": "/Applications/Safari Technology Preview.app/Contents/MacOS/safaridriver",
  "args": ["--mcp"] 
}

Yukarıdaki kodlar sunucuyu safari-mcp-stp olarak adlandırsa da, istediğiniz gibi adlandırabilirsiniz, hatta sadece safari bile. Safari MCP sunucusunu kurduktan sonra, aşağıdaki komutlardan birini deneyin:

Find bugs on my site in Safari

How accessible is my site in Safari?

See how my website performs in Safari

Her aracı biraz farklı çalışsa da, Safari MCP sunucusunu açıkça kullanması söylenmesine gerek yoktur — kendi başına çözecektir. Yukarıdakiler gibi basit komutlar MCP'yi başlatmak için yeterlidir.

Safari MCP sunucusunu kullanan bir aracıyla bir konuşmanın nasıl ilerleyebileceği aşağıda verilmiştir:

Siz: Bir hata raporu aldım — uçuş sayfasında Safari'de bir şey bozuk. Neler olduğunu çözebilir misin?

Aracı: Elbette, bir bakayım.

Aracı: Safari'de uçuş sayfasında iki farklı hata buldum. İkisini de düzeltmemi ister misin?

Siz: Evet. Safari kullanıcıları için soruna neden olabilecek başka bir şey var mı?

Aracı: Evet, dikkat çekmeye değer iki şey daha var. Sonuçlar animasyonu sessizce bozuk ve API sunucusu başlangıç günlüğü yanlış. İkisini de ele alayım mı?

Başlamak için yalnızca bir başlangıç isteğine ihtiyacınız var ve Safari MCP sunucusunun yardımıyla aracınız oradan devam edebilir.

Safari MCP sunucusu tamamen yerel makinenizde çalışır ve kendi başına hiçbir ağ çağrısı yapmaz. Ayrıca Safari'deki kişisel bilgilerinize (ör. Otomatik Doldurma veya diğer tarayıcı etkinlikleri) erişimi yoktur. Sayfa içeriği, ekran görüntüleri veya konsol günlüklerini yakaladığında, bu veriler doğrudan çalıştırdığınız aracıya gider — Apple'a değil. Bu verilere oradan ne olacağı, kullandığınız aracıya ve modele bağlıdır. Tarayıcınıza erişim verdiğiniz herhangi bir aracıda olduğu gibi, yalnızca güvendiğiniz araçları kullanın.

Bunu neden oluşturduk

Web için, hem yapay zekâ ile hem de yapay zekâsız geliştirmenin birçok yolu vardır. Yapay zekâ iş akışınızın bir parçasıysa, bu aracın onu daha da üretken hale getirmeye yardımcı olacağını düşünüyoruz. Değilse, bu da sorun değil.

Bu kaynağı oluşturarak, aracınızın tarayıcıda şeylerin nasıl göründüğünü ve çalıştığını anlamasına yardımcı olarak Safari'de test etmeyi ve hata ayıklamayı her zamankinden daha kolay hale getirmeyi umuyoruz.

Denemeye karar verirseniz veya bir MCP sunucusunu ilk kez kullanıyorsanız, ne düşündüğünüzü bize bildirin.

Bize çevrimiçi ulaşın: Saron Yitbarek Bluesky, Jen Simmons Bluesky / Mastodon ve Jon Davis Bluesky / Mastodon. Herhangi bir sorunla karşılaşırsanız, bir WebKit hata raporu dosyalayın. Sorun bildirmek gerçekten bir fark yaratır.