How to debug Windows Phone HTML5 Apps (Arabic)

From Nokia Developer Wiki
Jump to: navigation, search

يوضح هذا المقال كيفية تصحيح أخطاء تطبيقات HTML5 لمنصة ويندوز الهاتف

WP Metro Icon Bug.png
WP Metro Icon WP8.png
SignpostIcon WP7 70px.png
Article Metadata
By bintk
Last edited: hamishwillee (19 Jul 2013)

لمحه عامة

تصحيح تطبيقات ال (اتش تي ام ال ) ليست بالعملية السهله وحتي اليوم لم أكن أعرف كيفيه فعل ذلك للويندوز فون 7.1 , وفي هذه الويكي سوف نشرح كيفية فعلها للويندوز فون بأستخدام (الفون جاب ) او اندرويد / ايفون وهذه الأداه الغامضة نوعاً ما تسمح لك تسمح لك بتصحيح التطبيقات على المتصفح و كأنهما تعمل على الهاتف .


In order to install Weinre you will need to download and install NodeJS


Once you have installed NodeJS restart your machine this way you will be able to run the NodeJS commands from the command prompt. After restart open a command prompt window and run this command:

npm install weinre -g  

This will install the Weinre package globally. This is what you should see in the Command Prompt window:

Weinre Install

When the installer has finished its work you are ready to run the Weinre server on your PC. Execute this command from the Command Prompt:

weinre --boundHost -all- --debug -true  

With these parameters Weinre should also open the firewall port. For more parameters have a look at this page. You can verify if the server started by opening a browser page and loading 127.0.01:8080 (8080 is the default port for Weinre). If you are seeing this page then the server is running:

Server running

Now click on the Debug Client User Interface link where you will be able to see if any client is connected and debug the connected clients.

Let's create the Windows Phone HTML5 application. Use the SDK template to create a new project, open the page index.html inside the folder Html and add this line to the head section:

<script src="http://[the server ip]:8080/target/target-script-min.js#anonymous"></script>  

replace [the server ip] with the IP of the PC running the Weinre server and run the application. If everything went as we expected in the Debug Client user Interface on the Server we should see one Target connected:

Client connected

Once the target Windows Phone page is connected you can inspect and change the DOM in real-time, execute javascripts:


In this particular case I've only changed the background of the page but you can do whatever you want. Here you can find further details on how to use the Server User Interface.

Using the Console panel you can execute arbitrary JavaScript expressions/statements. It also shows the output from various console methods, like console.log().


This is pretty much everything. Simple and hopefully useful. If you need to debug your HTML5 windows phone applications.


This page was last modified on 19 July 2013, at 07:35.
130 page views in the last 30 days.