Safari MCP

अपडेट: Safari 27 और Safari Technology Preview 247 में, हम Safari MCP सर्वर पेश कर रहे हैं — वेब डेवलपर्स के लिए एक Model Context Protocol सर्वर जो आपके वेब डेवलपमेंट और डिबगिंग वर्कफ़्लो को तेज़ और अधिक शक्तिशाली बनाता है। हम जानते हैं कि एजेंट कोडिंग प्रक्रिया का तेजी से अभिन्न हिस्सा बन रहे हैं, और Safari MCP सर्वर आपके एजेंट को यह क्षमता देता है कि वह जान सके कि आपका कोड ब्राउज़र में वास्तव में कैसे रेंडर होता है, इसे Safari ब्राउज़र विंडो से जोड़कर।

कोई भी MCP-संगत क्लाइंट Safari MCP सर्वर से कनेक्ट हो सकता है। अपने एजेंट को Safari ब्राउज़र विंडो से जोड़कर, आपका एजेंट अनुकरण कर सकता है कि आपके उपयोगकर्ता क्या अनुभव करते हैं, जिससे उसे अधिक स्वायत्त रूप से डिबग करने के लिए आवश्यक जानकारी मिलती है, जैसे DOM तक पहुंच, नेटवर्क अनुरोध, स्क्रीनशॉट, और कंसोल आउटपुट।

यह आपकी डिबगिंग प्रक्रिया को तेज़ करता है और आपको अपने टर्मिनल के आराम में रहने देता है, जिसका मतलब है विंडोज़ के बीच कूदने और अपने कोड को डिबग करने के लिए प्रॉम्प्ट टाइप करने के कम चक्कर।

उपयोग के मामले

यदि आप वेब के लिए बनाते हैं, तो आप डिबगिंग के नृत्य के बारे में जानते हैं। यह आमतौर पर कुछ इस तरह होता है:

आप ब्राउज़र में अपनी साइट में कुछ गलत देखते हैं। आप इसे खोजने के लिए कंसोल खोलते हैं। आप स्टाइल टैब में क्लिक करते हैं। आप देखते हैं कि क्या टूटा है। आप इसे ठीक करने के लिए अपने कोड पर वापस जाते हैं। या शायद आप एक स्क्रीनशॉट लेते हैं, समस्या का विवरण अपने एजेंट को देते हैं, और उसे आपके लिए ठीक करने देते हैं। उम्मीद है कि यह सही करता है, बग ठीक हो जाता है, और आप आगे बढ़ सकते हैं।

लेकिन जब यह ठीक नहीं होता, तो आप फिर से वर्कफ़्लो से गुजरते हैं — ब्राउज़र। प्रॉम्प्ट। एजेंट।

और बार-बार, जब तक आप अंततः बग को खत्म नहीं कर देते।

आप जिस भी ब्राउज़र या टूल का उपयोग करते हैं, डिबगिंग वर्कफ़्लो एक ही फिक्स करने के लिए बहुत सारे क्लिक, टूल और विंडो कूदना है, लेकिन ऐसा होना जरूरी नहीं है। यदि आप पहले से ही अपने डेवलपमेंट वर्कफ़्लो में एजेंट का उपयोग कर रहे हैं, तो Safari MCP सर्वर आपकी डिबगिंग को तेज़ और अधिक कुशल बनाता है।

Safari MCP सर्वर आपके एजेंट को अपने दम पर अधिक डिबगिंग और समस्या निवारण करने में सक्षम बनाता है। यहां कुछ उदाहरण दिए गए हैं कि यह किसमें मदद कर सकता है:

Safari में वेब डेवलपमेंट। अगली बार जब आप Safari में डेवलप करें, तो आपको एक उन्नत वर्कफ़्लो का लाभ मिलेगा। आपका एजेंट पहले से ही आपके कोड में मदद करता है, अब यह और भी अधिक कर सकता है यह जांच कर कि आपका कोड वास्तव में Safari में कैसे रेंडर होता है।

Safari के साथ संगतता में सुधार। केवल एक ब्राउज़र में परीक्षण करने का मतलब है दूसरे में संभावित बग को खोना, जिससे उन उपयोगकर्ताओं को घटिया अनुभव मिलता है। Safari MCP सर्वर के साथ, आपका एजेंट Safari में आपकी साइट खोल सकता है, गणना की गई शैलियों का निरीक्षण कर सकता है, लेआउट की जांच कर सकता है, और विंडो स्विच किए बिना आपकी अपेक्षा के साथ तुलना कर सकता है।

प्रदर्शन का विश्लेषण करें। देखें कि आपकी साइट के कौन से हिस्से चीजों को धीमा कर रहे हैं। Safari MCP सर्वर आपके एजेंट को पृष्ठ पर JavaScript का मूल्यांकन करने देता है ताकि प्रदर्शन मेट्रिक्स सतह पर आ सकें, जैसे नेविगेशन टाइमिंग और संसाधन लोड समय, ताकि यह पहचान सके कि आपकी साइट को क्या धीमा कर रहा है और सही फिक्स पर काम कर सके।

पहुंच की जांच करें। Safari MCP सर्वर आपके एजेंट को सामान्य पहुंच समस्याओं की जांच करने देता है जैसे लापता लेबल, अनुचित ARIA विशेषताएँ, और खराब कंट्रास्ट, ताकि आप उन समस्याओं को पकड़ सकें जो आपके उपयोगकर्ताओं को प्रभावित करती हैं।

किसी भी उपयोगकर्ता स्थिति को सत्यापित करें। जानें कि पृष्ठ काम कर रहा है और जैसा दिखना चाहिए वैसा दिख रहा है। आपका एजेंट फॉर्म की स्थिति की जांच कर सकता है, एक सेलेक्टर का उपयोग करके एक तत्व को क्वेरी कर सकता है, विशिष्ट इंटरैक्शन की पुष्टि कर सकता है, चेकआउट प्रवाह के विभिन्न राज्य दिखा सकता है, और बहुत कुछ। इन मैन्युअल जांचों पर कम समय बिताएं और एजेंट को इसे आपके लिए करने के लिए सशक्त बनाएं।

ये उपयोग के मामलों के कुछ उदाहरण हैं। आप इसे कैसे भी लागू करने का निर्णय लें, Safari MCP सर्वर आपके एजेंट को आपके लिए और अधिक करने में मदद करता है और वेब डेवलपमेंट के लिए अक्सर आवश्यक सभी आगे-पीछे को कम करता है। एक आसान वर्कफ़्लो का मतलब है अधिक बग खत्म, खुश उपयोगकर्ता, और एक बेहतर उत्पाद।

उपकरण

यहां उपलब्ध उपकरण और वे क्या करते हैं:

उपकरण	विवरण
browser_console_messages	वर्तमान या निर्दिष्ट टैब के लिए बफ़र किए गए कंसोल लॉग लौटाएं
browser_dialogs	ब्राउज़र डायलॉग्स की सूची बनाएं और उनका जवाब दें (स्वीकार करें, खारिज करें, या JS प्रॉम्प्ट के लिए टेक्स्ट इनपुट करें)
close_tab	एक ब्राउज़र टैब को उसके हैंडल से बंद करें
create_tab	एक नया ब्राउज़र टैब बनाएं, वैकल्पिक रूप से एक URL लोड करें
evaluate_javascript	पृष्ठ के भीतर JavaScript कोड निष्पादित करें और परिणाम लौटाएं
get_network_request	एक एकल रिकॉर्ड किए गए नेटवर्क अनुरोध के लिए पूर्ण विवरण प्राप्त करें (हेडर, बॉडी, टाइमिंग)
get_page_content	विभिन्न प्रारूपों में पृष्ठ की टेक्स्ट सामग्री निकालें (मार्कडाउन, HTML, JSON, आदि)
list_network_requests	वर्तमान टैब के लिए नेटवर्क अनुरोध सारांश सूचीबद्ध करें (URL, विधि, स्थिति, टाइमिंग)
list_tabs	सभी खुले ब्राउज़र टैब को उनके हैंडल और URL के साथ सूचीबद्ध करें
navigate_to_url	एक URL पर नेविगेट करें और लोड किए गए पृष्ठ की सामग्री लौटाएं
page_info	वर्तमान पृष्ठ के बारे में जानकारी प्राप्त करें: URL, शीर्षक, और लोडिंग स्थिति
page_interactions	क्रम में DOM इंटरैक्शन करें: क्लिक, टाइप, स्क्रॉल, होवर, keyPress, आदि
screenshot	वर्तमान पृष्ठ का PNG के रूप में स्क्रीनशॉट कैप्चर करें
set_emulated_media	एक CSS मीडिया प्रकार का अनुकरण करें (जैसे "print") प्रतिक्रियाशील-डिज़ाइन परीक्षण के लिए
set_viewport_size	ब्राउज़र व्यूपोर्ट आकार CSS पिक्सेल में सेट करें
switch_tab	इसके हैंडल द्वारा एक अलग ब्राउज़र टैब पर स्विच करें
wait_for_navigation	वर्तमान पृष्ठ के लोडिंग समाप्त होने की प्रतीक्षा करें; अंतिम URL और शीर्षक लौटाएं

Safari MCP सर्वर के साथ, आपको अब सही प्रॉम्प्ट लिखने की ज़रूरत नहीं है, ध्यान से अपने एजेंट को बताते हुए कि आप ब्राउज़र में क्या अनुभव कर रहे हैं। आप अपने एजेंट को खुद पता लगाने की क्षमता दे सकते हैं।

आरंभ कैसे करें

Safari 27

पहले, आपको Safari 27 स्थापित करना होगा। एक बार स्थापित होने के बाद, वेब डेवलपर सुविधाओं और रिमोट ऑटोमेशन को सक्षम करना सुनिश्चित करें। वेब डेवलपर्स के लिए सुविधाएं सक्षम करने के लिए Safari > Settings > Advanced > चुनें और Show features for web developers चेकबॉक्स को चेक करें। फिर Safari > Settings > Developer > पर जाएं और "Allow remote automation and external agents" चेक करें।

यदि आप Claude का उपयोग कर रहे हैं, तो आप अपने टर्मिनल में निम्न कमांड का उपयोग कर सकते हैं:

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

यदि आप Codex का उपयोग कर रहे हैं, तो आप अपने टर्मिनल में निम्न कमांड का उपयोग कर सकते हैं:

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

अन्य एजेंटों के लिए, आप निम्न को अपनी mcp.json या config.json फ़ाइल में रख सकते हैं।

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

Safari Technology Preview

पहले, आपको Safari Technology Preview स्थापित करना होगा। एक बार स्थापित होने के बाद, सुनिश्चित करें कि आप Safari Settings > Advanced > Show features for web developers सक्षम करते हैं। फिर Safari Settings > Developer > Enable remote automation and external agents पर जाएं।

यदि आप Claude का उपयोग कर रहे हैं, तो आप अपने टर्मिनल में निम्न कमांड का उपयोग कर सकते हैं:

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

यदि आप Codex का उपयोग कर रहे हैं, तो आप अपने टर्मिनल में निम्न कमांड का उपयोग कर सकते हैं:

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

अन्य एजेंटों के लिए, आप निम्न को अपनी mcp.json या config.json में रख सकते हैं:

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

ध्यान दें कि जबकि उपरोक्त कोड सर्वर का नाम safari-mcp-stp रखता है, आप इसे जो चाहें नाम दे सकते हैं, यहां तक कि सिर्फ safari भी। एक बार जब आप Safari MCP सर्वर स्थापित कर लें, तो निम्न में से एक प्रॉम्प्ट आज़माएं:

Find bugs on my site in Safari

How accessible is my site in Safari?

See how my website performs in Safari

जबकि प्रत्येक एजेंट थोड़ा अलग काम करता है, उसे Safari MCP सर्वर का उपयोग करने के लिए स्पष्ट रूप से बताने की आवश्यकता नहीं होनी चाहिए — यह अपने आप समझ जाएगा। उपरोक्त जैसे सरल प्रॉम्प्ट MCP शुरू करने के लिए पर्याप्त हैं।

यहां बताया गया है कि Safari MCP सर्वर का उपयोग करने वाले एजेंट के साथ बातचीत कैसे हो सकती है:

आप: एक बग रिपोर्ट मिली — फ्लाइट पेज पर Safari में कुछ टूटा हुआ है। क्या आप पता लगा सकते हैं कि क्या हो रहा है?

एजेंट: बिल्कुल, मुझे देखने दीजिए।

एजेंट: मुझे Safari में फ्लाइट पेज पर दो अलग-अलग बग मिले। क्या आप चाहते हैं कि मैं दोनों को ठीक कर दूं?

आप: हाँ। क्या यहां कुछ और है जो Safari उपयोगकर्ताओं के लिए समस्या पैदा कर सकता है?

एजेंट: हाँ, दो और चीजें ध्यान देने योग्य हैं। परिणाम दिखाने वाला एनीमेशन चुपचाप टूटा हुआ है और API सर्वर स्टार्टअप लॉग गलत है। क्या मुझे दोनों को भी संभालना चाहिए?

आपको बस शुरू करने के लिए एक प्रारंभिक अनुरोध चाहिए, और Safari MCP सर्वर की मदद से, आपका एजेंट वहां से इसे संभाल सकता है।

Safari MCP सर्वर पूरी तरह से आपकी स्थानीय मशीन पर चलता है और अपनी ओर से कोई नेटवर्क कॉल नहीं करता है। इसके पास Safari में आपकी व्यक्तिगत जानकारी तक भी पहुंच नहीं है (जैसे AutoFill या अन्य ब्राउज़र गतिविधि)। जब यह पृष्ठ सामग्री, स्क्रीनशॉट, या कंसोल लॉग कैप्चर करता है, तो वह डेटा सीधे आपके चल रहे एजेंट के पास जाता है — Apple के पास नहीं। वहां से उस डेटा के साथ क्या होता है यह आपके उपयोग कर रहे एजेंट और मॉडल पर निर्भर करता है। किसी भी एजेंट की तरह जिसे आप अपने ब्राउज़र तक पहुंच देते हैं, केवल उन्हीं का उपयोग करें जिन पर आप भरोसा करते हैं।

हमने यह क्यों बनाया

वेब के लिए बनाने के कई तरीके हैं, AI के साथ और बिना दोनों। यदि AI आपके वर्कफ़्लो का हिस्सा है, तो हमें लगता है कि यह उपकरण इसे और भी अधिक उत्पादक बनाने में मदद करेगा। और यदि यह नहीं है, तो यह भी ठीक है।

इस संसाधन को बनाकर, हम आशा करते हैं कि Safari में परीक्षण और डिबगिंग को पहले से कहीं अधिक आसान बनाया जा सके, आपके एजेंट को यह समझने में मदद करके कि चीजें ब्राउज़र में कैसी दिखती हैं और कैसे काम करती हैं।

यदि आप इसे आज़माते हैं या यदि यह आपका पहली बार MCP सर्वर का उपयोग करना है, तो हमें बताएं कि आप क्या सोचते हैं।

हमें ऑनलाइन खोजें: Saron Yitbarek Bluesky पर, Jen Simmons Bluesky / Mastodon पर, और Jon Davis Bluesky / Mastodon पर। यदि आपको कोई समस्या आती है, तो WebKit बग रिपोर्ट दर्ज करें। समस्याएं दर्ज करना वास्तव में फर्क डालता है।