Giter Club home page Giter Club logo

microsoft-graph-explorer-v4's Introduction

Microsoft Graph Explorer V4

Build Status

The Microsoft Graph Explorer V4 lets developers quickly navigate and test API endpoints.

The Graph Explorer is written in TypeScript and powered by:

Running the explorer locally

Microsoft Graph Explorer is built and developed using node v18.

  • npm install to install project dependencies. npm is installed by default with Node.js.
  • npm start starts the TypeScript compiler in watch mode and the local server. It should open your browser automatically with the Graph Explorer at http://localhost:3000/.

Enabling authentication with your own credentials

  • Sign in to your Microsoft account (or Create one) at the Microsoft Azure Portal.
  • Find the Azure service named App registrations. If you haven't used this service before, you might need to search for it in the search bar.
  • In the App registrations page, click + New registration. You will be redirected to a form in the Microsoft Azure portal where you Register an application. Fill out the form and set the Redirect URI to a Single-page application (SPA) with http://localhost:3000. You can also set it from authentication tab in the app you have just created.
  • Create a .env file at the root of the project/repo and add the following keys. - REACT_APP_CLIENT_ID=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx - REACT_APP_INSTRUMENTATION_KEY=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx Where REACT_APP_CLIENT_ID is the Application (client) ID from the Azure portal and REACT_APP_INSTRUMENTATION_KEY is the Object ID from the portal.

Other commands

  • npm test to run tests from the command line for scenarios like parsing metadata and functional explorer tests.
  • npm run lint linting your files

Getting Help & Guides

Where To Get Support

Are you having any trouble with Micrososft Graph or would you like to request a Graph feature?

Are you new to Graph Explorer or would like to raise a bug or request a feature?

Building Apps & Accessing M365 Data

  • To simplify your Microsoft Graph app-building experience, use our Microsoft Graph SDKs and Microsoft Graph Toolkit (MGT) which provide fully functional and out-of-the-box web components.

  • Refer to Microsoft Graph Quick Start to get a pre-initialized SDK sample application up and running in less 3 minutes using the language of your choice.

Contributing

Please see the contributing guidelines.

This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact [email protected] with any additional questions or comments.

E2E playwright testing

  • Playwright requires a running GE Url to run against.
  • In your .env file, create add variables:
    • PLAYWRIGHT_TESTS_USERNAME='your demo tenant email address'
    • PLAYWRIGHT_TESTS_PASSWORD='password to the demo tenant account'
    • PLAYWRIGHT_TESTS_BASE_URL='url that you are running against' // http://localhost:3000 if testing locally
  • Save your changes.
  • On your terminal run the command npx playwright install
  • On your terminal run the command npx playwright install-deps.
  • Once the installation is complete run the command npx playwright test ui.
  • Playwright commands can be extended using arguments described in the official documentation Running tests

Additional resources

Copyright

Copyright (c) 2017 Microsoft. All rights reserved.

microsoft-graph-explorer-v4's People

Contributors

acchiang avatar agrabhi avatar andrueastman avatar ashikpaul avatar ayubun avatar baywet avatar bcameron1231 avatar darrelmiller avatar dependabot[bot] avatar elinorw avatar ezkemboi avatar gavinbarron avatar github-actions[bot] avatar gracet9182 avatar irvinesunday avatar jobala avatar kachulio1 avatar lhao03 avatar maggiekimani1 avatar maryanngitonga avatar michaelmainer avatar millicentachieng avatar msftgits avatar officeglobal avatar olprod avatar onokaev avatar quantum-35 avatar shjokie avatar thewahome avatar tony-xia avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

microsoft-graph-explorer-v4's Issues

Certain default values returning null

Use the issues in this repository to open issues about the Graph Explorer application. Questions about the Microsoft Graph should be directed to StackOverflow. Use the [microsoftgraph] tag on StackOverflow.

Expected behavior

Let's say I have a user "[email protected]" and I have an administrator "[email protected]" who has User.ReadBasicAll permissions to the domain.

If I visit the https://graph.microsoft.com/v1.0/users/[email protected] endpoint while logged in as '[email protected]', I expect:

{
    "@odata.context": "https://graph.microsoft.com/v1.0/$metadata#users/$entity",
    "businessPhones": [],
    "displayName": "Joe Smith",
    "givenName": "Joe",
    "jobTitle": "Senior Analyst, Analysis Services",
    "mail": "[email protected]",
    "mobilePhone": "123-456-7890",
    "officeLocation": "The Moon",
    "preferredLanguage": "en-US",
    "surname": "Smith",
    "userPrincipalName": "[email protected]",
    "id": "1532477f-026d-4742-ab6e-6c1796521530"
}

I do not believe we've set any special permissions on those fields that are returning null, nor would I even know how to do such a thing.

Actual behavior

When I run the query, I get back:

{
    "@odata.context": "https://graph.microsoft.com/v1.0/$metadata#users/$entity",
    "businessPhones": [],
    "displayName": "Joe Smith",
    "givenName": "Joe",
    "jobTitle": null,
    "mail": "[email protected]",
    "mobilePhone": null,
    "officeLocation": null,
    "preferredLanguage": null,
    "surname": "Smith",
    "userPrincipalName": "[email protected]",
    "id": "1532477f-026d-4742-ab6e-6c1796521530"
}

Steps to reproduce the behavior

  1. Log in as a user with User.ReadBasicAll permissions on the domain
  2. Look up another user

HTTP traffic capture

n/a
AB#7533

Remove admin permissions by default

I think we should remove admin permissions in UI if the user does have those permissions.

I am using browser private mode to log in my account, you can see it has admin permissions by default, although I actually don't have admin permissions.

And even after I removing these permissions, when I log in again, they are back.

image

2121657

improvement : pre-fill payload for requests

Putting a part of the conversation I just had with @yinaa a couple of minutes ago.
It'd be awesome to save time and to avoid typos during demos to have a button "pre-fill payload" when building any POST/PUT request.
Clicking that button would look at the url template I currently have and get the standard JSON payload to put it in the payload box.

AB#7537

Parse example request into component parts needed for updating store.

We need to be able to parse method, URL, headers and body out of example requests like this:

https://docs.microsoft.com/en-us/graph/api/user-list-calendars?view=graph-rest-1.0#http-request
https://docs.microsoft.com/en-us/graph/api/user-post-calendars?view=graph-rest-1.0#example

Where there are multiple requests in a single example, we need to determine which request to use. If an example has no parameter, it should be preferred.

Display image response

Firing the my photo request does not show the related profile image response.

##Expected:
Firing a 'my photo' request results in an image being shown in the response component

##Actual results:

  • the response contains an empty object
  • The photo is not displayed

Profile Component Populates QueryResponse

When the Customer authenticates, the Profile Component populates the QueryResponse Component.

The expected behaviour is that the QueryResponse is not populated on authentication.

The QueryResponse Component should only be populated on running a query.

Multi-line Query Editor

Some queries can become exceptionally long making it quite challenging to read or edit the query.

The query editor should optionally support multiple lines, similar in functionality to Excel's formula editor.

2121659
AB#7538

improvement: link to entities in the response

Second part of the conversation I just had with @yinaa it'd be awesome to have above or under the response json preview a list of links of the entities in the response.
When clicking on the link, it would pre-fill the url box with the proper url.
This would save me time during the demonstrations when I copy/past id's to build requests. Avoid typos as well.

AB#7535

Changing Permissions

When a user changes the selected permissions those changes don't seem to be persisted. I believe this is due to the re-authentication not forcing the user to also re-consent to the new set of scopes.

Today the code is passing prompt=select_account in the query string. From the documentation, it doesn't look like select_account is supported in the v2 Endpoint. Possibly just a carried over option that predate switching to v2?

Regardless, manually switching this to prompt=consent successfully results in the new permissions being persisted.

Would it make sense to switch to prompt=consent (at least within the context scopes-dialog.component.ts)?
AB#7540

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.